Xamarin UWP 上的黑色/白色图标答案

【问题标题】：Black/white icon on Xamarin UWPXamarin UWP 上的黑色/白色图标
【发布时间】：2018-08-22 08:14:04
【问题描述】：

我在工具栏中显示图标时遇到问题。在 Android 上，它工作正常，但在 UWP 上，图标是白色的，当你将它悬停时是黑色的。你知道怎么解决吗？

安卓：

UWP：

我的代码：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="VwDemo.LoginPage"
             Title="Logowanie">
    <ContentPage.ToolbarItems>
        <ToolbarItem Icon="VwLogo.png" />
    </ContentPage.ToolbarItems>
    <ContentPage.Content>
        <StackLayout VerticalOptions="StartAndExpand" Margin="10,10,10,0">
            <Label Text="Login" />
            <Entry x:Name="LoginEntry" Placeholder="Login"/>
            <Label Text="Hasło" />
            <Entry x:Name="PasswordEntry" IsPassword="True" Placeholder="Hasło" />
            <Button Text="Zaloguj" Clicked="OnLoginButtonClicked" BackgroundColor="#FF3579B4" TextColor="#FFFBF8F8" />
            <Label x:Name="MessageLabel" HorizontalTextAlignment="Center" TextColor="Red" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

【问题讨论】：

你需要让UWP知道你的图片的根位置见以下文档docs.microsoft.com/en-us/previous-versions/windows/apps/…
@StuartSmith 提供的链接是一些旧的 Windows 8 文档，我建议查看这些 xamarin forms docs，上面写着 Universal Windows Platform (UWP) - Place images in the application's root directory带有构建操作：内容。
我在应用程序的根目录中有图像，构建操作设置为内容。 imgur.com/pSaUE05

标签： xamarin.forms xamarin.uwp

【解决方案1】：

我在工具栏中显示图标时遇到问题。在 Android 上，它可以正常工作，但在 UWP 上，图标是白色的，当您将其悬停时，它是黑色的。你知道怎么解决吗？

问题是ToolbarItem对应的本地控制是AppBarButton。而AppBarButton 使用BitmapIcon 作为自定义图标。

<CommandBar  Background="Transparent" IsOpen="False">
     <AppBarButton  Label="BitmapIcon">
         <AppBarButton.Icon>
             <BitmapIcon UriSource="ms-appx:///DA.png" />
         </AppBarButton.Icon>
     </AppBarButton>
 </CommandBar>

如果将图像文件源传递给ToolbarItem，它将在UWP 中以BitmapIcon 呈现。但是，BitmapIcon 文件的限制很少。

您使用的文件应该是透明背景上的纯色图像。从 UriSource 位置检索的位图图像应为具有透明像素和非透明像素的真实位图。推荐的格式是 PNG。

更多信息请参考Remark。

【讨论】：

我有一个透明背景的 .png 文件。

【解决方案2】：

我已经对这个问题进行了一些研究，但我认为您不会像在其他平台上那样得到结果。这是因为 UWP 根据设计显示带有色调的工具栏项。 AppBarButton 是 ToolbarItem (Check UpdateToolbarItems method) 的 Xamarin.Forms 表示形式，具有以下 XAML 样式 XAML styles docs。在这些样式的ContentPresenter 部分，可以看到有一个Foreground 属性，它是工具栏项的色调颜色。

例如，这个 UWP 代码（不是 Xamarin.Forms）：

TopAppBar = new CommandBar();
(TopAppBar as CommandBar).PrimaryCommands.Add(new AppBarButton()
{
    Foreground = new SolidColorBrush(Colors.Aqua),
    Icon = new BitmapIcon()
    {           
        UriSource = new Uri("ms-appx:///Assets/StoreLogo.png")
    },
    Label = "AAA"
});

将产生以下结果。如您所见，Foreground 属性负责为图像着色

没有办法 - 至少我不知道 - 你可以使用ToolbarItem（又名AppBarButton）来显示图像，但它是某种颜色/色调。如果您仍想达到这样的效果，您可能需要创建自己的CommandBar 版本。

您可以做的是更改您用于该大众汽车标志的图像。使其透明（即从中删除蓝色背景）

【讨论】：