SwiftUI从入门到实战第2章第9节:MapView

Easter79
• 阅读 348

SwiftUI并没有包含MapView,这里通过遵循UIViewRepresentable协议,在SwiftUI中集成UIKit中的WKMapView。

示例代码:

import SwiftUI
import MapKit    //首先导入需要使用到的MapKit框架。

//使当前的结构体遵循UIViewRepresentable协议。使用该协议的实例,可以在SwiftUI中创建和管理UIView对象。
struct ContentView : UIViewRepresentable {
    
    //实现协议里的makeUIView方法,用来初始化并返回一个MKMapView地图视图对象。
    func makeUIView(context: UIViewRepresentableContext<ContentView>) -> MKMapView {
        return MKMapView()
    }
    
    //接着实现协议里的updatedUIView方法,用来设置地图视图需要加载的地理坐标等参数。
    func updateUIView(_ uiView: MKMapView, context: UIViewRepresentableContext<ContentView>) {

        //设置地图视图显示用户所在的地理位置,并设置地图类型为卫星模式。
        uiView.showsUserLocation = true
        uiView.mapType = MKMapType.satellite
        
        //初始化一个二维坐标,并设置经纬度的数值。
        let coordinate2D = CLLocationCoordinate2D(latitude: 39.915352, longitude: 116.397105)

        //设置地图视图的缩放比例为0.02。
        let zoomLevel = 0.02

        //初始化一个坐标区域对象,作为地图视图所要显示的地理区域。
        let region = MKCoordinateRegion(center: coordinate2D, span: MKCoordinateSpan(latitudeDelta: zoomLevel, longitudeDelta: zoomLevel))
        //使地图视图显示自定义的地理区域
        uiView.setRegion(uiView.regionThatFits(region), animated: true)
    }
}

查看运行结果:

SwiftUI从入门到实战第2章第9节:MapView

点赞
收藏
评论区
推荐文章
刚刚好 刚刚好
2个月前
css问题
1、 在IOS中图片不显示(给图片加了圆角或者img没有父级) <div<img src""/</div div {width: 20px; height: 20px; borderradius: 20px; overflow: h
Souleigh ✨ Souleigh ✨
1年前
前端性能优化 - 雅虎军规
无论是在工作中,还是在面试中,web前端性能的优化都是很重要的,那么我们进行优化需要从哪些方面入手呢?可以遵循雅虎的前端优化35条军规,这样对于优化有一个比较清晰的方向. 35条军规1. 尽量减少 HTTP 请求个数——须权衡2. 使用 CDN(内容分发网络)3. 为文件头指定 Expires 或 CacheControl ,使内容具有缓存性。4. 避免空的
晴空闲云 晴空闲云
2个月前
css中box-sizing解放盒子实际宽高计算
我们知道传统的盒子模型,如果增加内边距padding和边框border,那么会撑大整个盒子,造成盒子的宽度不好计算,在实务中特别不方便。boxsizing可以设置盒模型的方式,可以很好的设置固定宽高的盒模型。 盒子宽高计算假如我们设置如下盒子:宽度和高度均为200px,那么这会这个盒子实际的宽高就都是200px。但是当我们设置这个盒子的边框和内间距的时候,那
艾木酱 艾木酱
1个月前
快速入门|使用MemFire Cloud构建React Native应用程序
> MemFire Cloud是一款提供云数据库,用户可以创建云数据库,并对数据库进行管理,还可以对数据库进行备份操作。它还提供后端即服务,用户可以在1分钟内新建一个应用,使用自动生成的API和SDK,访问云数据库、对象存储、用户认证与授权等功能,可专
Easter79 Easter79
1年前
SwiftUI直通车系列(3)—— 使用导航
SwiftUI直通车系列三(3)—— 使用导航 =======================     关于SwiftUI,我们前两篇博客介绍了独立组件的布局与属性设置相关内容,并且介绍了开发中最常用的列表视图的使用。但是一个完整的应用程序不可能是单界面的,如何使用SwiftUI进行界面间的导航跳转,是我们本博客讨论的重点。前两篇博客地址如下: [Swi
Easter79 Easter79
1年前
SwiftUI 布局框架
Basic View ---------- #### [](https://www.oschina.net/action/GoToLink?url=https%3A%2F%2Fswift.ctolib.com%2FJinxiansen-SwiftUI.html%23text)Text `Text` is used to display one or mo
Wesley13 Wesley13
1年前
IOS开发
在SwiftUI中显示模态视图 =============== 简介 -- 这里教大家如何弹出一个简单的模态视图。分别有两个页面,ContentView和GCPresentedView,以下对应简称为A和B。我们要做的是在A视图中点击按钮跳转到B视图,然后再从B视图点击按钮返回到A视图。 步骤 -- **在A视图中创建按钮和模态视图代码**
可莉 可莉
1年前
016_swiftui_日期的使用
// // ContentView.swift // learn_swiftUi // // Created by liuan on 2020/5/14. // Copyright © 2020 liuan. All rights reserved. // import Swi
可莉 可莉
1年前
015_swiftui_刘海屏适配
swiftUi创建的视图是默认在刘海屏幕的安全区域以内的。 之前我们设置图片也用到了这个个属性。 现在我们再来使用下吧 .edgesIgnoringSafeArea(.all) 下面就是图片了。  ![](https://img-blog.csdnimg.cn/20200514174703741.png?x-oss-process
Easter79 Easter79
1年前
swiftUi propertWrapper 自定义标记属性
上篇文章我们知道@Status  的作用了 那么我们也可以自己定义类似的这种标签。。 首先我们先来看下不使用属性标签,向导页面如何写 // // PropertyWrapperView.swift // learn_swiftUi // // Created by liuan on 2020/9/4.
helloworld_28799839 helloworld_28799839
2个月前
常用知识整理
# Javascript ## 判断对象是否为空 ```js Object.keys(myObject).length === 0 ``` ## 经常使用的三元运算 > 我们经常遇到处理表格列状态字段如 `status` 的时候可以用到 ``` vue