Animating Button Press

Question

Created Aug ’20

Replies 2

Boosts 0

Participants 2

Hello,
Sorry if this is a newbie question as I am only starting out with GUI's but I am trying to make a circle's border grow larger then shrink back down to its original size when pressed using .OnTapGesture.

I started out by using a state var "IsPressed" which when true would grow the border and when false would shrink to the original value, but Could only toggle the booleans value when pressed not make go to true, then a moment later go to false.

I have also tried setting the variable back to false using a single run timer but that did not work either and seems overly complicated for which I am sure there is a simple solution I am missing.

Any on how to mend this issue would be appreciated as I have been stuck for two days now.

Thanks!

Boost

Answer 1

BabyJ OP

Aug ’20

I have a solution for you.

Tapping the circle expands and shrinks the border.

Code Block Swiftstruct ContentView: View {
	@State private var isPressed = false
	var body: some View {
		Circle()
			.fill(Color.red)
			.overlay(Circle()
				.stroke(Color.black, lineWidth: isPressed ? 10 : 2))
			.onTapGesture {
				withAnimation {
					isPressed.toggle()
				}
			}    
	}
}

0

Answer 2

MarshallSEcond OP

Aug ’20

I am sorry for the very late response. But wouldnt this just cause it to grow or shrink on each button press not grow then shrink. I realize the wording is weird, but I am essentially looking for a swell up of the border then for it to go back to original size all on one press.

0