swap AnimatedContainer and AnimatedCrossFade

pull/118/head
John Ryan 6 years ago
parent 7a5b58b65c
commit bda1f83ca2

@ -34,31 +34,47 @@ class _ExpandCardState extends State<ExpandCard>
return GestureDetector( return GestureDetector(
onTap: () => toggleExpanded(), onTap: () => toggleExpanded(),
child: Card( child: Card(
child: AnimatedCrossFade( child: Padding(
alignment: Alignment.center, padding: const EdgeInsets.all(8.0),
duration: duration, child: AnimatedContainer(
crossFadeState:
expanded ? CrossFadeState.showSecond : CrossFadeState.showFirst,
firstChild: AnimatedContainer(
duration: duration, duration: duration,
width: size, width: size,
height: size, height: size,
child: Image.asset( child: AnimatedCrossFade(
duration: duration,
crossFadeState: expanded
? CrossFadeState.showSecond
: CrossFadeState.showFirst,
// Use Positioned.fill() to pass the constraints to its children.
// This allows the Images to use BoxFit.cover to cover the correct
// size
layoutBuilder: (Widget topChild, Key topChildKey,
Widget bottomChild, Key bottomChildKey) {
return Stack(
children: <Widget>[
Positioned.fill(
key: bottomChildKey,
child: bottomChild,
),
Positioned.fill(
key: topChildKey,
child: topChild,
),
],
);
},
firstChild: Image.asset(
'assets/cat.jpg', 'assets/cat.jpg',
fit: BoxFit.cover, fit: BoxFit.cover,
), ),
), secondChild: Image.asset(
secondChild: AnimatedContainer(
duration: duration,
width: size,
height: size,
child: Image.asset(
'assets/wolf.jpg', 'assets/wolf.jpg',
fit: BoxFit.cover, fit: BoxFit.cover,
), ),
), ),
), ),
), ),
),
); );
} }
} }

Loading…
Cancel
Save