Question

以下应该创建一个Text，其边界占据了整个屏幕，但似乎无济于事。

struct ContentView: View {
    var body: some View {
        Text("foo")
            .relativeSize(width: 1.0, height: 1.0)
            .background(Color.red)
    }
}

以下黑客：

extension View {
    /// Causes the view to fill into its superview.
    public func _fill(alignment: Alignment = .center) -> some View {
        GeometryReader { geometry in
            return self.frame(
                width: geometry.size.width,
                height: geometry.size.height,
                alignment: alignment
            )
        }
    }
}

struct ContentView2: View {
    var body: some View {
        Text("foo")
            ._fill()
            .background(Color.red)
    }
}

但是似乎可以正常工作。

这是带有relativeSize的SwiftUI错误，还是我遗漏了一些东西？

Answer 1

另一种可能性是在scaledToFill上使用ZStack。这样会产生相同的效果，但读取效果可能会好一些。

var body: some View {
    ZStack {
        Color.red
        Text("Hello")
    }.scaledToFill()
}

Answer 2

您需要观看WWDC 2019 Session 237: Building Custom Views with SwiftUI，因为Dave Abrahams讨论了该主题，并在示例中使用了Text。

要简短地重申Dave详细解释的内容，

父级（在这种情况下，是系统创建并填充屏幕的根视图）为子级提出尺寸。
孩子选择自己的体型，根据需要消耗建议的体型大小。
父母根据各种参数（包括孩子选择的尺寸）将孩子放置在父母的坐标空间中。

因此，您不能强迫小的Text填满屏幕，因为Text会拒绝消耗超出其内容容纳空间的空间。

如果希望红色背景填充屏幕，可以将Text包裹在可扩展视图中，将可扩展视图强制为完整大小，然后设置可扩展视图的背景。这有效：

var body: some View {
    ZStack {
        Spacer()
        Text("Hello")
        }
        .background(Color.red)
}

Spacer接受其父级提供的任何大小，因此ZStack不能缩小到Text的大小。

如何获取SwiftUI视图以完全填充其超级视图？

2 个答案: