как сделать тень subview кровоточащей из родительского представления в SwiftUI? - PullRequest
Новая
       53

как сделать тень subview кровоточащей из родительского представления в SwiftUI?

1 голос
/ 10 июля 2020

Как поясняется в заголовке, мне нужно сделать тень субпредставления, выходящей за пределы родительских границ.

Мы видим, что тень обрезается контейнером (родительский вид). Как это игнорировать?

enter image description here

ScrollView(axis, showsIndicators: false) {
    HStack{

        ForEach(d_keys.indices) { index -> DownloadOptionView in

            let d_key = d_keys[index]
            let d_info = asset.downloads[d_key]!
            
            return DownloadOptionView(d_key: d_key, d_info: d_info)
        }.padding(.vertical, 10) // ForEach
    }
}.frame(minHeight:130)

// Структура просмотра для DownloadOptionView, измененная, может не компилироваться 

struct DownloadOptionView: View {
    let d_key: String
    let d_info: DownloadInfo

    // some @ObservedObject ...........
    // some @State ...........
    
    var body: some View {
        
        return NavigationLink(destination: SceneKitCanvas(textureMap: textureMap), isActive: self.$present) {
            
        Button(action: {
            
            // Download / storage / animation      
        }) {
            ZStack{
                LinearGradient(gradient: Gradient(colors: [Neumorphism.background, Neumorphism.light]),
                               startPoint: .topLeading, endPoint: .bottomTrailing)
                
                Color.green.scaleEffect(x: 1.0, y: CGFloat(scale), anchor: .bottom) // progress bar
                Color.green.scaleEffect(x: 1.0, y: CGFloat(increased), anchor: lineAnchor)
                
                VStack(alignment: .leading, spacing: 5) {
                    HStack(alignment: .center) {
                        Image(systemName: imageName).aspectRatio(contentMode: .fit)
                        Text(file_type).fontWeight(.light)
                    }.padding(.bottom, 5)
                    Text(d_key).font(.footnote).fontWeight(.light)
                    Text(size_final).font(.footnote).fontWeight(.light)
                    
                }.padding() // VStack
            } // ZStack
        }
        .cornerRadius(20)
        .shadow(color: Color.gray, radius: 3, x: 3, y: 3)
        .shadow(color: Color.white, radius: 3, x: -3, y: -3)
        }
    }
}

1 Ответ

0 голосов
/ 11 июля 2020

Я сделал некоторые предположения о том, как вы создали DownloadOptionView, но ответ можно использовать в вашем контексте, поскольку это общий метод.

Там, где вы создаете DownloadOptionView, вам нужно добавить .blendMode(.overlay) модификатор: 

struct DownloadOptionView: Shape {
    func path(in rect: CGRect) -> Path {
        return RoundedRectangle(cornerRadius: 8, style: .continuous).path(in: rect)
    }

    var body: some View {
        RoundedRectangle(cornerSize: CGSize(width: 8, height: 8))
        .frame(minWidth: 200, minHeight: 200)
        .shadow(radius: 10)
        .blendMode(.overlay) //Add here.
    }
}
...