外观风格
使用第三方框架的 SwiftUI View
接下来将创建一个以给定坐标为中心的地图。你可以使用 MapKit
的 MapView
来渲染地图。
![](https://cdn.konnga.cn/devcursor/swift-ui/01050H.png)
下面,我们需要创建一个新的自定义视图来管理地图。
第 1 步
在导航栏中选择 File
> New
> File
,选择 iOS
平台,选择 SwiftUI View
模板,然后点击 Next
。将新文件命名为 MapView.swift
,然后点击 Create
。
![](https://cdn.konnga.cn/devcursor/swift-ui/010402@2x-1.png)
第 2 步
引入 MapKit
。
提示
当你在同一个文件中引入 SwiftUI
和第三方框架时,你就能获得该框架提供的 SwiftUI
相关的特定功能。
第 3 步
创建一个私有的状态变量,用于保存地图的区域信息。
提示
使用 @State
属性为应用程序中的数据建立一个真实来源,可以从多个视图修改该事实来源。SwiftUI 会管理底层存储,并自动更新依赖于该值的视图。
第 4 步
用地图视图替换默认的文本视图。
通过在状态变量前加上 $
前缀,可以传递一个绑定,这类似于对值的引用。当用户与地图进行交互时,地图会更新 region
的值,以匹配当前在用户界面上可见的地图部分。
当预览处于静态模式时,仅会显示 SwiftUI 视图。对于地图视图,需要切换到实时模式才能看到地图。
第 5 步
点击实时预览,切换到实时模式。
稍等片刻,将会看到以 Turtle Rock
为中心的地图。你也可以在实时预览中操作地图,将其放大一些,查看周围的区域。
![](https://cdn.konnga.cn/devcursor/swift-ui/010505@2x.png)