I want to lerp the elevation property for a Card
upon clicking and holding it on its InkWell
.
What I want to do is change its elevation from say 50
to 0
, lerping it and reducing the value gradually the longer the InkWell
is held, and when it is let go, it lerps back to 50
quickly.
How do I achieve this?
CodePudding user response:
Add a variable
double _updatedElevation = 50.0;
late Timer elevationTimer;
Then in inkwell add onTapDown and call startAnimatingElevation
startAnimatingElevation(){
_updatedElevation = 50;
elevationTimer = Timer.periodic(
const Duration(milliseconds: 1),
(timer) {
if(_updatedElevation > 0)
{
_updatedElevation--;
setState((){});
}
else{
timer.cancel();
}
},
);
}
assign _updatedElevation as the elevation of the card you wish to animate.
Then add onTapUp in inkwell and reset allvalues.
_updatedElevation = 50;
elevationTimer.cancel();