从 SwiftUI 中的 Observable 视图模型初始化 Map

Initializing Map from an Observable view model in SwiftUI

我正在尝试从视图模型在 SwiftUI 视图上实现 Map。我在网上找到的每个例子都硬编码了一个坐标。就我而言,我正在使用 Codable 结构初始化视图模型,但我不知道坐标是什么。

我在构建项目时没有遇到编译器问题,但 canvas 崩溃了。我试过关闭 Xcode、清理派生数据等,但这似乎无法解决问题。

非常感谢任何关于我的错误的建议。

class EarthquakeViewModel: ObservableObject {
    @Published private(set) var quakeData: Feature
    @State var region: MKCoordinateRegion
    
    
    init(quakeData: Feature) {
        self.quakeData = quakeData
        let center = CLLocationCoordinate2D(latitude: quakeData.geometry.coordinates[0],
                                        longitude: quakeData.geometry.coordinates[1])
        let span = MKCoordinateSpan(latitudeDelta: 1.0, longitudeDelta: 1.0)
        region = MKCoordinateRegion(center: center,
                                    span: span)
    }

        public lazy var title: String = {
        quakeData.properties.title
    }()
}

这是我的 ContentView:

struct EarthquakeView: View {
    @ObservedObject var viewModel: EarthquakeViewModel
    
    var body: some View {
        VStack {
            Text(viewModel.title)
//            makeMapView()
            Map(coordinateRegion: $viewModel.region)
        }
    }
}

// 这个我也试过了,但是不行。

extension EarthquakeView {
    @ViewBuilder func makeMapView() -> some View {
        Map(coordinateRegion: $viewModel.region)
    }
}

更新

这是来自诊断的消息。使用 Xcode 关闭清理派生数据似乎无法解决问题,所以我认为我的问题在于我的声明之一:

RemoteHumanReadableError: Failed to update preview.

The preview process appears to have crashed.

Error encountered when sending 'render' message to agent.

==================================

|  RemoteHumanReadableError: The operation couldn’t be completed. (BSServiceConnectionErrorDomain error 3.)
|  
|  BSServiceConnectionErrorDomain (3):
|  ==BSErrorCodeDescription: OperationFailed

更新 2

我调整了我的数据模型并从中添加了一个计算区域变量,现在我是这样获取区域的:

extension Feature /* Feature is a Codable struct */ {
    var region: MKCoordinateRegion {
        let center = CLLocationCoordinate2D(latitude: geometry.coordinates[0],
                                            longitude: geometry.coordinates[1])
        let span = MKCoordinateSpan(latitudeDelta: 1.0, longitudeDelta: 1.0)
        let region = MKCoordinateRegion(center: center,
                                        span: span)
        
        return region
    }
}

根据 jnpdx's 建议,我将视图模型上的区域更新为 @Published

class EarthquakeViewModel: ObservableObject {
    `@Published private(set) var quakeData: Feature
    `@Published var region: MKCoordinateRegion
    
    init(quakeData: Feature) {
        self.quakeData = quakeData
        region = quakeData.region
    }
    
    public lazy var title: String = {
        quakeData.properties.title
    }()
}

最后是我的View,如下:

struct EarthquakeView: View {
    @ObservedObject var viewModel: EarthquakeViewModel
    
    @State var region: MKCoordinateRegion
    
    init(viewModel: EarthquakeViewModel) {
        self.viewModel = viewModel
        _region = State(initialValue: viewModel.region)
    }
    
    var body: some View {
        VStack {
            Text(viewModel.title)
            Map(coordinateRegion: $region)
        }
    }
}

新的错误是这个。关闭 Xcode、重新启动、清理派生数据等似乎无法解决问题,所以我很快得出结论,我缺少一些基本的东西:

PreviewUpdateTimedOutError: Updating took more than 5 seconds Updating a preview from EarthquakeView_Previews in CombineQuake.app (16766) took more than 5 seconds.

更新 3

预览初始化:

struct EarthquakeView_Previews: PreviewProvider {
    static var previews: some View {
        
        let quakeData = EarthQuakeData(mag: 6.5,
                                       place: "32km W of Sola, Vanuatu",
                                       time: 1388592209000,
                                       updated: 1594407529032,
                                       tz: 660,
                                       url: "https://earthquake.usgs.gov/earthquakes/eventpage/usc000lvb5",
                                       detail: "https://earthquake.usgs.gov/fdsnws/event/1/query?eventid=usc000lvb5&format=geojson",
                                       felt: nil,
                                       cdi: nil,
                                       mmi: nil,
                                       alert: nil,
                                       status: "reviewed",
                                       tsunami: 1,
                                       sig: 650,
                                       net: "us",
                                       code: "c0001vb5",
                                       ids: ",pt14001000,at00myqcls,usc000lvb5,",
                                       sources: "pt,at,us",
                                       types: "cap,geoserve,impact-link,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary",
                                       nst: nil,
                                       dmin: 3.997,
                                       rms: 0.76,
                                       gap: 14.0,
                                       magType: "mww",
                                       type: "earthquake",
                                       title: "M 6.5 - 32km W of Sola, Vanuatu")
        let geometry = Geometry(type: "Point",
                                coordinates: [167.249, -13.8633, 187.0])
        let earthquake = Feature(type: "Feature",
                                 properties: quakeData,
                                 geometry: geometry,
                                 id: "usc000lvb5")
        
        let viewModel = EarthquakeViewModel(quakeData: earthquake)
        
        
        EarthquakeView(viewModel: viewModel)
    }
}

如果您 运行 在模拟器而不是预览中执行此操作,您会得到更有用的错误:

*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'Invalid Region <center:+167.24900000, -13.86330000 span:+1.00000000, +1.00000000>'

我改了:

let geometry = Geometry(type: "Point",
                                coordinates: [167.249, -13.8633, 187.0])

let geometry = Geometry(type: "Point",
                                coordinates: [45, 34, 187.0])

而且效果很好。

您的纬度 167.249 超出了 -90 到 90 的有效范围。