class SlidingCard extends StatelessWidget { | |
final double offset; | |
@override | |
Widget build(BuildContext context) { | |
double gauss = math.exp(-(math.pow((offset.abs() - 0.5), 2) / 0.08)); //<--caluclate Gaussian function | |
return Transform.translate( | |
offset: Offset(-32 * gauss * offset.sign, 0), //<-- Translate the cards to make space between them | |
... | |
child: CardContent( | |
name: name, | |
date: date, | |
offset: gauss, //<-- Pass the gauss as offset | |
), | |
... | |
); | |
} | |
} | |
class CardContent extends StatelessWidget { | |
final double offset; //<-- add the offset | |
... | |
@override | |
Widget build(BuildContext context) { | |
return Padding( | |
padding: const EdgeInsets.all(8.0), | |
child: Column( | |
crossAxisAlignment: CrossAxisAlignment.start, | |
children: <Widget>[ | |
Transform.translate( | |
offset: Offset(8 * offset, 0), //<-- translate the name label | |
child: Text(name, style: TextStyle(fontSize: 20)), | |
), | |
SizedBox(height: 8), | |
Transform.translate( | |
offset: Offset(32 * offset, 0), //<-- translate the name label | |
child: Text( | |
date, | |
style: TextStyle(color: Colors.grey), | |
), | |
), | |
Spacer(), | |
Row( | |
children: <Widget>[ | |
Transform.translate( | |
offset: Offset(48 * offset, 0), //<-- translate the button | |
child: RaisedButton( | |
color: Color(0xFF162A49), | |
child: Transform.translate( | |
offset: Offset(24 * offset, 0), //<-- and even the text in the button! | |
child: Text('Reserve'), | |
), | |
... | |
), | |
), | |
Spacer(), | |
Transform.translate( | |
offset: Offset(32 * offset, 0), //<-- translate the price label | |
child: Text( | |
'0.00 \$', | |
style: TextStyle( | |
fontWeight: FontWeight.bold, | |
fontSize: 20, | |
), | |
), | |
), | |
SizedBox(width: 16), | |
], | |
) | |
], | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment