Merge pull request #56 from Delgan/GH-24-add-constructor-side-face

BrunoJurkovic · Feb 7, 2022 · c82938e · c82938e
2 parents d53caa0 + 32807a3
commit c82938e
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 7 deletions.
diff --git a/README.md b/README.md
@@ -20,12 +20,13 @@ Create a flip card. The card will flip when touched
 FlipCard(
   fill: Fill.fillBack, // Fill the back side of the card to make in the same size as the front.
   direction: FlipDirection.HORIZONTAL, // default
+  side: CardSide.FRONT, // The side to initially display.
   front: Container(
-        child: Text('Front'),
-    ),
-    back: Container(
-        child: Text('Back'),
-    ),
+    child: Text('Front'),
+  ),
+  back: Container(
+    child: Text('Back'),
+  ),
 );
 ```
 

diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -41,6 +41,7 @@ class HomePage extends StatelessWidget {
       color: Color(0x00000000),
       child: FlipCard(
         direction: FlipDirection.HORIZONTAL,
+        side: CardSide.FRONT,
         speed: 1000,
         onFlipDone: (status) {
           print(status);

diff --git a/lib/flip_card.dart b/lib/flip_card.dart
@@ -9,6 +9,11 @@ enum FlipDirection {
   HORIZONTAL,
 }
 
+enum CardSide {
+  FRONT,
+  BACK,
+}
+
 enum Fill { none, fillFront, fillBack }
 
 class AnimationCard extends StatelessWidget {
@@ -54,6 +59,7 @@ class FlipCard extends StatefulWidget {
   final BoolCallback? onFlipDone;
   final FlipCardController? controller;
   final Fill fill;
+  final CardSide side;
 
   /// When enabled, the card will flip automatically when touched. This behavior
   /// can be disabled if this is not desired. To manually flip a card from your
@@ -94,26 +100,31 @@ class FlipCard extends StatefulWidget {
     this.flipOnTouch = true,
     this.alignment = Alignment.center,
     this.fill = Fill.none,
+    this.side = CardSide.FRONT,
   }) : super(key: key);
 
   @override
   State<StatefulWidget> createState() {
-    return FlipCardState();
+    return FlipCardState(this.side == CardSide.FRONT);
   }
 }
 
 class FlipCardState extends State<FlipCard>
     with SingleTickerProviderStateMixin {
+
   AnimationController? controller;
   Animation<double>? _frontRotation;
   Animation<double>? _backRotation;
 
-  bool isFront = true;
+  bool isFront;
+
+  FlipCardState(this.isFront);
 
   @override
   void initState() {
     super.initState();
     controller = AnimationController(
+        value: isFront ? 0.0 : 1.0,
         duration: Duration(milliseconds: widget.speed), vsync: this);
     _frontRotation = TweenSequence(
       [

diff --git a/test/widget_test.dart b/test/widget_test.dart
@@ -53,6 +53,27 @@ void main() {
     expect(backgroundTouched, false);
   });
 
+  testWidgets('card initialized with back side', (WidgetTester tester) async {
+     await tester.pumpWidget(
+        Directionality(
+          textDirection: TextDirection.ltr,
+          child: new FlipCard(
+            front: Text('front'),
+            back: Text('back'),
+            side: CardSide.BACK,
+          ),
+        ),
+      );
+      final state = tester.state<FlipCardState>(find.byType(FlipCard));
+
+      expect(state.isFront, isFalse);
+
+      await tester.tap(find.byType(FlipCard));
+      await tester.pumpAndSettle();
+
+      expect(state.isFront, isTrue);
+  });
+
   group('cards flip', () {
     testWidgets('automatically', (WidgetTester tester) async {
       await tester.pumpWidget(