MAUI新生5.4-内容页ShellContent

ShellContent是Shell视觉层次结构中，最终承载内容页的构件，Shell > FlyoutItem|TabBar > Tab > ShellContent > View。

 

一、按需加载内容页和应用启动时加载内容页

1、按需加载内容页。导航发生时，才加载内容页，按需创建。

【<ShellContent Title="Dogs"  ContentTemplate="{DataTemplate views:DogsPage}" />】

2、应用启动时加载内容页。应用启动时，加载全部内容页，对应用启动会有性能影响。

【<ShellContent Title="Dogs"> <views:DogsPage /> </ShellContent>】

 

 

二、页面样式外观的设置

1、在Shell中设置页面样式，针对所有内容页

<!--背景色、前景色、标题颜色、禁用颜色、未选定颜色-->
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       x:Class="Xaminals.AppShell"
       BackgroundColor="#455A64"
       ForegroundColor="White"
       TitleColor="White"
       DisabledColor="#B4FFFFFF"
       UnselectedColor="#95FFFFFF">
</Shell>

2、可以在内容页中，重写样式外观

<ContentPage ...
             Shell.BackgroundColor="Gray"
             Shell.ForegroundColor="White"
             Shell.TitleColor="Blue"
             Shell.DisabledColor="#95FFFFFF"
             Shell.UnselectedColor="#B4FFFFFF">
</ContentPage>

 

 

三、内容页显示模式

1、内容页显示模式有以下几种：NotAnimated/Animated/Modal/ModalAnimated/ModalNotAnimated，是否有动画效果、是否以Modal方式

2、设置方式：

<ContentPage ...
             Shell.PresentationMode="Modal">
    ...             
</ContentPage>

 

 

四、导航栏的设置

<!--导航栏阴影-->
<ContentPage ...
             Shell.NavBarHasShadow="true">
    ...
</ContentPage>

<!--是否禁用导航栏-->
<ContentPage ...
             Shell.NavBarIsVisible="false">
    ...
</ContentPage>

<!--在导航栏中自定义视图-->
<ContentPage ...>
    <Shell.TitleView>
        <Image Source="logo.png"
               HorizontalOptions="Center"
               VerticalOptions="Center" />
    </Shell.TitleView>
    ...
</ContentPage>