在视图中设置高度并忽略安全的上边缘

时间:2019-06-07 11:38:11

标签: swift swiftui

我想显示一个MKMapView,高度为屏幕高度的一半,并且忽略顶部边缘。这是我的代码:

import SwiftUI
import MapKit

struct ContentView : View {
    var body: some View {
        VStack {
            MapView()
                .border(Color.red, width: 1)
                .edgesIgnoringSafeArea(.top)
          //      .frame(height: UIScreen.main.bounds.height / 2)

            Image("turtlerock")
                .clipShape(Circle())
                .overlay(Circle().stroke(Color.red, lineWidth: 1))

            Text("Test")
                .font(.title)

        }
    }
}

我注释掉了frame方法。这些是执行上述代码时的结果(左图),并且没有注释掉frame方法(右图):

enter image description here enter image description here

我们可以检查左边的图像,因此,如果不使用frame方法,则顶部的边缘将被忽略,这很好。使用合适的帧高方法在正确的图像上,不再忽略顶部边缘。

据我了解,应用于视图的修饰符的顺序很重要。我尝试了各种命令,但无法弄清楚如何用一半的屏幕高度创建MapView视图,而忽略顶部边缘。 MapView结构的定义如下:

import MapKit
import SwiftUI

struct MapView : UIViewRepresentable {
    func updateUIView(_ uiView: MKMapView, context: Context) {
        let coordinate = CLLocationCoordinate2D(latitude: 34.011286, longitude: -116.166868)
        let span = MKCoordinateSpan(latitudeDelta: 2.0, longitudeDelta: 2.0)
        let region = MKCoordinateRegion(center: coordinate, span: span)

        uiView.setRegion(region, animated: true)
    }

    func makeUIView(context: Context) -> MKMapView {
        MKMapView(frame: .zero)
    }
}

1 个答案:

答案 0 :(得分:0)

结果是,我只需要在最后添加一个Spacer():

struct ContentView : View {
    var body: some View {
        VStack {
            MapView()
                .border(Color.red, width: 1)
                .edgesIgnoringSafeArea(.top)
                .frame(height: UIScreen.main.bounds.height / 2)

            Image("turtlerock")
                .clipShape(Circle())
                .overlay(Circle().stroke(Color.red, lineWidth: 1))

            Text("Test")
                .font(.title)

            Spacer() // New line
        }
    }
}