如何在Xamarin.Forms中正确使用Image Source属性? [英] How to correctly use the Image Source property with Xamarin.Forms?

问题描述

我在堆栈布局中无法在内容页面上显示图像.我查看了Xamarin API文档，发现 Xamarin.Forms.Image.Source属性，但没有示例代码来查看其编写方式.我还检查了它是如何用C#编写的，并且似乎在文件名路径方面与我的代码匹配，但是在Xamarin中，由于它是第一次这样做，因此可能会略有不同.我目前正在通过Visual Studio 2013中的Android模拟器(Google Nexus 5)测试的代码，该代码运行正常，但图片"未显示.

I am having difficulty bringing up an image on the content page in a stack layout. I looked through Xamarin API Documentation and found Xamarin.Forms.Image.Source Property, but no sample code to see how it's written. I also checked to see how it was written in C# and seems to match my code in terms of filename path, but in Xamarin, it may be slightly different since it's the first time doing this. The code I'm currently testing through an Android emulator (Google Nexus 5) in Visual Studio 2013 which runs fine, with the exception of the Image not showing.

图片来源:

new Image
{
     VerticalOptions = LayoutOptions.Center,
     HorizontalOptions = LayoutOptions.Center,
     Source = "/Assets/xamarin_logo.png",
},

完整代码:

public NFCPage()
    {
        StackLayout stackLayout = new StackLayout // instantiate a StackLayout object to layout its children
        {
            Spacing = 5, // amount of spae between each child element
            //HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.FillAndExpand, // defines how the elements should be laid out; fill the entire width of the content to the screen
            BackgroundColor = Color.Blue,

            Children = // gets a list of child elements
            {
                new Label
                {   
                    TextColor = Color.White,
                    BackgroundColor = Color.Red,
                    XAlign = TextAlignment.Center, // set text alignment horizontally
                    Text = "Google",
                },
                new Label
                {
                    Text = "Place your device directly at the symbol.",
                    XAlign = TextAlignment.Center,
                    TextColor = Color.White,
                },
                new Image
                {
                    VerticalOptions = LayoutOptions.Center,
                    HorizontalOptions = LayoutOptions.Center,
                    Source = "/Assets/xamarin_logo.png",
                },
                new Button
                {
                    Text = "QR Code",
                    TextColor = Color.White,
                },
                new Button
                {
                    Text = "?",
                    TextColor = Color.White,
                },
            }
        };
        Content = stackLayout; // apply stackLayout to Content
    }

推荐答案

您不应引用该路径，因为source属性是跨平台的，并且由于每个平台都为图像之类的资产提供了不同的文件夹，因此您只需要指定文件名和扩展名. Image类知道在哪里查找文件.

You shouldn't reference the path because the source property is cross-platform and since every platform has a different folder for assets like images, you only need to specify the filename and extension. The Image class knows where to look to find the file.

图像文件可以添加到每个应用程序项目中，并可以从Xamarin.Forms共享代码中引用.要在所有应用程序中使用单个图像，必须在每个平台上使用相同的文件名，并且该文件名应为有效的Android资源名称(表示没有空格和特殊字符).使用Build Action:AndroidResource将图像放置在Resources/drawable目录中.也可以提供图像的高DPI和低DPI版本(在适当命名的Resources子目录中，例如drawable-ldpi，drawable-hdpi和drawable-xhdpi).

Image files can be added to each application project and referenced from Xamarin.Forms shared code. To use a single image across all apps, the same filename must be used on every platform, and it should be a valid Android resource name (which means no spaces and special characters). Place images in the Resources/drawable directory with Build Action: AndroidResource . High- and low-DPI versions of an image can also be supplied (in appropriately named Resources subdirectories such as drawable-ldpi , drawable-hdpi , and drawable-xhdpi ).

var beachImage = new Image { Aspect = Aspect.AspectFit };
beachImage.Source = ImageSource.FromFile("waterfront.jpg");

来源: https://developer.xamarin.com/guides/xamarin-forms/working-with/images/#Local_Images

这篇关于如何在Xamarin.Forms中正确使用Image Source属性?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！