HomeiOS DevelopmentThe right way to apply a background outdoors a rounded view’s nook...

The right way to apply a background outdoors a rounded view’s nook radius? [closed]


I’m studying easy methods to construct a Toast notification for an iOS app utilizing SwiftUI.

I can’t determine how to attract a background outdoors the rounded view — particularly, I want a coloured sidebar behind the content material of the toast view.

Here’s what I presently get:
The right way to apply a background outdoors a rounded view’s nook radius? [closed]

And that is the UI I wish to obtain:
enter image description here

Right here is my code:

struct FancyToastView: View {
    var sort: FancyToastStyle
    var title: String
    var message: String
    var onCancelTapped: (() -> Void)
    var physique: some View {
        VStack(alignment: .main) {
            HStack(alignment: .high) {
                Picture(systemName: sort.iconFileName)
                    .foregroundColor(sort.themeColor)
                
                VStack(alignment: .main) {
                    Textual content(title)
                        .font(.system(measurement: 14, weight: .semibold))
                    
                    Textual content(message)
                        .font(.system(measurement: 12))
                        .foregroundColor(Coloration.black.opacity(0.6))
                }
                
                Spacer(minLength: 10)
                
                Button {
                    onCancelTapped()
                } label: {
                    Picture(systemName: "xmark")
                        .foregroundColor(Coloration.black)
                }
            }
            .padding()
        }
        .background(Coloration.white)
        .overlay(
            Rectangle()
                .fill(sort.themeColor)
                .body(width: 6)
                .clipped()
            , alignment: .main
        )
        .body(minWidth: 0, maxWidth: .infinity)
        .cornerRadius(8)
        .shadow(coloration: Coloration.black.opacity(0.25), radius: 4, x: 0, y: 1)
        .padding(.horizontal, 16)
    }
}

How can I apply a background behind the rounded view so the corners keep rounded, however the background nonetheless fills all the width?

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments