如何自定义 TabbedPage 中栏的大小？ [XAMARIN.FORMS]

Question

我有一个标签页，我已经容纳了，但是我觉得它很小，我需要下栏更高

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            x:Class="Mobile.View.Principal"
            xmlns:local="clr-namespace:Mobile.View"
            xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
            BackgroundColor="White"
            BarTextColor="{StaticResource Gris}"
            BarBackgroundColor="white">
    
    
    <local:Inicio Title="Inicio" Icon="home_icon.png" HeightRequest="30" WidthRequest="30"/>
    <local:Consultas Title="Consultas" Icon="search_icon.png"/>
    <local:Utilidades Title="Utilidades" Icon="settings_icon.png"/>
    <local:Perfil Title="Perfil" Icon="favorites_icon.png"/>
    
</TabbedPage>

这是背后的代码：

public partial class Principal : Xamarin.Forms.TabbedPage
{
    public Principal()
    {
        InitializeComponent();
        On<Xamarin.Forms.PlatformConfiguration.Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);
        On<Xamarin.Forms.PlatformConfiguration.Android>().SetBarSelectedItemColor(Color.Black);
        On<Xamarin.Forms.PlatformConfiguration.Android>().SetBarItemColor(Color.LightGray);
        //On<Xamarin.Forms.PlatformConfiguration.Android>().DisableSwipePaging(); //Disable sliding the pages with your finger.
        NavigationPage.SetHasNavigationBar(this, false);  // Hide nav bar
    }

    async void OnPerfilAsync(object sender, EventArgs e)
    {
        await Navigation.PushAsync(new Perfil());
    }
}

这就是应用程序的外观：

BAR HEIGHT 物业的名称是什么？

我需要帮助！！！

Answer 1

您想在哪个平台上更改它？您可能需要为要进行此更改的每个平台实施custom renderer。

对于 iOS，您可以将新的通用类文件添加到名为 MyTabbedPageRenderer 的 iOS 项目中。然后在文件中，在namespace 声明上方添加这一行：

[assembly: Xamarin.Forms.ExportRenderer(typeof(Xamarin.Forms.TabbedPage), typeof(YourNamespace.MyTabbedPageRenderer))]

其中YourNamespace 是MyTabbedPageRenderer 所在的命名空间，即，您拥有此属性的正下方的命名空间

现在让类继承自Xamarin.Forms.Platform.iOS.TabbedRenderer，例如：

public class MyTabbedPageRenderer : Xamarin.Forms.Platform.iOS.TabbedRenderer

然后在类中添加如下覆盖方法：

public override void ViewWillLayoutSubviews()
    {
        base.ViewWillLayoutSubviews();
        var newHeight = TabBar.Frame.Height + 50;
        CoreGraphics.CGRect tabFrame = TabBar.Frame; //self.TabBar is IBOutlet of your TabBar
        tabFrame.Height = newHeight;
        tabFrame.Y = View.Frame.Size.Height - newHeight;
        TabBar.Frame = tabFrame;
    }

以上内容会将 iOS 上的 Tabbar 高度从默认值增加 50 像素。将50 更改为您喜欢的任何值。

对于 Android，您实际上不需要制作自定义渲染器，因为有一个 Android 布局，您可以为 TabLayout 设置minHeight。为此，请打开 Android 项目的 resources/layout 文件夹中的 Tabbar.axml 文件。然后将android:minHeight 属性添加到android.support.design.widget.TabLayout 元素：

<android.support.design.widget.TabLayout 
    ...
    android:minHeight="300dp"
    />

这会将高度设置为固定的 300 像素。将其设置为您想要的任何内容。

您也可以在MainActivity.OnCreate 方法中设置高度。下面从模板 Xam.Forms TabbedPage 项目开始。在LoadApplication(new App()) 调用之后添加以下内容：

Android.Support.Design.Widget.TabLayout tabBar = FindViewById<Android.Support.Design.Widget.TabLayout>(Resource.Id.sliding_tabs);
tabBar.SetMinimumHeight(300);

将Resource.Id 更改为Tabbar.axml 文件中android:id 对应的TabLayout