SwiftUI——如何使用新的NavigationStack和NavigationSplitView(如何页面跳转2.0以及如何制作侧栏)

news2024/11/14 22:03:54

从 iOS 16 开始,苹果开始弃用原先的NavigationView,以后会逐渐完全淘汰掉。现在开始使用NavigationStackNavigationSplitViewNavigationStack的效果和原本的NavigationView一样,而NavigationSplitView则和现在 iPadOS 上的NavigationView效果一样。
最近在 iPadOS 上面使用NavigationView,内容会放在侧栏,而不是像 iOS 或者以前一样。如下:请添加图片描述

苹果这次改名的目的应该是为了区别两种导航模式,怕开发者不好理解区分。
那么下面来介绍一下二者。

NavigationStack

NavigationStack的使用方法和NavigationView一模一样,只要改一下名字即可,更新代码很方便:

NavigationStack {
	NavigationLink...
}

唯一需要注意的是:只支持 iOS 16 及更新的系统。所以代码修改的时候应该改成以下格式,不然程序只能支持 iOS 16 及更新的代码了:

if #available(iOS 16.0, *) {
	//新版代码
	
} else {
	//兼容早期系统
	
}

顺道一提,NavigationStack等价于被遗弃的NavigationView的下面这种设置:

NavigationView {
    NavigationLink...
}
.navigationViewStyle(.stack)

NavigationSplitView

NavigationSplitView是新出来的,目的是方便开发者实现侧栏。事实上也真的很方便。

代码格式如下:

NavigationSplitView {
    //侧栏第一列
} content: {
    //侧栏第二列
} detail: {
    //页面
}

例如下面这段代码的样式如下:

NavigationSplitView {
	Text("1")
} content: {
	Text("2")
} detail: {
	Text("3")
}

横屏样式如下:
请添加图片描述
竖屏样式如下:
请添加图片描述
接下来通过下面的代码来讲一下新NavigationSplitView的数据流:

struct MainView: View {
    let colors: [Color] = [.purple, .pink, .orange]
    @State private var selection: Color? = nil // 默认没有选中的颜色
    var body: some View {
        NavigationSplitView {
                List(colors, id: \.self, selection: $selection) { color in
                    NavigationLink(color.description, value: color)
                }
            } detail: {
                if let color = selection {
                    Rectangle()
                        .foregroundColor(color)
                } else {
                    Text("Pick a color")
                }
            }
    }
}

此时显示效果如下:
请添加图片描述
下面点击“pink”看看:
请添加图片描述

希望能帮到有需要的人~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/32055.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Elastic Search(一)

1. elasticsearch 概述 1.1 简介 官网: https://www.elastic.co/ Elasticsearch (简称ES)是一个分布式、RESTful 风格的搜索和数据分析引擎,能够解决不断涌现出的各种用例。 查询和分析 可以自定义搜索方式: 通过 Elasticsearch,您能够执行及合并多种…

TAPD项目管理:工作流自动化最佳实践

TAPD全称为腾讯敏捷产品研发平台,凝聚了腾讯内部各个产品体系多年敏捷开发的实践精髓。TAPD的【自动化助手】模块通过【触发条件】【执行条件】的规则设定,可以轻松实现自定义子需求、父需求、缺陷管理之间的流转和自动化。 产品/研发的日常工作中&…

mybatis-plus通过inSql实现子查询以及运算符

mybatis-plus通过inSql实现子查询以及运算符一、Controller二、Service1、子查询Service2、运算符Service三、结果一、Controller GetMapping("/queryProductByTypes")public List<ProductDTO> queryProductByTypes(RequestParam("types") List<S…

C数据结构-堆的实现思路和堆排序的实现

堆和堆排堆的定义为什么使用数组&#xff1f;堆接口函数的实现堆的初始化堆的销毁堆的打印堆的插入&#xff01;&#xff01;堆的删除&#xff01;&#xff01;堆的判空返回堆顶的元素堆的大小堆排序的实现&#xff01;&#xff01;实现堆排序的两种方式时间复杂度的分析Last前…

【STC8A8K64D4开发板】——STC8A8K64D4开发板介绍

版权声明&#xff1a;本文为博主原创文章&#xff0c;转载请附上原文出处链接。 文章目录前言一、STC8A8K64D4系列单片机介绍二、STC8A8K64D4开发板概述三、STC8A8K64D4开发板硬件框图四、STC8芯片命名规则五、STC8A8K64D4核心板-2款对比六、STC8A8K64D4开发板-功能描述七、STC…

肠道微生物群与过敏性鼻炎

过敏性鼻炎是个全球性健康问题&#xff0c;易反复发作&#xff0c;困扰着全世界大约着4亿人。自20世纪60年代以来&#xff0c;过敏性鼻炎的患病率持续上升。近几年&#xff0c;我国主要大中城市过敏性鼻炎的平均患病率从11.1%升高到17.6%。 过敏性鼻炎主要临床表现包括发痒、打…

相比Superset和Metabase,DataEase开源工具为什么更易用?

企业业务环境或应用环境中产生的数据大多存储在数据库中&#xff0c;但是这些数据无法直接、形象地加以展示。数据可视化的意义就在于将原始数据通过不同类型的图形进行展示&#xff0c;为数据分析提供更加具象化的手段&#xff0c;这是数据可视化分析工具诞生的使命和意义。 …

[足式机器人]Part3机构运动微分几何学分析与综合Ch02-1 平面机构离散运动鞍点综合——【读书笔记】

本文仅供学习使用 本文参考&#xff1a; 《机构运动微分几何学分析与综合》-王德伦、汪伟 《微分几何》吴大任 Ch02-1 平面机构离散运动鞍点综合2 平面运动微分几何学2.1 平面离散运动的矩阵表示2.2 鞍点规划2 平面运动微分几何学 平面连杆机构由连架杆、机架和连杆组成&#…

运筹说 第73期 | 图论创始人“数学之王”一 欧拉

前面我们介绍了有关动态规划的相关内容&#xff0c;相信大家也都有了一些收获&#xff0c;下面我们学习的列车继续驶往“图与网络分析”的站点&#xff0c;在本次文章中我们将一起走近图论的奠基人——欧拉Leonhard Euler&#xff0c;希望能给大家学习运筹学的旅程中带来不一样…

甘露糖-聚乙二醇-6-羧甲基荧光素mannose-PEG-6-FAM

甘露糖-聚乙二醇-6-羧甲基荧光素mannose-PEG-6-FAM 中文名称&#xff1a;甘露糖-6-羧甲基荧光素 英文名称&#xff1a;mannose-6-FAM 别称&#xff1a;6-羧甲基荧光素标记甘露糖&#xff0c;6-羧甲基荧光素-甘露糖 PEG分子量可选&#xff1a;350、550、750、1k、2k、34k、5…

互联网基础结构发展的三个阶段及其特点

互联网的基础结构大体上经历了三个阶段的演进。但这三个阶段在时间划分上并非截然分开而是有部分重叠的&#xff0c;这是因为网络的演进是逐渐的而不是在某个日期突然发生了变化。 第一个阶段是从单个网络ARPANET向互连网方向发展。这一阶段的主要特点是TCP/IP协议初步成型。1…

Apollo 应用与源码分析:CyberRT-protobuf

目录 概念 特点 优点 缺点 文件的创建 1.字段规则 2.数据类型 3.字段名称 4.字段编号 文件的编译 protobuf 编译命令编译 protobuf cmake 方式编译 使用bazel 编译 在protobuf 文件夹下创建build 文件 代码解释&#xff1a; 样例 protobuf 使用文件 代码解释…

Python:入门与基本语法

目录 一、Python环境 官方下载 Python开发工具 插件安装 二、基本数据类型 动态语言的体现 静态语言的体现 弱语言的体现 强语言的体现 三、基本数据类型 java八大基本数据类型 Python四大基本数据类型 案例 基本数据类型 test01 源码 引用数据类型 列表 test02 源码…

你不知道的SQL语言数据库原理

1、SQL的概述 SQL全称&#xff1a; Structured Query Language&#xff0c;是结构化查询语言&#xff0c;用于访问和处理数据库的标准的计算机语言。 SQL语言1974年由Boyce和Chamberlin提出&#xff0c;并首先在IBM公司研制的关系数据库系统SystemR上实现。 美国国家标准局(AN…

【配电网重构】负荷平衡的配电网重构【含Matlab源码 2180期】

⛄一、 负荷平衡的配电网重构 1 引言 配电网网络重构是指在正常或非正常运行条件下通过改变开关的开关状态来改变网络的拓扑结构。配电网故障恢复供电是指配电网发生故障后,在故障已被定位和隔离的基础上,研究如何恢复对无故障停电区域供电的问题,本文简称为故障恢复。故障恢复…

Spring Cloud Alibaba 整合 Nacos

写在最前 项目 GitHub 地址 mingyue-springcloud-learning 【mingyue-springcloud-user、mingyue-springcloud-member】 阅读推荐 Spring Cloud 入门必读Spring Cloud Alibaba 入门必读 版本声明 spring-boot: 2.7.5 spring-cloud: 2021.0.5 spring-cloud-alibaba: 2021.0.4…

论文阅读 Fast Reinforcement Learning Via Slow Reinforcement Learning

论文阅读 RL^2 Fast Reinforcement Learning Via Slow Reinforcement Learning1. 摘要2.introduction3. 实现4.小结1. 摘要 强化学习可以对于单个任务有较好的效果&#xff0c;但需要大量的尝试。动物往往可以通过少量的尝试就获得很好的效果。原因在于动物可以更好地使用先验…

学习笔记——Java Stream 源码学习

思路 先上一段代码 List<User> userList new ArrayList<>();for (int i 0; i < 10; i) {userList.add(new User(i, "wtq", "1234"));}userList.stream().filter(user -> user.getUserId() > 3).filter(user -> user.getUserId(…

【JVM】字节码技术:图解字节码形式下的 方法执行流程

一、源文件 package cn.itcast.jvm.t3.bytecode;/** * 演示 字节码指令 和 操作数栈、常量池的关系 */ public class Demo3_1 {public static void main(String[] args) {int a 10;int b Short.MAX_VALUE 1;int c a b;System.out.println(c);} }二、反编译的字节码文件 …

《Go语言精进之路,从新手到高手的编程思想、方法和技巧1》读书笔记和分享

Go语言精进之路&#xff0c;从新手到高手的编程思想、方法和技巧读书分享1 本书定位2 本书内容总览3 选择本书的原因4 小收获分享第7-12条 真的不知道咋命名第13-19条 能用——怎么用更好5 个人总结第一部分 熟知 Go 语言的一切第 1 条 了解 Go 语言的诞生与演进第 2 条 选择适…