ToolbarItems 图标未显示

Question

如何在文本“分享”之前添加一个图标？

下面的代码只显示文本而不是图标。 我已将图标添加到可绘制文件夹中

<ContentPage.ToolbarItems>
    <ToolbarItem Name="Share" Order="Secondary" IconImageSource="icon_share.png" Icon="icon_share.png" Priority="0" />
    <ToolbarItem Name="Delete" Order="Secondary" IconImageSource="icon_delete.png" Icon="icon_delete.png" Priority="1" />
</ContentPage.ToolbarItems>

Answer 1

Secondary Toolbar item的图标被设计隐藏。

检查线程：

如何更改辅助工具栏的图标 Xamarin Forms 。 https://forums.xamarin.com/discussion/47989/icon-for-toolbaritem-with-order-secondary 。

我创建了链接中提到的解决方法，它工作正常。

Xaml

 <ContentPage.ToolbarItems>
        <ToolbarItem Order="Primary" Icon="dots.png" Priority="1" Clicked="ToolbarItem_Clicked" />
    </ContentPage.ToolbarItems>

    <RelativeLayout>
        <ListView x:Name="SecondaryToolbarListView" 
                  VerticalOptions="Start" 
                  HorizontalOptions="Start"
                  WidthRequest="150" IsVisible="False"
                  ItemTapped="SecondaryToolbarListView_ItemTapped"
                  RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1, Constant=-160}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout  Orientation="Horizontal" Spacing="10" Padding="5,5,5,5">
                            <Image HeightRequest="30" HorizontalOptions="Start" VerticalOptions="Center" Source="{Binding ImagePath}" />
                            <Label FontSize="15" VerticalOptions="Center" HorizontalOptions="Start" Text="{Binding MenuText}"/>
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </RelativeLayout>

背后的代码

    public class ToolbarItemModel
    {
        public string ImagePath { get; set; }
        public string MenuText { get; set; }
    }

  public Page2()
        {
            InitializeComponent();

            var items = new List<ToolbarItemModel>
            {
                new ToolbarItemModel {ImagePath = "dog.png", MenuText = "First Item"},
                new ToolbarItemModel {ImagePath = "dog.png", MenuText = "Second Item"}
            };
            SecondaryToolbarListView.ItemsSource = items;
        }

        private void ToolbarItem_Clicked(object sender, EventArgs e)
        {
            SecondaryToolbarListView.IsVisible = !SecondaryToolbarListView.IsVisible;
        }

        private void SecondaryToolbarListView_ItemTapped(object sender, ItemTappedEventArgs e)
        {

        }

Answer 2

图片没有出现是因为您错误地将icon_share.png和icon_delete.png添加到您的项目中。

以下是Microsoft 关于如何将图像添加到 Xamarin.Forms 项目的建议：

图像文件可以添加到每个应用程序项目中，并从 Xamarin.Forms 共享代码中引用。 当图像是特定于平台的时，例如在不同平台上使用不同的分辨率或略有不同的设计时，需要这种分发图像的方法。

要在所有应用程序中使用单个图像，必须在每个平台上使用相同的文件名，并且它应该是有效的 Android 资源名称（即只允许小写字母、数字、下划线和句点）。

iOS - 自 iOS 9 以来管理和支持图像的首选方法是使用资产目录图像集，其中应包含支持应用程序的各种设备和比例因子所需的所有图像版本。 有关更多信息，请参阅将图像添加到资产目录图像集。

Android - 使用 Build Action: AndroidResource 将图像放置在 Resources/drawable 目录中。 还可以提供图像的高和低 DPI 版本（在适当命名的资源子目录中，例如 drawable-ldpi、drawable-hdpi 和 drawable-xhdpi）。

通用 Windows 平台 (UWP) - 默认情况下，图像应放置在应用程序的根目录中，构建操作：内容。 或者，可以将图像放置在不同的目录中，然后使用特定于平台的方式指定该目录。 有关详细信息，请参阅 Windows 上的默认映像目录。

建议

1. 永久删除Icon ； Icon被弃用，取而代之的是IconImageSource
2. 暂时删除IconImageSource ，将其替换为Text="Share"和Text="Delete" ：

• 这将确认ContentPage.ToolbarItems工作正常，并且您已错误地将png图像添加到 Xamarin.Forms 项目

<ContentPage.ToolbarItems>
    <ToolbarItem Name="Share" Order="Secondary" Text="Share" />
    <ToolbarItem Name="Delete" Order="Secondary" Text="Delete" />
</ContentPage.ToolbarItems>