大多数浏览器和
Developer App 均支持流媒体播放。
-
UIKit 的新功能
探索 UIKit 中的所有新功能,包括标签页和文稿启动体验、过渡效果,以及文本和输入方面的变化。我们还将讨论 UIKit 与 SwiftUI 在动画和手势方面更胜以往的互操作性,以及整个 UIKit 的常规改进。
章节
- 0:00 - Introduction
- 0:55 - Document launch experience
- 1:24 - Updated tab and sidebar
- 2:43 - Fluid transitions
- 3:35 - SwiftUI animations in UIKit
- 4:24 - Coordinated gesture recognizers
- 6:02 - Automatic trait tracking
- 7:44 - List improvements
- 11:18 - UIUpdateLink
- 12:55 - SF Symbol animations
- 14:36 - Sensory feedback
- 16:14 - Text improvements
- 18:14 - Menu actions
- 18:58 - Apple Pencil Pro and PencilKit
资源
相关视频
WWDC24
WWDC23
WWDC21
-
下载
大家好 欢迎观看 “UIKit 的新功能”讲座 我叫 Dima 是 UI Frameworks 团队的经理
UIKit 在 iOS 18 中 新增了多项增强功能 在这个视频中 我将介绍 新的关键功能和 UI 改进 UIKit 和 SwiftUI 在同一 App 中的更多集成 以及大量常规增强功能 和 API 新增功能
UIKit 进行了重大改进 简化了用户界面 使它更易于使用
我将介绍三大关键功能 文稿启动体验的改进 标签栏和边栏的重大更新 以及对整个系统的 全新流畅过渡的支持
首先 我们重新设计了 基于文稿的 App 的启动体验 使它们能够展示自己的独特特性 由于可以完全控制启动视图的设计 并且针对模板文稿创建 提供一流的支持 你可以轻松指导用户 创建自己的第一份文稿 同时保持出色的浏览体验 如需了解更多相关信息 请记得观看 “提升文稿启动体验”视频 其次 标签栏的外观也进行了更新 拥有了全新的整合式 边栏体验和自定功能 在 iPadOS 18 上 标签栏焕然一新 采用全新的紧凑外观 减少了纵向和横向的空白空间 让 App 内容出现在显眼位置 现有的边栏 App 可以采用 新的 UITabBarController API 以便获得一种将标签栏 与边栏结合使用的体验 边栏最小化后 它会转换回标签栏形式 这样可让 App 的内容 出现在显眼位置
新栏支持使用标签栏进行快速导航 同时还可通过边栏 深入了解 App 的各个部分 新栏还包括自定功能 让用户可通过拖放的方式 对边栏和标签栏进行个性化设定
新的 UITab 和 UITabGroup API 使 App 能够描述自身的结构 以构建标签栏和边栏
此外 它们还能适应 Mac Catalyst 和 visionOS 上的原生体验 如需了解更多信息 请观看 “提升 iPadOS 中的标签栏 和边栏使用体验”视频 在 iOS 中 过渡用于以可视化方式 连接 App 的不同部分 同时对它们进行浏览 iOS 18 中新增了一种缩放过渡效果 这种效果适用于导航和演示 不仅采用全新的视觉外观 还具有持续的互动性 让你可以从一开始 或在过渡期间抓取并拖移它 在 App 中从大型单元格 过渡的部分 缩放过渡效果会在整个过渡期间 在屏幕上保持相同的 UI 元素 从而增强 App 的连续感 iOS 18 增强了 SwiftUI 与 UIKit 的互操作性 使它们更容易在 App 中交换使用
我将介绍两个方面的更新 动画更新 以及手势识别器更新 首先是令人兴奋的动画更新! 你可以使用 SwiftUI 动画类型 为 UIKit 视图添加动画效果! 这样一来 你就能利用 全套 SwiftUI 动画类型 包括 SwiftUI CustomAnimations 为 UIKit 视图添加动画效果! 此外 这样还可以轻松使用 SwiftUI spring 动画 构建流畅的手势驱动的动画
要使用它 请在手势更改 和手势结束时分别为你的视图 添加动画效果 这样就能在动画的交互和非交互部分 无缝地保持连续的速度 有关这项精彩更新的动画形式概述 请观看 Russell 亲切易懂的视频 “提升 UI 动画和过渡效果” 动画通常与手势识别器搭配使用 现在可以更轻松地 在 UIKit 和 SwiftUI 之间协调手势 手势系统已在 UIKit 和 SwiftUI 中得到统一 目前它们都遵循一致的规则 在 iOS 18 中 可以跨这两个框架 指定手势之间的依赖项 这里显示了一个嵌套在 UIKit 中的 SwiftUI 层次结构示例 我希望 UIKit 中的轻点一下手势 与 SwiftUI 中的轻点两下手势共存
这里 这两个手势正在同时识别 为了防止这种情况发生 我在这两个手势识别器之间 设置了失败要求 首先 在设置 SwiftUI 手势时 指定了一个名称 “SwiftUIDoubleTap” 然后 在 UIKit 委托中 我会检查其他手势识别器的名称 以确定与 SwiftUI 手势 相关的识别器 这样 只有当 SwiftUI 的 轻点两下手势失败时 UIKit 提供的轻点一下手势识别器 才会启动 从而达到预期效果 在 iOS 18 中 通过使用新的 UIGestureRecognizerRepresentable 协议 你现在可以将现有的 UIKit 手势识别器直接添加到 SwiftUI 层次结构中 请观看“SwiftUI 的新功能”视频 详细了解如何在 App 中采用 UIGestureRecognizerRepresentable 最后 我将介绍 UIKit 的一些常规增强功能
UIKit 中的特征系统会将数据 传播到 App 层次结构中的 视图控制器和视图 在 iOS 18 中 使用特征和处理更改 比以往任何时候都更容易 UIKit 目前支持在公共视图 和视图控制器更新方法的内部 自动追踪特征 具体方法包括 layoutSubviews 和 drawRect 等 当 UIKit 调用这些受支持方法中的 某一种方法时 它会记录你在这种方法内 访问了哪些特征 然后 当这些特征中任一 特征的值发生更改时 UIKit 会自动对这种方法 执行相关的无效化操作 例如 setNeedsLayout或 setNeedsDisplay 在本例中 我有一个 UIView 子类 它覆盖了 layoutSubviews 然后从视图的 traitCollection 中 读取 horizontalSizeClass 特征 以确定要使用哪种布局类型 在使用自动特征追踪之前 我需要手动注册 horizontalSizeClass 特征 并在这个视图每次发生变化时 对它调用 setNeedsLayout 有了 iOS 18 中的自动特征追踪功能 我可以完全删除手动特征 更改注册操作! 这是因为 在调用 layoutSubviews 时 系统会记录 horizontalSizeClass 特征使用情况
当这个视图的相应特征发生变化时 它会自动接收 setNeedsLayout 以更新为相应新值 自动特征追踪只创建所需的 特征依赖项 从而获得最佳性能 在受支持的更新方法中 这项新功能始终处于激活状态
请参考相关文档 获取受支持方法的完整列表 接下来要指出的是 集合和表格 视图 API 也已经更新 可让你更轻松地更新单元格! UICollectionView list 部分 和 UITableView 中的所有视图现在 都设置了 listEnvironment 特征
listEnvironment 特征描述了 视图所在列表的样式 使用这个特征可确保任一给定列表中 的单元格都设置了适当的样式 UIListContentConfiguration 和 UIBackgroundConfiguration 现在可以利用这一新特征
针对新状态进行更新时 它们会调整自己的属性 以匹配配置状态的 特征集合中的 listEnvironment 特征
这样 在配置单元格时 就不需要知道列表的样式了
相反 单元格配置代码 只需要知道所呈现的内容所需的样式 是常规单元格、页眉还是页脚 例如 来看看 “文件”App 中的“浏览”标签页 它使用一个采用组合布局的 UICollectionView 根据上下文 以两种不同样式 显示“位置” “个人收藏”和“标签”列表 在竖屏模式下 “浏览”列表 使用 insetGrouped 外观 在横屏模式下 相同的“浏览”列表会 以分屏浏览控制器边栏的形式显示 “文件”App 在配置它的 UICollectionView 的 组合布局时 会使用边栏外观 这是“文件”App 中的一个函数 可针对“浏览”列表中的位置 生成内容 和后台配置 这是在 iOS 17 中 实现这个函数的方式
它接收一个 FileLocation 结构 以及 listAppearance 作为参数 首先它会检查 listAppearance 是否为边栏样式 并将结果存储在 isSidebar 局部变量中 然后根据 isSidebar 变量 手动选择内容 和后台配置 由于这些配置是手动创建的 当“浏览”列表更改外观时 使用这些配置的单元格 需要手动重新配置 所以这个函数将再次运行 以获得更新后的外观
在 iOS 18 中 这一函数可以得到大大简化! “文件”App 将单元格构造函数 用于内容配置 将新的 listCell 构造函数 用于后台配置!
在配置应用于单元格后 它们会根据单元格的 配置状态进行更新 由于新的 listEnvironment 特征 位于配置状态的特征集合中 这些配置现在会自动更新自身的属性 以匹配这个列表的样式! 对于 UIListContentConfiguration 现有的 cell、subtitleCell 和 valueCell 配置 现在会根据 listEnvironment 特征 自动更新各自的外观
新的 header 和 footer 配置 也是如此 对于 UIBackgroundConfiguration 有 3 个新的构造函数 即 listCell、listHeader 和 listFooter
这些后台配置 也会根据 listEnvironment 特征 自动更新各自的外观
请充分利用所有这些列表新增内容 来简化你的代码!
UIUpdateLink 是 iOS 18 中的 新增功能 让你能更轻松地 实现需要定期更新 UI 的 复杂动画 如果你以前使用过 CADisplayLink 那么对 UIUpdateLink 一定不会陌生
它还有更多的功能 比如自动视图追踪 这样链接就会自动根据视图 所处的显示屏进行调整 还能将系统置于低延迟模式 以用于运行绘图应用程序 此外 通过利用它的高级功能 还能实现更好的 性能和电池效率 我们来看一个示例 它使用 正弦函数以动画形式上下移动视图 在我创建 UIUpdateLink 时 会指定一个 UIView 实例 当视图添加到可视窗口时 UIUpdateLink 会自动激活 当视图从可视窗口移除时 UIUpdateLink 则会停用 在 update 函数中 使用 updateInfo 的 modelTime 来确定更新时间 此外 将 requiresContinuousUpdates 设置为 true 以确保 updateLink 会在启用时连续触发 如果设置为 false 则 updateLink 仅会在其他内容驱动更新时触发 比如手势或图层更改等 如需了解更多信息以及更多高级用例 请访问 UIUpdateLink 文档页面 SF Symbols 可确保工具栏图标、 导航栏及其他 UI 元素 保持外观一致 UIKit 中的 SF Symbols 进行了扩展 提供全新符号动画! UIImageView 和 UIBarButtonItem 中 新增了三种动画预设 .wiggle 效果能让符号以任意方向 或角度摆动 以呈现引人注目的视觉效果
.breathe 效果能让符号 平滑地放大和缩小 从而表明活动正在进行中 .rotate 效果能让符号的某些部分 围绕指定的锚点旋转 新增的 .periodic 行为 允许 App 指定重复次数 以及重复之间的自定延迟 还新增了一个 .continuous 选项 可在多次重复时无缝创建动画效果 直至动画结束 现有的一些预设也随着 新功能的推出得到了增强 默认的 .replace 效果现在 会首选新的 Magic Replace 行为 这个行为能流畅地为徽章和斜线 添加动画效果 如果需要 这个行为还会 自动退回到标准替换样式 例如 麦克风和视频符号 不支持 Magic Replace 因此作为回退行为会自动使用 DownUp 替换样式 还有新的 API 可以 指定显式回退样式 在本例中为 .upUp 样式
如果你想了解符号的其他更新内容 例如更新版“SF Symbols”App、 可变颜色时序的新注释 以及创建反弹效果的其他行为 请观看“SF Symbols 6 的新功能” 如需回顾如何采用符号效果请观看 “在 App 中为符号添加动画效果” 感观反馈是增强 iPhone App 的绝佳方式 在 iPadOS 17.5 中 这项功能 扩展到了配备 Apple Pencil Pro 和妙控键盘的 iPad UIFeedbackGenerator 支持 这些提供反馈的新方式 并能以交互形式附加到视图 在提供反馈时 App 现在应在相应视图内 传递发生反馈触发操作的位置 还有一个新的 UICanvasFeedbackGenerator 非常适合具有大型绘图 或画板视图的 iPad App 下面我将详细介绍这些方面 是如何整合到一个 App 中的 以一个形状绘图 App 为例 当拖移形状并与网格对齐时 它就会提供反馈 这是 UICanvasFeedbackGenerator 的一种出色用法 创建反馈生成器后 我会将它与视图关联起来
反馈被触发时 我会传入位置信息 在本例中 是来自手势识别器的位置 触发了所拖移形状的对齐操作
现在使用 Apple Pencil Pro 拖移形状以使它与对齐参考线对齐 这时铅笔会提供触觉反馈
请记住 反馈发生器 不仅适用于触觉反馈 根据平台和设置的不同 反馈发生器可能会使用触觉反馈、 音频反馈 两者都使用或都不使用
无论预期效果如何 App 都应始终在所有平台上 使用相同的生成器 iOS 18 中还扩展了 文本格式设置功能 利用全新的文本格式设置面板 为提供文本格式设置选项的 App 提供一致的可自定体验 允许编辑文本属性的 UITextViews 具备一个新的“编辑”菜单操作 这个操作会显示新的格式设置面板 其中包含一组默认选项
使用文本格式设置更改字体和大小、 添加列表以及修改其他属性等 操作既明了又简单
格式设置面板还支持 新的文本高亮显示功能
它的工作原理是应用两项新属性 一项是 textHighlightStyle 表示应高亮显示的文本范围 另一项 是 textHighlightColorScheme 表示用于渲染高亮显示的颜色
除了使用色调的默认配色方案外 还有 5 种预定义配色方案 通过使用 UITextView 的新的 textFormattingConfiguration 属性 来设置自定 UITextFormattingViewController.Configuration 可自定格式设置面板的 可用控件和布局 将这个属性设置为“nil” 即可选择退出新行为 要定制这个面板的显示方式 请使用新的 UITextFormattingViewController 以及它的委托
Writing Tools 是一项出色的新功能 可提供高级文本编辑体验
UITextViews 会默认显示 Writing Tools UI 可编辑的文本视图会获得 全面的行内编辑校对 和合成支持 而不可编辑的文本视图 则会获得 overlay 面板 UITextView 还有用于 追踪和修改这种用户界面体验的其他 API 包括委托通知和用于限制行为的属性 菜单操作可在 macOS 菜单栏、iPadOS 和 visionOS 键盘快捷菜单中 提供某个 App 的所有命令 iOS 18 使菜单操作 对于仅支持 iPhone 的 App 更实用 使用 UICommand、 UIKeyCommand 和 UIAction 为 App 做好准备 以支持其他系统调用 系统可以调用 UICommand、 UIKeyCommand 和 UIAction 来控制 App 比如通过 iPhone Mirroring 使用 App 时 将从 Mac 键盘调用 UIKeyCommand 如需了解如何向主菜单系统添加命令 请观看视频 “让你的 iPad App 更上一层楼” 下面我将介绍 UIKit 和 PencilKit 中的新增功能 这些功能用于利用 Apple Pencil Pro 来整合绘图体验 并以更少的代码 提供丰富的工具选择体验 作为 iPadOS 17.5 中的一项新功能 UIKit 支持 Apple Pencil Pro 的 所有出色新功能 轻捏手势是一种切换工具或在需要时 显示选择器的快捷方式 相应操作在铅笔悬停的位置即可完成 更新版反馈生成器 可与 Apple Pencil Pro 完美搭配 从而能够提升绘图和书写体验 UITouch 和 UIHoverGestureRecognizer 提供 侧旋角度 有助于使 App 的绘图工具 更富表现力 对于支持撤销操作的所有 App 轻捏 Apple Pencil Pro 就会出现一个撤销滑块 这是浏览撤销历史记录的最快捷方式 作为 iPadOS 18 和 visionOS 2 中 的新功能 PKToolPicker 现在可以让你定义可用的工具 你可以将这个工具选择器 与 PKCanvasView、 你自己的绘图画布 或两者的组合搭配使用! 还有一个新的 API 可以 将自定绘图画布中的工具 构建到工具选择器中 有了对 Apple Pencil Pro 的 深度支持 现在正是采用 PKToolPicker 的最佳时机 请观看视频 “充分利用 Apple Pencil 的强大功能” 全面了解新的 Apple Pencil API 哇!功能方面的改进真的好多! UIKit 确实新增了一系列功能 进一步增强了自身能力 接下来该做什么呢? 使用 iOS 18 SDK 编译你的 App 采用 UIKit 的新功能 充分利用过渡和动画、标签栏 以及新文稿启动体验方面的改进 继续尝试在 App 中 整合 UIKit 和 SwiftUI 的新方法! 谢谢大家!
-
-
0:01 - Using SwiftUI to animate UIViews with gestures
switch gesture.state { case .changed: UIView.animate(.interactiveSpring) { bead.center = gesture.translation } case .ended: UIView.animate(.spring) { bead.center = endOfBracelet } }
-
0:02 - Setting failure requirements between gestures
// Inner SwiftUI double tap gesture Circle() .gesture(doubleTap, name: "SwiftUIDoubleTap") // Outer UIKit single tap gesture func gestureRecognizer( _ gestureRecognizer: UIGestureRecognizer, shouldRequireFailureOf other: UIGestureRecognizer ) -> Bool { other.name == "SwiftUIDoubleTap" }
-
0:03 - Responding to horizontalSizeClass trait
class MyView: UIView { override func layoutSubviews() { super.layoutSubviews() if traitCollection.horizontalSizeClass == .compact { // apply compact layout } else { // apply regular layout } } }
-
0:04 - Using the new automatic content and background configurations
func configurations(for location: FileLocation) -> (UIListContentConfiguration, UIBackgroundConfiguration) { var contentConfiguration = UIListContentConfiguration.cell() let backgroundConfiguration = UIBackgroundConfiguration.listCell() contentConfiguration.text = location.title contentConfiguration.image = location.thumbnailImage return (contentConfiguration, backgroundConfiguration) }
-
0:05 - Using UIUpdateLink
let updateLink = UIUpdateLink( view: view, actionTarget: self, selector: #selector(update) ) updateLink.requiresContinuousUpdates = true updateLink.isEnabled = true @objc func update(updateLink: UIUpdateLink, updateInfo: UIUpdateInfo) { view.center.y = sin(updateInfo.modelTime) * 100 + view.bounds.midY }
-
0:06 - An example of providing UICanvasFeedbackGenerator with additional context
@ViewLoading var feedbackGenerator: UICanvasFeedbackGenerator override func viewDidLoad() { super.viewDidLoad() feedbackGenerator = UICanvasFeedbackGenerator(view: view) } func dragAligned(_ sender: UIPanGestureRecognizer) { feedbackGenerator.alignmentOccurred(at: sender.location(in: view)) }
-
0:07 - Using new attributes for highlight
var attributes = [NSAttributedString.Key: Any]() // Highlight style attributes[.textHighlightStyle] = NSAttributedString.TextHighlightStyle.default // Highlight color scheme attributes[.textHighlightColorScheme] = NSAttributedString.TextHighlightColorScheme.default
-
0:08 - Customizing formatting panel
textView.textFormattingConfiguration = .init(groups: [ .group([ .component(.fontAttributes, .mini), .component(.fontPicker, .regular), .component(.textColor, .mini) ]), .group([ .component(.fontPointSize, .mini), .component(.listStyles, .regular), .component(.highlight, .mini) ]) ])
-
-
正在查找特定内容?在上方输入一个主题,就能直接跳转到相应的精彩内容。
提交你查询的内容时出现错误。请检查互联网连接,然后再试一次。