CODEWITHSUNDEEP
buttonswiftuiimagebutton
mzm0227
mzm0227

Reputation: 65

Stop button from getting greyed out when clicked

I have a view with a bunch of buttons on the page. Each button uses an image of a book I added to my assets folder. On my button, I have some code on the .onLongPressGesture modifier which will basically change the scale of the image when clicked. So when you click the 'book button' it enlarges a bit and then decreases back to its original size when done clicking.

Issue I'm having is when I click on my button it grays out the button from its original colors and stays that way until the click action is done. Im guessing its some sort of default thing so the user knows its clicking the button. Is there anyway to disable this so the color/opacity of the button/image stays the same throughout the entire clicking process?

Button(
    action: {

    }, label: {
        Image("book_Fotor")
            .resizable()
            .scaledToFit()
            .frame(width: 70, height: 85)
    }
)
.scaleEffect(pressed ? 1.25 : 1.0)
.onLongPressGesture(
    minimumDuration: 2.5,
    maximumDistance: .infinity,
    pressing: { pressing in
        withAnimation(.easeIn(duration: 0.75)) {
            self.pressed = pressing
        }
    }, perform: {

    }
)

Upvotes: 1

Views: 374

Answers (2)

Mojtaba Hosseini
Mojtaba Hosseini

Reputation: 119128

Just don't use Button and use a simple onTapGesture modifier on the image itself:

Image("book_Fotor")
    .resizable()
    .scaledToFit()
    .frame(width: 70, height: 85)
    .scaleEffect(pressed ? 1.25 : 1.0)
    .onTapGesture {
        print("Tap") // <- 👈 Here is the Tap Action
    }
    .onLongPressGesture(
        minimumDuration: 2.5,
        maximumDistance: .infinity,
        pressing: { pressing in
            withAnimation(.easeIn(duration: 0.75)) {
                self.pressed = pressing
            }
        }
    ) {
        print("Long")
    }

Upvotes: 0

fuuki
fuuki

Reputation: 1

struct CustomButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .padding()
            .background(configuration.isPressed ? Color.blue : Color.green)
            .foregroundColor(.white)
            .cornerRadius(10)
    }
}

Button(action: {
    // Add your button action here
}) {
    Text("My Button")
}
.buttonStyle(CustomButtonStyle())

You can try writing your own style

Upvotes: 0

Related Questions