最新要闻

广告

手机

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

 警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

家电

  1. 首页
  2. 移动通信
  3. 内容

MAUI新生6.1-Shell导航视觉层次结构

来源：博客园


(资料图片仅供参考)

一、Shell介绍

MAUI内置了一套导航框架Shell，主要提供了三类功能：视觉层次结构、路由导航、搜索框。其中视觉层次结构从文字上不是很好理解，可以认为是一套导航菜单系统，具有一定的外观样式和层次结构，且可以进行导航跳转。MAUI定义了三层视觉结构对象，第一层为FlyoutItem或TabBar，第二层为Tab，第三层为ShellContent。如下图所示：

注：

  • 在手机端和PC端，Shell会显示为不同的外观。
  • 默认情况下，每个FlyoutItem有一个对应的底部Tab栏，设置Shell的属性【Shell.TabBarIsVisible="False"】，可以关闭TabBar。
  • Maui的页面类型包括：ContentPage、FlyoutPage、NavigationPage、TabbedPage。Shell只能用于组织ContentPage，FlyoutPage/NavigationPage/TabbedPage与Shell是不兼容的，两者只能选其一。

二、Shell在AppShell.xaml文件中定义

1、项目从MauiProgram.cs启动，实例化App根页面

2、在App.xaml文件中注册应用级别的资源字典；在App.xaml.cs后台代码中，创建AppShell对象，并赋值给MainPage属性。

3、在AppShell.xaml文件中，设置视觉层次菜单和导航；在AppShell.xmal.cs后台代码中，可以执行全局的路由守卫逻辑。

三、Shell案例

1、单FlyoutItem案例（手机端）

2、多FlyoutItem案例（PC端）

关键词： 视觉层次 层次结构 视觉结构