.NET MAUI如何移除TabBar中Tab标题的留白

方法1：自定义TabBarItem模板（最直接通用） #

直接在AppShell.xaml里给TabBar设置自定义的ItemTemplate，完全控制图标布局，消除标题占位的留白：

<TabBar>
    <TabBar.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding Icon}"
                   HorizontalOptions="Center"
                   VerticalOptions="Center"
                   WidthRequest="36"
                   HeightRequest="36" />
        </DataTemplate>
    </TabBar.ItemTemplate>

    <!-- 你的Tab项 -->
    <Tab Icon="home.png">
        <ShellContent ContentTemplate="{DataTemplate local:HomePage}" />
    </Tab>
    <Tab Icon="settings.png">
        <ShellContent ContentTemplate="{DataTemplate local:SettingsPage}" />
    </Tab>
</TabBar>

这样图标会占据TabBarItem的整个可用空间，不会留原标题的空白区域，还能通过WidthRequest和HeightRequest直接调整图标大小。

方法2：调整TabBar整体高度配合图标尺寸 #

如果不想自定义模板，可以先修改TabBar的高度，再调整图标大小：
在Resources/Styles/Styles.xaml里添加Shell的TabBar高度样式：

<Style TargetType="TabBar">
    <Setter Property="Shell.TabBarHeight" Value="60" /> <!-- 按需调整，默认一般是80左右 -->
</Style>

然后给每个Tab设置图标高度：

<Tab Icon="home.png" Shell.IconHeight="36">
    <ShellContent ContentTemplate="{DataTemplate local:HomePage}" />
</Tab>

方法3：平台特定配置（针对iOS/Android单独优化） #

iOS平台

在Platforms/iOS/AppDelegate.cs的FinishedLaunching方法中添加代码调整TabBar图标内边距：

public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
    global::Xamarin.Forms.Forms.Init();
    LoadApplication(new App());

    // 消除图标下方留白
    if (UITabBar.Appearance != null)
    {
        UITabBar.Appearance.ItemPositioning = UITabBarItemPositioning.Fill;
        UITabBar.Appearance.ImageInsets = new UIEdgeInsets(0, 0, 0, 0);
    }

    return base.FinishedLaunching(app, options);
}

Android平台

在Platforms/Android/MainActivity.cs的OnCreate方法中获取BottomNavigationView并调整图标参数：

protected override void OnCreate(Bundle savedInstanceState)
{
    base.OnCreate(savedInstanceState);
    global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
    LoadApplication(new App());

    // 调整底部导航栏参数
    var bottomNav = FindViewById<Google.Android.Material.BottomNavigation.BottomNavigationView>(Resource.Id.bottomtab_tabbar);
    if (bottomNav != null)
    {
        bottomNav.LabelVisibilityMode = LabelVisibilityMode.LabelVisibilityUnlabeled;
        var layoutParams = bottomNav.LayoutParameters;
        layoutParams.Height = (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 60, Resources.DisplayMetrics); // 设置导航栏高度
        bottomNav.LayoutParameters = layoutParams;

        // 调整图标大小
        foreach (var item in bottomNav.Menu)
        {
            var icon = item.Icon;
            icon.SetBounds(0, 0, (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 36, Resources.DisplayMetrics), (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 36, Resources.DisplayMetrics));
            item.SetIcon(icon);
        }
    }
}

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