Question

我正在使用UWP应用，我对底部应用栏图标有问题，但无法正常显示。

我使用了尺寸为48 * 48尺寸的PNG格式图片，但图标在底部应用栏中无法正常显示。我附上了底部应用栏的截图。

截图：

这是我的代码，任何人都可以建议我如何获得底部应用栏的正确图标。

<Page.BottomAppBar>
        <AppBar x:Name="applicationbar"  Background="#FFE45427"  IsSticky="True" PointerEntered="applicationbar_PointerEntered" PointerExited="applicationbar_PointerExisted" >
            <StackPanel x:Name="bottombar" ScrollViewer.IsHorizontalRailEnabled="True"  Orientation="Horizontal" HorizontalAlignment="Center">

                <AppBarButton Label="HOME" x:Name="appbarhome"    Click="appbarhome_Click" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="Dashboard" ToolTipService.Placement="Top">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="Images/DashboardImages/product-default-small.png"  />
                    </AppBarButton.Icon>
                </AppBarButton>

                <AppBarButton Label="Sales" x:Name="appbarsales"   Click="appbarsales_Click" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="Sales" ToolTipService.Placement="Top">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="Images/DashboardImages/menu_sales.png"/>
                    </AppBarButton.Icon>
                </AppBarButton>


                <AppBarButton Label="POS" x:Name="appbarpos"   Click="appbarpos_Click" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="POS" ToolTipService.Placement="Top">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="Images/DashboardImages/menu_pos.png"/>
                    </AppBarButton.Icon>
                </AppBarButton>


                <AppBarButton Label="Customer" x:Name="appbarcustomer"  Click="customer_Click" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="Customer" ToolTipService.Placement="Top">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="Images/DashboardImages/menu_customers.png"/>
                    </AppBarButton.Icon>
                </AppBarButton>

                <AppBarButton Label="About US" x:Name="appbarAboutUs"  Click="aboutus_click" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="About us" ToolTipService.Placement="Top">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="Images/DashboardImages/menu_aboutus.png"/>
                    </AppBarButton.Icon>
                </AppBarButton>

</Page.BottomAppBar>

Answer 1

根据generating icon image

的主题

这7个模板/操作实际上输出了68个所需和推荐的图像资源，适用于所有比例尺寸（100,125,150,200,400）和确保您的应用在任何屏幕上看起来都很棒的包图像！

因此，您需要为其他屏幕分辨率创建和调整图标大小并应用正确的名称：

menu_aboutus.Scale-100.png
menu_aboutus.Scale-125.png
menu_aboutus.Scale-150.png
menu_aboutus.Scale-200.png
menu_aboutus.Scale-400.png

操作系统会自动选择正确的图标

底部的应用程序栏图标显示模糊

1 个答案: