Xamarin.Forms.Shell:如何获取底部 TabBar 高度?
Posted
技术标签:
【中文标题】Xamarin.Forms.Shell:如何获取底部 TabBar 高度?【英文标题】:Xamarin.Forms.Shell: how to get the bottom TabBar height? 【发布时间】:2021-03-01 16:20:07 【问题描述】:我使用默认底部TabBar
开发Xamarin.Forms.Shell 应用程序,我需要知道TabBar
高度 来调整一些项目。
我找到了在两个平台there 上获取StatusBar
高度 的方法,但我没有找到TabBar
的解决方案。
有可能吗?我只发现有关更改 Stack 上 TabBar 高度的请求...
【问题讨论】:
现在可以用了吗? 【参考方案1】:我们可以使用自定义渲染器
来获得高度在 AppShell 中
public partial class AppShell : Xamarin.Forms.Shell
public static double TabHeight get; set;
//...
在 ios 项目中
选项 1:
using App33;
using App33.iOS;
using Foundation;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(AppShell), typeof(ShellCustomRenderer))]
namespace App33.iOS
public class ShellCustomRenderer : ShellRenderer
protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
return new TabBarAppearance();
public class TabBarAppearance : IShellTabBarAppearanceTracker
public void Dispose()
public void ResetAppearance(UITabBarController controller)
public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
base.ViewWillAppear(animated);
UITabBar myTabBar = this.TabBarController.TabBar;
myTabBar.TintColor = UIColor.Red;
myTabBar.BarTintColor = UIColor.LightGray;
//... you can set style like above in iOS
AppShell.TabHeight = myTabBar.Bounds.Height;
public void UpdateLayout(UITabBarController controller)
选项 2:
其实iOS上UITabbar的高度是一个固定值。在 iPhone 8 和之前是 49 和 iPhone X 和之后(全屏)将有一个额外的 safeArea bottom height 。所以如果你只是想得到它(不需要设置高度),你可以像下面这样使用 DependencyService 直接得到它
AppShell.TabHeight = 49 + UIApplication.SharedApplication.Delegate.GetWindow().SafeAreaInsets.Bottom;
在安卓中
public class MainActivity : global::Xamarin.Forms.Platform.android.FormsAppCompatActivity
protected override void OnCreate(Bundle savedInstanceState)
TabLayoutResource = Resource.Layout.Tabbar;
ToolbarResource = Resource.Layout.Toolbar;
base.OnCreate(savedInstanceState);
// var hei=SupportActionBar.Height;
Xamarin.Essentials.Platform.Init(this, savedInstanceState);
global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
LoadApplication(new App());
int resourceId =Resources.GetIdentifier("design_bottom_navigation_height", "dimen", this.PackageName);
int height = 0;
if (resourceId > 0)
height = Resources.GetDimensionPixelSize(resourceId);
AppShell.TabHeight = height;
public override void OnRequestPermissionsResult(int requestCode, string[] permissions, [GeneratedEnum] Android.Content.PM.Permission[] grantResults)
Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);
base.OnRequestPermissionsResult(requestCode, permissions, grantResults);
【讨论】:
嗨@Lucas。它似乎适用于 iOS,但我失去了在 Shell.xaml 中为TabBar
的文本颜色指定的样式。在 Android 上,直到我至少更改一次选项卡后高度才会恢复。因为我需要主页上的这些信息,所以我不能使用这个解决方案。另外,我也失去了默认样式。
得到高度后可以重新设置样式。【参考方案2】:
据我所知,在 Xamarin.Forms 中(还没有?)可以检索 TabBar
Height
,因此您可能需要根据 Xamarin.Forms强>平台。然后,利用DependencyService
,您将能够从您的 Xamarin.Forms 共享代码中获取该信息。那么,让我们来看看如何做到这一点:
iOS
对于iOS,已经发布了类似this 的答案来解释如何做到这一点。
安卓
对于 Android,您可以按如下方式检索 TabBar 高度
为依赖创建接口注意:这个接口也应该用在iOS部分;)
namespace Tabbarheight
public interface IDisplayHeights
float GetTabBarHeight();
在 Android 中创建一个实现该接口并返回所需值的类
(感谢@LucasZhang-MSFT 提供标识符字符串!)
using Android.App;
using Tabbarheight.Droid;
using Xamarin.Forms;
[assembly: Dependency(typeof(AndroidDisplayHeights))]
namespace Tabbarheight.Droid
class AndroidDisplayHeights : IDisplayHeights
public static Activity Activity get; set;
public float GetTabBarHeight()
int resourceId = Activity.Resources.GetIdentifier("design_bottom_navigation_height", "dimen", Activity.PackageName);
int height = 0;
if (resourceId > 0)
height = (int)(Activity.Resources.GetDimensionPixelSize(resourceId) / Xamarin.Essentials.DeviceDisplay.MainDisplayInfo.Density);
return height;
Activity
从 MainActivity.cs 设置如下
protected override void OnCreate(Bundle savedInstanceState)
TabLayoutResource = Resource.Layout.Tabbar;
ToolbarResource = Resource.Layout.Toolbar;
base.OnCreate(savedInstanceState);
Xamarin.Essentials.Platform.Init(this, savedInstanceState);
global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
AndroidDisplayHeights.Activity = this;
LoadApplication(new App());
最后,您可以按如下方式使用它
public AboutPage()
InitializeComponent();
SizeChanged += (s, a) =>
label.HeightRequest = DependencyService.Get<IDisplayHeights>().GetTabBarHeight();
label.BackgroundColor = Color.Red;
;
在上面的解决方案中,我定义了一个Label
(标签),只是为了尝试通过设置Label
的高度来证明获得的TabBar
的Height
值的准确性。
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Tabbarheight.Views.AboutPage"
xmlns:vm="clr-namespace:Tabbarheight.ViewModels"
Title="Binding Title">
<StackLayout>
<Label x:Name="label">
<Label.Text>
<x:String>
Hola mundo
</x:String>
</Label.Text>
</Label>
</StackLayout>
</ContentPage>
标签在我这边是这样的:
【讨论】:
以上是关于Xamarin.Forms.Shell:如何获取底部 TabBar 高度?的主要内容,如果未能解决你的问题,请参考以下文章
如何将 Xamarin Forms Shell 集成到 MvvmCross 设置中
如何将 Xamarin Forms Shell 集成到 MvvmCross 设置中
Xamarin Forms Shell Flyout:如何消除 FlyoutHeader 和第一个 FlyoutItem 之间的间隙?
Xamarin Forms Shell 如何使用自定义渲染器自定义选项卡