ZStack和使用.overlay()之间的区别 [英] Difference between a ZStack or using .overlay()

问题描述

使用ZStack和使用.overlay()修饰符有什么区别。

苹果说：

ZStack=覆盖其子项的视图，使其在两个轴上对齐。

.overlay=&q；在此视图前面分层一个二级视图。

举例：

ZStack(alignment: .bottom) {
    Image(systemName: "folder")
        .font(.system(size: 55, weight: .thin))
    Text("❤️")
}

Image(systemName: "folder")
    .font(.system(size: 55, weight: .thin))
    .overlay(Text("❤️"), alignment: .bottom)

不考虑代码大小，是否存在一个必须优先于另一个使用的不同目的？

推荐答案

ZStack中的视图相互独立，堆栈适合(如果没有自己的框架)到最大的视图。此外，可以使用.zIndex修饰符修改ZStack中的顺序。所有视图都在ZStack坐标空间中。

在.overlay情况下，覆盖内的视图始终绑定到父视图，并且始终在父视图(即ZIndex不起任何作用)。此外，重叠视图位于父视图坐标空间中。

最明显的区别是将视图设置为不同大小并应用剪辑，即

struct TestZStack: View {
    var body: some View {
        ZStack(alignment: .bottom) {
            Image(systemName: "folder")
                .font(.system(size: 55, weight: .thin))
            Text("❤️").font(.system(size: 55, weight: .thin))
        }
        .clipped()
    }
}

给予

struct TestOverlay: View {
    var body: some View {
        Image(systemName: "folder")
            .font(.system(size: 55, weight: .thin))
            .overlay(Text("❤️").font(.system(size: 55, weight: .thin)), alignment: .bottom)
            .clipped()
    }
}

给予

这篇关于ZStack和使用.overlay()之间的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！