SwiftUI:在 VStack 中查看阴影?
SwiftUI: Shadow on view in VStack?
我有以下代码:
struct ViewA: View {
var body: some View {
Rectangle()
.fill(Color(.yellow))
}
}
struct ViewB: View {
var body: some View {
Rectangle()
.fill(Color(.white))
}
}
struct ViewC: View {
var body: some View {
Rectangle()
.fill(Color(.blue))
}
}
struct TestView: View {
var body: some View {
GeometryReader { geo in
VStack(spacing: 0) {
ViewA()
.frame(width: geo.size.width, height: geo.size.width/4, alignment: .center)
.shadow(color: .black, radius: 10, x: 0, y: 10)
ViewB()
ViewC()
.frame(width: geo.size.width, height: 100, alignment: .center)
.shadow(color: .black, radius: 10, x: 0, y: 0)
.opacity(0.8)
}
}
}
}
绘制:
底部的阴影显示为蓝色覆盖白色视图(ViewC 覆盖 ViewB)。
我想让黄色视图 (ViewA) 在白色视图上投下阴影。
我希望白色视图看起来像是在顶视图(黄色)和底视图(蓝色)之下。
我不确定如何组织视图,以便顶视图也能在中间视图上投下阴影。
我该如何完成?
如果将视图放在 ZStack
中,View 在 ViewS 和 ViewS 后面,您将看到阴影:
GeometryReader { geo in
ZStack {
ViewB()
VStack(spacing: 0) {
ViewA()
.frame(
width: geo.size.width,
height: geo.size.width/4,
alignment: .center)
.shadow(
color: .black,
radius: 10,
x: 0, y: 0)
Spacer()
ViewC()
.frame(
width: geo.size.width,
height: 100,
alignment: .center)
.shadow(
color: .black,
radius: 10,
x: 0, y: 0)
.opacity(0.8)
}
}
}
您可以将 zindex 修饰符应用于 ViewA。例如 .zIndex(.infinity)。它会将 ViewA 置于一切之上。
https://developer.apple.com/documentation/swiftui/view/zindex(_:)
我有以下代码:
struct ViewA: View {
var body: some View {
Rectangle()
.fill(Color(.yellow))
}
}
struct ViewB: View {
var body: some View {
Rectangle()
.fill(Color(.white))
}
}
struct ViewC: View {
var body: some View {
Rectangle()
.fill(Color(.blue))
}
}
struct TestView: View {
var body: some View {
GeometryReader { geo in
VStack(spacing: 0) {
ViewA()
.frame(width: geo.size.width, height: geo.size.width/4, alignment: .center)
.shadow(color: .black, radius: 10, x: 0, y: 10)
ViewB()
ViewC()
.frame(width: geo.size.width, height: 100, alignment: .center)
.shadow(color: .black, radius: 10, x: 0, y: 0)
.opacity(0.8)
}
}
}
}
绘制:
底部的阴影显示为蓝色覆盖白色视图(ViewC 覆盖 ViewB)。 我想让黄色视图 (ViewA) 在白色视图上投下阴影。
我希望白色视图看起来像是在顶视图(黄色)和底视图(蓝色)之下。
我不确定如何组织视图,以便顶视图也能在中间视图上投下阴影。
我该如何完成?
如果将视图放在 ZStack
中,View 在 ViewS 和 ViewS 后面,您将看到阴影:
GeometryReader { geo in
ZStack {
ViewB()
VStack(spacing: 0) {
ViewA()
.frame(
width: geo.size.width,
height: geo.size.width/4,
alignment: .center)
.shadow(
color: .black,
radius: 10,
x: 0, y: 0)
Spacer()
ViewC()
.frame(
width: geo.size.width,
height: 100,
alignment: .center)
.shadow(
color: .black,
radius: 10,
x: 0, y: 0)
.opacity(0.8)
}
}
}
您可以将 zindex 修饰符应用于 ViewA。例如 .zIndex(.infinity)。它会将 ViewA 置于一切之上。 https://developer.apple.com/documentation/swiftui/view/zindex(_:)