英文:
how can i remove or hide the text of tabs in TabBar .NET MAUI?
问题
对于Android平台:
我想在.NET MAUI中底部的TabBar中仅使用图标,
因此我必须要么移除标题,要么隐藏它,
如果我将标题留空而没有文本,它会保留其空间,因此图标不会填满所有空间。
英文:
For Android Platform:
I want to use icons only in the bottom TabBar in .NET MAUI,
So I have to either remove the title or hide it,
If i leave the title empty without text, it retains its space, so the icon does not fill all the space
答案1
得分: 2
你可以使用自定义的外壳渲染器来移除底部选项卡栏中标题视图。
在/Platforms/Android中创建自定义渲染器类:
public class MyShellRenderer : ShellRenderer
{
public MyShellRenderer(Context context) : base(context)
{
}
protected override IShellBottomNavViewAppearanceTracker CreateBottomNavViewAppearanceTracker(ShellItem shellItem)
{
return new MyShellBottomNavViewAppearanceTracker();
}
}
public class MyShellBottomNavViewAppearanceTracker : IShellBottomNavViewAppearanceTracker
{
public void Dispose()
{
}
public void ResetAppearance(BottomNavigationView bottomView)
{
}
public void SetAppearance(BottomNavigationView bottomView, IShellAppearanceElement appearance)
{
bottomView.LabelVisibilityMode = LabelVisibilityMode.LabelVisibilityUnlabeled;
// 这一行将隐藏标题的空间
}
}
然后在MauiProgram.cs中使用渲染器:
builder
.UseMauiApp<App>()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
})
.ConfigureMauiHandlers(handlers =>
{
#if ANDROID
handlers.AddHandler(typeof(Shell), typeof(Platforms.Android.MyShellRenderer));
#endif
});
最后,在AppShell.xaml中:
<TabBar>
<Tab Icon="main.png">
<ShellContent ContentTemplate="{DataTemplate local:MainPage}"/>
</Tab>
<Tab Icon="page1.png">
<ShellContent ContentTemplate="{DataTemplate local:NewPage1}"/>
</Tab>
</TabBar>
不要翻译代码部分。
英文:
You can use the custom shell renderer to remove the title's view in the bottom tab bar.
Create the custom renderer class in the /Platforms/Android:
public class MyShellRenderer : ShellRenderer
{
public MyShellRenderer(Context context) : base(context)
{
}
protected override IShellBottomNavViewAppearanceTracker CreateBottomNavViewAppearanceTracker(ShellItem shellItem)
{
return new MyShellBottomNavViewAppearanceTracker();
}
}
public class MyShellBottomNavViewAppearanceTracker : IShellBottomNavViewAppearanceTracker
{
public void Dispose()
{
}
public void ResetAppearance(BottomNavigationView bottomView)
{
}
public void SetAppearance(BottomNavigationView bottomView, IShellAppearanceElement appearance)
{
bottomView.LabelVisibilityMode = LabelVisibilityMode.LabelVisibilityUnlabeled;
// this line will hide the space of the title
}
}
And use the Renderer in the MauiProgram.cs:
builder
.UseMauiApp<App>()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
})
.ConfigureMauiHandlers(handlers =>
{
#if ANDROID
handlers.AddHandler(typeof(Shell), typeof(Platforms.Android.MyShellRenderer));
#endif
})
;
And in the AppShell.xaml:
<TabBar>
<Tab
Icon="main.png">
<ShellContent ContentTemplate="{DataTemplate local:MainPage}"/>
</Tab>
<Tab
Icon="page1.png">
<ShellContent ContentTemplate="{DataTemplate local:NewPage1}"/>
</Tab>
</TabBar>
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论