.NET MAUI如何根据平台条件隐藏Shell TabBar中的标签

我需要在Windows平台隐藏AppShell中“Scan QR”这个Tab，只在iOS和Android显示，已知Tab有IsVisible属性，该怎么基于平台做条件控制？

我的AppShell TabBar代码如下：

<TabBar>
    <Tab Title="Home" Icon="{StaticResource IconHome}">
        <ShellContent ContentTemplate="{DataTemplate local:MainPage}" />
    </Tab>
    <Tab Title="Estimator" Icon="{StaticResource IconCalculator}" >
        <ShellContent ContentTemplate="{DataTemplate calculator:CoverageCalculatorPage}" />
    </Tab>
    <Tab Title="Distributors" Icon="{StaticResource IconLocator}">
        <ShellContent ContentTemplate="{DataTemplate locator:DistributorsLocatorPage}" />
    </Tab>
    <Tab Title="Scan QR" Icon="{StaticResource IconQrScanner}">
        <ShellContent ContentTemplate="{DataTemplate qrScanner:QrScannerPage}" />
    </Tab>        
    <Tab Title="More" Icon="{StaticResource IconMore}">
        <ShellContent ContentTemplate="{DataTemplate more:MoreFeaturesPage}" />
    </Tab>
</TabBar>

解决方案1：XAML内直接用OnPlatform设置（最简便） #

直接给“Scan QR”的Tab添加IsVisible属性，通过OnPlatform针对不同平台配置布尔值：

<Tab Title="Scan QR" Icon="{StaticResource IconQrScanner}">
    <Tab.IsVisible>
        <OnPlatform x:TypeArguments="x:Boolean">
            <!-- 安卓和iOS显示 -->
            <On Platform="Android, iOS" Value="True" />
            <!-- Windows隐藏 -->
            <On Platform="Windows" Value="False" />
        </OnPlatform>
    </Tab.IsVisible>
    <ShellContent ContentTemplate="{DataTemplate qrScanner:QrScannerPage}" />
</Tab>

这种方式无需额外代码，直接在XAML中完成平台差异化配置，逻辑清晰，适合简单的可见性控制场景。

解决方案2：代码后台通过编译指令控制 #

如果需要更灵活的逻辑（比如结合其他条件判断），可以在AppShell.xaml.cs中处理：

1. 先给目标Tab设置x:Name方便直接访问：

<Tab x:Name="ScanQrTab" Title="Scan QR" Icon="{StaticResource IconQrScanner}">
    <ShellContent ContentTemplate="{DataTemplate qrScanner:QrScannerPage}" />
</Tab>

2. 在后台代码中利用编译指令控制可见性：

public AppShell()
{
    InitializeComponent();
#if WINDOWS
    ScanQrTab.IsVisible = false;
#else
    ScanQrTab.IsVisible = true;
#endif
}

编译指令会在编译阶段就决定对应平台的代码是否生效，性能更优，也能避免运行时的平台检测逻辑。

解决方案3：绑定ViewModel属性（适合MVVM架构） #

如果你的项目采用MVVM模式，可以在ViewModel中定义一个平台检测属性，通过绑定控制可见性：

1. 在ViewModel中添加属性：

using Microsoft.Maui.Devices;

public bool IsScanQrVisible => DeviceInfo.Platform != DevicePlatform.WinUI;

2. 给AppShell设置BindingContext（比如在构造函数中）：

public AppShell()
{
    InitializeComponent();
    BindingContext = new YourViewModel();
}

3. 在XAML中绑定IsVisible属性：

<Tab Title="Scan QR" Icon="{StaticResource IconQrScanner}" IsVisible="{Binding IsScanQrVisible}">
    <ShellContent ContentTemplate="{DataTemplate qrScanner:QrScannerPage}" />
</Tab>

这种方式把平台检测逻辑封装在ViewModel中，符合MVVM的关注点分离原则，适合复杂场景下的状态控制。

内容的提问来源于stack exchange，提问作者David Shochet