SwiftUI 6.0(Xcode 16)全新 @Entry 和 @Previewable 宏让开发妙趣横生

在这里插入图片描述

概览

如火如荼的 WWDC 2024 已进入第五天,苹果开发平台中众多海量新功能都争先恐后的喷薄欲出。

在这里插入图片描述

在这里就让我们从中挑两个轻松有趣的新功能展示给小伙伴们吧:它们分别是 全新的 @Entry 和 @Previewable 宏。

在这里插入图片描述

在本篇博文中,您将学到如下内容:

  • 概览
  • 1. 用 @Entry 宏简化环境变量定义
  • 2. @Previewable 让 Xcode 预览调试安闲自得
  • 总结

读完本篇后,相信小伙伴们一定会对全新的 @Entry 和 @Previewable 宏相见恨晚!

那还等什么呢?马上和大熊猫侯佩一起开始 WWDC24 大冒险吧!

Let’s go!!!😉


1. 用 @Entry 宏简化环境变量定义

在 SwiftUI 6.0(iOS 18)之前,要想自己创建自定义环境变量需要以下 3 步。

首先,我们需要创建环境变量类型:

enum SuperPower: CustomStringConvertible {case timeStopcase invisibilitycase predictTheFuturecase immortalcase teleportationvar description: String {switch self {case .immortal:"永生"case .invisibility:"隐身"case .predictTheFuture:"预知未来"case .timeStop:"时间停止"case .teleportation:"瞬间移动"}}
}

接着,我们需要创建环境变量对应的键(EnvironmentKey):

struct HideSuperPower: EnvironmentKey {static var defaultValue: SuperPower = .immortal
}

最后,我们还需要扩展 EnvironmentValues 以便插入我们的环境变量:

extension EnvironmentValues {var hideSuperPower: SuperPower {get { self[HideSuperPower.self] }set { self[HideSuperPower.self] = newValue }}
}

为 SwiftUI 增加环境变量这点小事都要如此地大费周章,这不禁让我们这些秃头码农们唏嘘不已。

好消息来了!从 SwiftUI 6.0 开始仅用全新的 @Entry 宏我们即能蜻蜓点水似得创建自定环境变量了。

在这里插入图片描述

有了 @Entry 宏,之前那几坨代码现在可以如此这般简化了:

extension EnvironmentValues {@Entry var hideSuperPower: SuperPower = .immortal
}

是不是养眼了不少?

但是不管如何,使用 hideSuperPower 环境变量的方式还和以前是一毛一样滴:

struct ContentView: View {@Environment(\.hideSuperPower) var powervar body: some View {NavigationStack {VStack {Text("当前超能力:\n\(Text("#\(power)#").foregroundStyle(.red.gradient))").font(.system(size: 55, weight: .heavy)).foregroundStyle(.gray)}.navigationTitle("超能力大冒险").toolbar {Text("大熊猫侯佩 @ \(Text("CSDN").foregroundStyle(.red))").font(.headline.weight(.bold)).foregroundStyle(.gray)}}}
}

代码运行效果如下图所示:

在这里插入图片描述

@Entry 宏不仅能够用在环境变量的定义中,它同样可以用来简化 Transaction Values、Container Values 以及 Focused Values 等类型的定义:

extension Transaction {@Entry var myCustomValue: String = "Default value"
}extension ContainerValues {@Entry var myCustomValue: String = "Default value"
}extension FocusedValues {@Entry var myCustomValue: String?
}

更多 @Entry 的“玩法”请小伙伴们移步苹果开发者官网恣意研究。

2. @Previewable 让 Xcode 预览调试安闲自得

除了苹果各个开发框架的重磅更新以外,每年的 WWDC 也都会让果粉必备的开发集成环境 Xcode 如日方升,今年的 WWDC 24 自然也不例外。

我们知道 Xcode 中预览(Preview)和 SwiftUI 的界面调试真何谓是“天作之合”。不过 SwiftUI 6.0 之前,如果我们希望在预览中调试需要传入额外状态的视图就会变得“捉襟见肘”:

struct Hero: Identifiable {var id = UUID()var name: Stringvar superpower: SuperPowervar isInHellMode: Boolstatic var previewHeros: [Hero] = {[Hero(name: "孙悟空", superpower: .immortal, isInHellMode: false),Hero(name: "钢铁侠", superpower: .immortal, isInHellMode: false),Hero(name: "闪电侠", superpower: .teleportation, isInHellMode: false),Hero(name: "吉良吉影", superpower: .predictTheFuture, isInHellMode: false),Hero(name: "灭霸", superpower: .timeStop, isInHellMode: true)]}()
}struct HerosView: View {@Binding var heroList: [Hero]var body: some View {NavigationStack {List($heroList) { $hero inVStack(alignment: .leading) {HStack {TextField("英雄名字", text: $hero.name).font(.title.weight(.black))Toggle("地狱模式", isOn: $hero.isInHellMode)}HStack {Text(hero.superpower.description).font(.headline).foregroundStyle(.gray)Spacer()Text(hero.id.uuidString.suffix(8)).font(.title2.weight(.heavy)).foregroundStyle(.purple)}}}.navigationTitle("英雄列表").toolbar {Text("大熊猫侯佩 @ \(Text("CSDN").foregroundStyle(.red))").font(.headline.weight(.bold)).foregroundStyle(.gray)}}}
}

如上代码所示:我们希望在 Xcode 预览中调试的 HerosView 视图会被要求传入一个可变 heroList 状态,它的类型是 [Hero]。

在 SwiftUI 6.0(Xcode 16)之前,要想预览与 HerosView 翩翩起舞我们可能需要大费周章地另外写一个包装器视图,在该视图中创建一个 [Hero] 类型的状态,然后再把它传递给 HerosView。


除了用包装器的方式调试 HerosView 视图以外,我们还可以使用 #Preview + @Observable 宏的组合构造可变 @Binding 实参来向 HerosView 传递状态 。

更多细节请小伙伴们移步如下链接观赏进一步精彩的内容:

  • Xcode 15.0 新 #Preview 预览让 SwiftUI 界面调试更加悠然自得

而现在 WWDC24 为我们送来了全新的 @Previewable 宏专注于解决此事:

在这里插入图片描述

有了 @Previewable 宏,我们即可怡然自得的在 #Preview 宏预览闭包中直接向被调试的 SwiftUI 视图传入可变状态了:

#Preview("英雄列表") {@Previewable @State var heros = Hero.previewHerosHerosView(heroList: $heros)
}

现在,我们在 Xcode 16 中可以易如反掌的调试需要传入可变状态的 SwiftUI 子视图了,棒棒哒💯:

在这里插入图片描述

总结

在本篇博文中,我们介绍了如何在最新的 SwiftUI 6.0(Xcode 16)中利用 WWDC24 中新祭出的 @Entry 和 @Previewable 宏让环境变量定义和 Xcode 界面预览调试更加得心应手,充满乐趣!

感谢观赏,再会!😎

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

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

相关文章

dayjs将星期的第一天设置为周一

默认引入的dayjs的语言是英文,一周的开始是星期日,当使用dayjs().startOf(week)的时候,就不是周一而是周日了。 import dayjs from "dayjs" import "dayjs/locale/zh-cn" import updateLocale from "dayjs/plugin/…

【Python】 探索 CatBoost:高效的机器学习分类与回归工具

我们都找到天使了 说好了 心事不能偷藏着 什么都 一起做 幸福得 没话说 把坏脾气变成了好沟通 我们都找到天使了 约好了 负责对方的快乐 阳光下 的山坡 你素描 的以后 怎么抄袭我脑袋 想的 🎵 薛凯琪《找到天使了》 在机器学习领域中&#xff…

【C++ 11 新特性】lambda 表达式详解

文章目录 1. 常见 lambda 面试题🖊 1. 常见 lambda 面试题🖊 🍎① 如果⼀个 lambda 表达式作为参数传递给⼀个函数,那这个函数可以使⽤这个 lambda 表达式捕获的变量吗 ? 🐧 函数本身无法直接访问到 lambda表达式捕获…

vue3实现表格的分页以及确认消息弹窗

表格的分页实例展示 效果1:表格按照每行10条数据分页,且编号也会随之分页自增 实现按照页码分页效果 第二页 展示编号根据分页自动增长 固定表格高度 这边设置了滚动条,同时表格高度实现自适应滚动条高度 template部分 表格代码 编号是按照页码条数进行循环并根据索引自增…

力扣191. 位1的个数

Problem: 191. 位1的个数 文章目录 题目描述思路复杂度Code 题目描述 思路 题目规定数值的范围不会超过32位整形数 1.定义统计个数的变量oneCount;由于每次与给定数字求与的变量mask初始化为1 2.for循环从0~32,每一次拿mask与给定数字求与运算&#xff…

【Linux应用】Linux系统的设备管理——Udev

1.udev概述 udev是 Linux2.6内核里的一个功能,它替代了原来的 devfs,成为当前 Linux 默认的设备管理工具,能够根据系统中的硬件设备的状态动态更新设备文件,包括设备文件的创建,删除等。 udev以守护进程的形式运行&am…

YOLOv10的使用总结

目录 YOLOv10介绍 部署和使用示例 微调训练 YOLO模型因其在计算成本和检测性能之间的平衡而在实时目标检测中很受欢迎。前几天YOLOv10也刚刚发布了。我们这篇文章就来看看YOLOv10有哪些改进,如何部署,以及微调。 概述 实时物体检测旨在以较低的延迟准…

JC/T 2653-2022 不发火砂浆检测

不发火砂浆是指当材料与金属等坚硬物发生摩擦、冲击或冲擦等机械作用时,不产生火花或火星的砂浆。 JC/T 2653-2022 不发火砂浆检测项目: 测试项目 测试方法 外观 JC/T 2653 抗压强度 GB/T 17671 抗折强度 GB/T 17671 保水率 JGJ/T 70 凝结时间…

23.1 时间-获取时间、休眠、超时

1. 获取时间 时间是个重要的编程元素,可用于计算间隔、同步服务器以及控制超时。 计算机中的时间分为以下两种形式: 墙钟时间:以12或24小时为周期不断重复,不同的地区和季节会因时区或夏令时而异。单调时间:从一个时…

CSS 实现电影信息卡片

CSS 实现电影信息卡片 效果展示 CSS 知识点 CSS 综合知识运用 页面整体布局 <div class"card"><div class"poster"><img src"./poster.jpg" /></div><div class"details"><img src"./avtar…

这 10 种架构师,不合格!

大家好&#xff0c;我是君哥。 架构师这个岗位是好多程序员努力的方向&#xff0c;尤其是刚毕业的时候&#xff0c;对架构师有一种崇拜感。毕竟从初级到架构要经历好几次级别飞跃。 工作时间久了&#xff0c;发现架构师这个岗位&#xff0c;其实定义非常广泛&#xff0c;根据工…

工具清单 - 项目管理

# 工具清单 Bonobo Git Server在新窗口打开 - Set up your own self hosted git server on IIS for Windows. Manage users and have full control over your repositories with a nice user friendly graphical interface. (Source Code在新窗口打开) MIT C#Fossil在新窗口打…

windows用脚本编译qt的项目

mingw的 cd build ::设置jom环境 set PATHC:\Qt\Qt5.15.2\Tools\mingw810_32\bin;%PATH% set PATHC:\Qt\Qt5.15.2\5.15.2\mingw81_32\bin;%PATH% ::设置Qt环境 amd64_x86 或者 amd64 ::CALL "D:\Program Files (x86)\Microsoft Visual Studio\2017\Enterprise\VC\Auxilia…

Element-ui中Table表格无法显示

Element-ui中Table表格无法显示 在使用过程中发现样式正常显示但是table就是不显示&#xff0c;研究了一段时间后&#xff0c;发现问题是项目结构的问题 当你创建vue和安装el的时候&#xff0c;一定要注意进入到正确的项目文件夹&#xff0c;如果在外面也出现一个package.jso…

【iOS】UI学习——cell的复用及自定义cell

目录 前言cell的复用手动&#xff08;非注册&#xff09;自动&#xff08;注册&#xff09; 自定义cell总结 前言 Cell复用和自定义Cell是在开发iOS应用时常见的一种优化技巧和定制需求。   Cell复用是UITableView或UICollectionView的一个重要优化机制。当用户滚动这些视图时…

图解 Twitter 架构图

写在前面 两年前&#xff0c;马老板收购了twitter&#xff0c;并且做了一系列的大动作。那么今天我们来看一下这个全球最火的软件之一的架构。 Twitter解析 开始之前&#xff0c;我先提前说明一下&#xff0c;我之前不是做搜推广的&#xff0c;所以对这些了解不是很深&…

实战项目: 负载均衡

0. 前言 这个项目使用了前后端,实现一个丐版的LeetCode刷题网站,并根据每台主机的实际情况,选择对应的主机,负载均衡的调度 0.1 所用技术与开发环境 所用技术: C STL 标准库 Boost 准标准库 ( 字符串切割 ) cpp- httplib 第三方开源网络库 ctemplate 第三方开源前端网…

【Java】已解决:java.lang.OutOfMemoryError: Java heap space

文章目录 一、问题分析背景二、可能出错的原因三、错误代码示例四、正确代码示例五、注意事项 已解决Java&#xff1a;java.lang.OutOfMemoryError: Java heap space 一、问题分析背景 在Java开发过程中&#xff0c;有时我们会遇到java.lang.OutOfMemoryError: Java heap spa…

python操作迅雷下载,支持文件重命名

python操作迅雷下载&#xff0c;支持文件重命名 最近从网上扒拉了许多的学习资料&#xff0c;发现一个一个手动重命名下载真的太伤身体了&#xff0c;然后就想想是否可以用python来操作迅雷一键下载我想要的学习资料&#xff0c;网上找了一圈&#xff0c;发现是真的可以下载&a…

容器镜像外网同步方案

目录 一、目的 二、安装nexus 1、购买香港云主机​编辑 2、安装nexus 3、启动nexus 服务 4、放行安全组 三、配置nexus 1、登录nexus管理页面 2、修改nexus密码 3、创建 Blob 存储空间(可选) 4、创建 镜像代理仓库 5、Realms配置 四、拉取镜像 1、配置docker 2、…