SwiftUI

SwiftUI 页面导航最佳实践

Dev

SwiftUI 页面导航最佳实践

通过全局 Router 1. 定义一个全局 Router 对象,维护页面跳转类型和参数。 @Observable final class Router { public enum Destination: Codable, Hashable { case pageA(models: [Model]) case pageB } var navPath = NavigationPath() func navigate(to destination: Destination) { navPath.append(destination) } func navigateBack() { navPath.removeLast() } func navigateToRoot() { navPath.removeLast(navPath.count) } } 枚举 Destination 可以指

By Gray
SwiftUI|监测视图更新及更新原因

Dev

SwiftUI|监测视图更新及更新原因

SwiftUI 的优势之一就是可以自动让 UI 和数据状态保持同步。频繁的视图更新也会带来一定的性能问题,尽管 Apple 已经让 SwiftUI 在更新时尽量只渲染视图树中必须重绘的部分,但我们还是需要知道某种可以监测视图更新以及触发其更新的原因的手段。这样我们才能在业务层面做一些针对性的性能优化。 我们可以通过在 View 的 body 视图构造器中插入一条 print 语句来监测到哪些视图的 body 正在被执行。这条语句还必须是一个赋值语句,不能是仅一个 print。因为 print 返回的是一个 Void ,而不是一个 View ,视图构造器会报错。 struct ContentView: View { var body: some View { let _ = print("ContentView Changed!") VStack { Image(systemName: "globe"

By Gray

SwiftUI 自适应布局

SwiftUI Adaptive Layout 使用 UIKit 写一套能够根据屏幕尺寸和方向自动更换布局的代码是比较麻烦的(至少从我目前的经验来看~),但是用 SwiftUI 来实现就会轻松一点。 在 SwiftUI 中,Apple 引入了一个概念 Size Classes (尺寸类型),且在横向和竖向两个维度上分别有 Horizontal Size Class 和 Vertical Size Class. Size Classes 可进一步分为两种:regular (标准) 和 compact (紧凑). 而设备的 Size Classes 由它的屏幕尺寸和屏幕方向决定,目前常见的设备 Size Classes 如下表所示, Horizontal Size Class (Width) Vertical Size Class (Height)

By Gray

SwiftUI 预览视图

SwiftUI 一个很强的特性就是可以实时预览页面,边写代码边看代码的实现效果 同时预览多个机型 如果想在 SwiftUI 项目中预览多个机型的话,可以把 Preview 的代码改成如下形式: struct ContentView_Previews: PreviewProvider { static var previews: some View { Group { ContentView() .previewInterfaceOrientation(.portrait) // 这里修改设备屏幕方向 ContentView() .previewInterfaceOrientation(.landscapeLeft) ContentView() .previewDevice(PreviewDevice(rawValue: "iPhone 12 Pro")) // 这里修改设备型号,设备型号

By Gray