Question

我在'Images'文件夹中有两张图片。尝试在页面中加载这些图像，但图像未显示在页面上。它在调试中不会产生任何错误。我正在检查Xamarin现场播放器Android设备。

ImageResourceExtension.cs

    using System;
    using Xamarin.Forms;
    using Xamarin.Forms.Xaml;
    using Xamarin.Forms.Internals;

    namespace Buffting
    {
        // You exclude the 'Extension' suffix when using in Xaml markup
        [Preserve(AllMembers = true)]
        [ContentProperty(nameof(Source))]
        public class ImageResourceExtension : IMarkupExtension
        {
            public string Source { get; set; }
            public object ProvideValue(IServiceProvider serviceProvider)
            {
                if (Source == null)
                    return null;
                // Do your translation lookup here, using whatever method you require
                var imageSource = ImageSource.FromResource(Source);
                return imageSource;
            }
        }
    }

BeautySalon.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:Buffting;assembly=Buffting"
             x:Class="Buffting.Home.BeautySalon"
             Title="Beauty Salon">
    <ContentPage.Content>
        <ListView  x:Name="SalonList" RowHeight="370">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Frame Margin="5,5,5,-5" OutlineColor="Blue" HasShadow="true">
                            <Grid>
                                <Grid Grid.Row="0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="200"   />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <Image Grid.Row="0" Grid.ColumnSpan="2"  HeightRequest="200"  Source="{ Binding SalonImage}"  VerticalOptions="Fill"  Aspect="AspectFill"  />
                                </Grid>
                                <Grid Grid.Row="1" Padding="10">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <Label Grid.Row="1" Grid.Column="0" Margin="0, 40, 0, 0" Text="{ Binding SalonName }" FontSize="Large" TextColor="White" />
                                    <Image Grid.Row="1" Grid.Column="1" x:Name="Star" Source="{local:ImageResource Buffting.Images.star_outline.png}" />
                                </Grid>

                                <Grid Grid.Row="2" Padding="0, 0, 10, 0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="100" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <Label Grid.Row="0" Grid.Column="0" Text="Location:" FontAttributes="Bold" FontSize="Small" TextColor="Black" />
                                    <Label Grid.Row="0" Grid.Column="1" Text="{ Binding Location}"  />
                                    <Label Grid.Row="1" Grid.Column="0" Text="Full Address:" FontAttributes="Bold" FontSize="Small" TextColor="Black"  />
                                    <Label Grid.Row="1" Grid.Column="1" Text="{ Binding Address}"  />
                                    <Label Grid.Row="2" Grid.Column="0" Text="Phone:" FontAttributes="Bold" FontSize="Small" TextColor="Black"  />
                                    <Label Grid.Row="2" Grid.Column="1" Text="{ Binding Phone}"  />
                                    <Label Grid.Row="3" Grid.Column="0" Text="Opening Time:" FontAttributes="Bold" FontSize="Small" TextColor="Black"  />
                                    <Label Grid.Row="3" Grid.Column="1" Text="{ Binding OpeningTime}"  />
                                </Grid>
                            </Grid>
                        </Frame>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </ContentPage.Content>
</ContentPage>

我正在使用此代码，但图片未加载。我是Xamarin的新人，请指导我。

Answer 1

这是错误的，图像放在每个本机项目中。对于Xamarin.Forms，您应该将图像放在Drawables文件夹中。

如果你的项目是android和ios，你最终有两个图像：一个在iosproject / Resources中，另一个在AndroidProject / Resources / Drawab中。

请参阅Images Doc

Answer 2

如果要从共享程序集加载图像。确保将图像设置为＆＃34; EmbeddedResource＆＃34; （右键单击：属性，构建操作）。

Answer 3

您还在原生项目中添加了每个图像。以下是它应该如何显示的示例：

您可以使用以下插件为iOS生成图片：

插件：Link

对于Android：

对于IOS：

您现在可以在xaml中引用图像：

<Image Source="star_outline.png" />
<Image Source="star_selected.png" />

更新：

在您的xaml更改中：

<Image Grid.Row="1" Grid.Column="1" x:Name="Star" Source="{local:ImageResource Buffting.Images.star_outline.png}" />

with：

 <Image Grid.Row="1" Grid.Column="1" x:Name="Star" Source="star_outline.png" />

图像应该出现，这回答了您的主要问题。我不确定为什么你使用IMarkupExtension，你甚至没有在xaml中调用它

Answer 4

我遇到了同样的问题，并在此线程中找到了答案。 Embedded images not showing

使用ImageResourceExtension时，Source属性应以Assembly Na为前缀

嵌入图像未显示在Xamarin.Forms中

4 个答案: