Xamarin Forms：如何通过TabbedPageRenderer减小Tab栏高度

看起来你已经在着手自定义Tab布局了，刚好可以通过自定义Tab布局+调整TabLayout本身的参数来解决上下边距过大、高度过高的问题。我给你梳理一下具体的实现步骤：

1. 完善自定义Tab的布局文件 #

首先把你提到的Resource.Layout.CustomTab.axml（假设文件名是这个）补充完整，去掉默认内边距，精准控制Tab内容的高度：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:paddingTop="4dp"
    android:paddingBottom="4dp"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/tab_icon"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:scaleType="centerInside"/>

    <!-- 如果需要显示Tab文字，可添加以下TextView并控制边距 -->
    <TextView
        android:id="@+id/tab_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="10sp"
        android:paddingTop="2dp"/>
</LinearLayout>

这里的核心是给根布局设置极小的上下padding，同时用wrap_content让Tab高度贴合内容，避免默认的冗余空间。

2. 修改TabbedPageRenderer的实现 #

你需要在Renderer里完成两个核心操作：给每个Tab绑定自定义View，同时调整整个TabLayout的高度和内边距：

[assembly: ExportRenderer(typeof(MyTabbedPage), typeof(MyTabbedPageRenderer))]
namespace TabbedApp.Droid 
{
    public class MyTabbedPageRenderer : TabbedPageRenderer 
    {
        private TabLayout _tabLayout;

        protected override void OnElementChanged(ElementChangedEventArgs<TabbedPage> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                // 获取页面中的TabLayout实例
                _tabLayout = FindViewById<TabLayout>(Resource.Id.sliding_tabs);
                
                if (_tabLayout != null)
                {
                    // 强制缩小TabLayout的最小高度（替换成你想要的数值，比如48dp）
                    _tabLayout.SetMinimumHeight(ConvertDpToPx(48));
                    // 清除TabLayout自身的上下内边距
                    _tabLayout.SetPadding(0, 0, 0, 0);
                    
                    // 遍历所有Tab，为每个Tab设置自定义View
                    for (int i = 0; i < _tabLayout.TabCount; i++)
                    {
                        var tab = _tabLayout.GetTabAt(i);
                        if (tab != null)
                        {
                            SetCustomTabView(tab, Element.Children[i].Icon);
                        }
                    }
                }
            }
        }

        private void SetCustomTabView(TabLayout.Tab tab, FileImageSource icon)
        {
            var view = LayoutInflater.From(Context).Inflate(Resource.Layout.CustomTab, null);
            var tabIcon = view.FindViewById<ImageView>(Resource.Id.tab_icon);
            
            // 为Tab设置图标（可根据你的图标加载逻辑调整）
            if (icon != null)
            {
                var drawableId = Resources.GetIdentifier(icon.File, "drawable", Context.PackageName);
                tabIcon.SetImageDrawable(Context.GetDrawable(drawableId));
            }
            
            // 如果需要设置Tab文字，可在这里获取TextView赋值
            // var tabText = view.FindViewById<TextView>(Resource.Id.tab_text);
            // tabText.Text = tab.Text;
            
            tab.SetCustomView(view);
        }

        // 辅助方法：将dp单位转换为像素
        private int ConvertDpToPx(int dp)
        {
            return (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, dp, Resources.DisplayMetrics);
        }
    }
}

3. 关键注意点 #

• TabLayout的最小高度：默认TabLayout有固定的minHeight（通常为56dp），通过SetMinimumHeight可以强制缩小这个值，从根源上限制Tab栏高度。
• 自定义Tab的内边距：一定要在自定义布局里控制根布局的padding，不要依赖系统默认的Tab样式，否则仍会有冗余边距。
• 图标和文字尺寸：适当缩小图标（比如24dp）和文字字号（比如10sp），能进一步帮助压缩Tab栏的整体高度。

这样调整后，Tab栏的上下冗余边距应该就消失了，高度也能达到你想要的大小。

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