1.如何减少标题间距?1.当我改变汉堡包图标,它的图标颜色出现只有白色.什么是错的?1.我可以设置标题字体大小和字体系列吗?谢谢你。在android中有contentInsetLeft,contentInsetStart,contentInsetStartWithNavigation.但我不知道如何在.NET MAUI中使用
wpx232ag1#
我有一个工作的解决方案在这里,你可以使用 shell 渲染器,但它觉得太烦人了,我个人模板的基本内容页:https://github.com/FreakyAli/Maui.FreakyEffects/blob/dev/Maui.FreakyEffects/Samples/FreakyBaseContentPage.xaml及其应用:https://github.com/FreakyAli/Maui.FreakyEffects/blob/dev/Maui.FreakyEffects/Samples/SkeletonEffect/SkeletonEffectView.xaml对于直接想要代码的人:创建模板:
<ContentPage.Resources> <ResourceDictionary> <ControlTemplate x:Key="HeaderControlTemplate"> <AbsoluteLayout> <Grid BackgroundColor="{TemplateBinding Parent.NavBarBackgroundColor}" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" RowSpacing="0" ColumnSpacing="0"> <Grid.ColumnDefinitions> <ColumnDefinition Width="25*" /> <ColumnDefinition Width="50*" /> <ColumnDefinition Width="25*" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="7*" /> <RowDefinition Height="93*" /> </Grid.RowDefinitions> <Border Grid.Row="0" Grid.Column="0" Margin="15,0,0,0" StrokeThickness="0" IsVisible="{TemplateBinding Parent.IsBackButtonVisible}" BackgroundColor="{StaticResource Tertiary}" VerticalOptions="Center" HorizontalOptions="Start" HeightRequest="30" WidthRequest="30"> <Border.GestureRecognizers> <TapGestureRecognizer Command="{TemplateBinding Parent.BackButtonCommand}"/> </Border.GestureRecognizers> <Border.StrokeShape> <RoundRectangle CornerRadius="5" /> </Border.StrokeShape> <controls:FreakySvgImageView InputTransparent="True" ResourceId="{x:Static constants:Constants.BackButton}" SvgAssembly="{x:Static constants:Constants.SvgAssembly}" ImageColor="White" SvgMode="AspectFit" /> </Border> <Label Grid.Row="0" Grid.Column="1" Margin="0,0,0,0" FontSize="Medium" TextColor="{TemplateBinding Parent.HeaderTextColor}" HorizontalOptions="CenterAndExpand" Style="{DynamicResource HeaderLabelStyle}" Text="{TemplateBinding Parent.HeaderText}" VerticalOptions="Center" /> <Border Grid.Row="0" Grid.Column="2" Margin="0,0,15,0" StrokeThickness="0" IsVisible="{TemplateBinding Parent.IsContextVisible}" BackgroundColor="{StaticResource Tertiary}" VerticalOptions="Center" HorizontalOptions="End" HeightRequest="30" WidthRequest="30"> <Border.StrokeShape> <RoundRectangle CornerRadius="5" /> </Border.StrokeShape> <controls:FreakySvgImageView ImageColor="White" ResourceId="{x:Static constants:Constants.MeatballMenu}" SvgAssembly="{x:Static constants:Constants.SvgAssembly}" SvgMode="AspectFit"> </controls:FreakySvgImageView> </Border> <ContentPresenter Grid.Row="1" IsClippedToBounds="True" BackgroundColor="{StaticResource Primary}" Grid.ColumnSpan="3" VerticalOptions="FillAndExpand" /> </Grid> </AbsoluteLayout> </ControlTemplate> </ResourceDictionary> </ContentPage.Resources>
在要显示的内容页中(应从基本内容页继承):
<ContentPage.Content> <ContentView x:Name="template" ControlTemplate="{StaticResource HeaderControlTemplate}"> // Your design here </ContentView> </ContentPage.Content>
nafvub8i2#
如果您使用默认的MAUI应用程序模板,则您使用的是Shell,它允许您设置自定义TitleView:
<?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:views="http://schemas.microsoft.com/dotnet/2022/maui/toolkit" x:Class="MyApp.Views.MyPage" Title="MyPage"> <Shell.TitleView> <Grid> <Label Text="Hello" HorizontalOptions="Start" VerticalOptions="Center" BackgroundColor="Orange" TextColor="White" FontSize="Title" /> </Grid> </Shell.TitleView> <!-- .. --> </ContentPage>
这允许您完全自定义TitleView,向其添加按钮,更改字体、大小和颜色等。
如果没有mapper/handler或自定义渲染器,则无法更改“标题”和“菜单”图标之间的间距。您可以将以下内容附加到代码中某个位置的ToolbarMap器,例如在 MauiProgram.cs 中:
Toolbar
Microsoft.Maui.Handlers.ToolbarHandler.Mapper.AppendToMapping("CustomNavigationView", (handler, view) => { #if ANDROID handler.PlatformView.ContentInsetStartWithNavigation = 0; #endif });
变更前:
变更后:
也可以更改汉堡菜单图标的颜色,但这已经在其他问题中涉及:How to get the default shell flyout icon to react when android dark theme is switched on/off在毛伊岛使用贝壳的时候,你是如何改变汉堡包的颜色的Change Hamburger Menu Icon in .NET MAUI app
2条答案
按热度按时间wpx232ag1#
我有一个工作的解决方案在这里,你可以使用 shell 渲染器,但它觉得太烦人了,我个人
模板的基本内容页:https://github.com/FreakyAli/Maui.FreakyEffects/blob/dev/Maui.FreakyEffects/Samples/FreakyBaseContentPage.xaml
及其应用:
https://github.com/FreakyAli/Maui.FreakyEffects/blob/dev/Maui.FreakyEffects/Samples/SkeletonEffect/SkeletonEffectView.xaml
对于直接想要代码的人:
创建模板:
在要显示的内容页中(应从基本内容页继承):
nafvub8i2#
自定义标题视图
如果您使用默认的MAUI应用程序模板,则您使用的是Shell,它允许您设置自定义TitleView:
这允许您完全自定义TitleView,向其添加按钮,更改字体、大小和颜色等。
标题间距/内容插入起始带导航
如果没有mapper/handler或自定义渲染器,则无法更改“标题”和“菜单”图标之间的间距。
您可以将以下内容附加到代码中某个位置的
Toolbar
Map器,例如在 MauiProgram.cs 中:变更前:
变更后:
汉堡菜单图标颜色
也可以更改汉堡菜单图标的颜色,但这已经在其他问题中涉及:
How to get the default shell flyout icon to react when android dark theme is switched on/off
在毛伊岛使用贝壳的时候,你是如何改变汉堡包的颜色的
Change Hamburger Menu Icon in .NET MAUI app