Subview есть родительская тень, даже с фоном

Question

Итак, я только начал разрабатывать с SwiftUI и столкнулся с небольшой проблемой. Подвиды также отображают тень суперпредставления, даже если у суперпредставления есть фон. Кто-нибудь знает, как это исправить?

HStack {
    HStack {
        [...]
    }
    .padding(.leading, 12.0)
    .padding(.trailing, 4.0)
    .padding(.vertical, 16.0)
    .background(Color("lightGreen"))
    .cornerRadius(10)
}
.padding(8)
.background(Color.white)
.shadow(color: Color("tabShadow"), radius: 0.0, x: 0.0, y: -0.5)
.shadow(color: Color("tabShadow"), radius: 0.0, x: 0.0, y: 0.5)

Как уже говорилось, тень первого HStack не должна копироваться в дочернюю, но это так. Только первый, хотя. Есть намеки?

Answer 1

Некоторые модификаторы, помещенные в стек, наследуются всеми их дочерними элементами. Например, если у вас есть стек, содержащий несколько представлений Text, вы можете поместить один модификатор .font () в стек, и все они будут изменены.

Похоже, что .shadow () является одним изэти модификаторы. Относительно того, почему наследуется только один, я подозреваю, что разработчики SwiftUI не ожидают, что .shadow () будет вызываться более одного раза для определенного представления, и не проверяли это.

Если выпросто пытаемся провести цветную линию по верху и низу вида, возможно, попробуйте что-то вроде

.background(Color.white)
.background(Color("tabShadow").offset(x: 0, y: -0.5))
.background(Color("tabShadow").offset(x: 0, y: 0.5))

Answer 2

Вы можете попробовать трюки с «оверлеем» и «фоном», когда вам нужно заставить их рендериться за несколько проходов. В приведенном выше случае наложение не будет зависеть от тени или других эффектов.

Если вы думаете, что они являются подвидами, на самом деле они просто визуализируются после суперпросмотра. Это 2D мир. Так что оверлей будет совершенно независимо.

Единственная проблема - только размер оверлея.

Скрытый () используется здесь, чтобы занять позицию невидимого наложения. Это очень круто, если вы овладеете этими навыками верстки.

struct ContentView: View {

var body: some View {

HStack {
    SubContentView().hidden()
}
.padding(8)
.background(Color.white)
.shadow(color: Color.red, radius: 0, x: 0.0, y: -0.5)
.shadow(color: Color.red, radius: 0, x: 0.0, y: 0.5)

.overlay(SubContentView())

}
}

struct SubContentView: View {
var body: some View {
    HStack{
               Text("a")
                Text("b")
                Text("c")
               Text("a")
               Text("b")
               Text("c")
           }.padding(.leading, 12.0)
           .padding(.trailing, 4.0)
           .padding(.vertical, 16.0)
           .background(Color.green)
           .cornerRadius(10)
}
}