在Android上使用MAUI中的选项卡时,图标图像不显示

ylamdve6  于 2023-02-02  发布在  Android
关注(0)|答案(1)|浏览(321)

我尝试在我的MAUI应用程序上添加带有标签的标签栏,它可以很好地在页面之间显示和导航。但是由于某种原因,我无法在标签图标属性中显示图像。我只得到一个圆点。尽管我注意到如果我错误地引用图像,圆点会消失。

我看过一些YouTube视频,我遵循了Microsoft Shell选项卡的基本原理,我尝试过使用其他图标和扩展,我尝试过将图标添加到ShellContent中,但我仍然只得到了圆点。

<Shell
    x:Class="MyApp.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MyApp">

    <TabBar>
        <Tab Title="Counter" 
             Icon="counter.png">
            <ShellContent
                ContentTemplate="{DataTemplate local:MainPage}"/>
        </Tab>
        <Tab Title="Log"
             Icon="log.png">
            <ShellContent
                ContentTemplate="{DataTemplate local:Log}"/>
        </Tab>
        <Tab Title="About"
             Icon="about.png">
            <ShellContent 
                ContentTemplate="{DataTemplate local:About}"/>
        </Tab>
    </TabBar>
</Shell>

如果我使用的是没有Tab或TabBar的常规ShellContent,这些图标可以完美地工作。

<Shell
    x:Class="MyApp.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MyApp"
    FlyoutBehavior="Flyout">

    <ShellContent
        Title="Counter"
        ContentTemplate="{DataTemplate local:MainPage}"
        Icon="counter.png"
        Route="MainPage" />

    <ShellContent
        Title="Log"
        ContentTemplate="{DataTemplate local:Log}"
        Icon="log.png"
        Route="Log" />

    <ShellContent
        Title="About"
        ContentTemplate="{DataTemplate local:About}"
        Icon="about.png"
        Route="About" />
</Shell>

我唯一没有尝试过的是在微软基础上使用的xmlns:local="clr-namespace:MyApp.View",但是YouTube上的一个视频也没有使用这个MVVM模式。
有什么建议或想法吗?

3ks5zfa0

3ks5zfa01#

似乎android不支持设置彩色图像作为标签图标。我已经尝试了你的代码与两种图像。有我的代码:

<TabBar>
        <Tab
            Title="Home"
            Icon="first.png">
            <ShellContent ContentTemplate="{DataTemplate local:MainPage}"/>
        </Tab>
        <Tab  Title="NewPage"
        Icon="second.png">
            <ShellContent ContentTemplate="{DataTemplate local:NewPage1}"/>
        </Tab>
    </TabBar>
    <ShellContent
        Title="Home"
        Icon="first.png"
        ContentTemplate="{DataTemplate local:MainPage}"
        Route="MainPage" />
    <ShellContent
        Title="NewPage"
        Icon="second.png"
        ContentTemplate="{DataTemplate local:NewPage1}"
        Route="NewPage1" />

和彩色图像的结果:

如果图像是彩色图像,则图标将变为圆点。
白色图片的结果:

图标可以在flyouitem和tabbar中正确显示。

相关问题