HomeiOS Developmentios - SwiftUI: Lengthy Press fills button to indicate progress?

ios – SwiftUI: Lengthy Press fills button to indicate progress?


I pieced collectively this code for a watch app and it type of works nevertheless it’s not excellent. (1) The fill doesn’t match precisely, it begins exterior the bounds of the buttons view however I can not determine how you can match the dimensions of the button precisely. (2) I can not get the tappable space to increase to the left and proper sides of the view. Even when I add .contentShape(rectangle) or .body(maxWidth: .infinity) the one half that’s tappable is the center the place the picture and textual content are. Is there a greater means to do that?

struct ContentView2: View {
    
    @State var isComplete: Bool = false
    @State var isSuccess: Bool = false
    
    var physique: some View {
        VStack {
            ZStack {
                RoundedRectangle(cornerRadius: 12.0)
                    .fill(isSuccess ? Colour.clear : Colour.pink.opacity(0.50))
                    .body(maxWidth: isComplete ? .infinity : 0)
                    .body(peak: 55) //How one can now onerous code this? 
                    .body(maxWidth: .infinity, alignment: .main)
                Button(motion: {}, label: {
                    VStack  {
                        Picture(systemName: "multiply.circle.fill")
                            .font(.system(measurement: 24, weight: .common))
                            .foregroundColor(.pink)
                        Textual content("Maintain to Finish")
                            .font(.footnote)
                    }
                    .onLongPressGesture(minimumDuration: 1.0, maximumDistance: 50) {
                        withAnimation(.easeInOut) {
                            isSuccess = true
                            //carry out motion
                        }
                        
                    } onPressingChanged: { isPressing in
                        if isPressing {
                            withAnimation(.easeIn(length: 1.0)) {
                                isComplete = true
                            }
                        } else {
                            DispatchQueue.most important.asyncAfter(deadline: .now() + 0.1) {
                                if !isSuccess {
                                    withAnimation(.easeInOut) {
                                        isComplete = false
                                    }
                                }
                            }
                        }
                    }
                })
                .tint(.pink)
                
            }
        }
    }
}

#Preview {
    ContentView2()
}

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments