animated_flip_widget 0.0.1 copy "animated_flip_widget: ^0.0.1" to clipboard
animated_flip_widget: ^0.0.1 copied to clipboard

retracted

Animated Flip Card is a Flutter package for creating a flipping card animation with customizable front and back widgets, and various options for clickability, flip duration, and flip direction. It is [...]

example/lib/main.dart

import 'package:animated_flip_widget/animated_flip_widget/flip_controler.dart';
import 'package:animated_flip_widget/animated_flip_widget/flip_widget.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flip Widget',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final controller = FlipController();
  FlipDirection direction = FlipDirection.vertical;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Animated Flip Widget Demo')),
      body: Center(
        child: AnimatedFlipWidget(
          front: const _FrontWidget(),
          back: const _BackWidget(),
          flipDirection: direction,
          controller: controller,
        ),
      ),
      floatingActionButton: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          FloatingActionButton(
            onPressed: () {
              if (direction == FlipDirection.vertical) {
                setState(() {
                  direction = FlipDirection.horizontal;
                });
              }

              controller.flip();
            },
            tooltip: 'Flip',
            child: const Icon(Icons.flip_rounded),
          ),
          const SizedBox(
            width: 16,
          ),
          RotatedBox(
            quarterTurns: 1,
            child: FloatingActionButton(
              onPressed: () {
                if (direction == FlipDirection.horizontal) {
                  setState(() {
                    direction = FlipDirection.vertical;
                  });
                }

                controller.flip();
              },
              tooltip: 'Flip',
              child: const Icon(Icons.flip_rounded),
            ),
          ),
        ],
      ),
    );
  }
}

class _FrontWidget extends StatelessWidget {
  const _FrontWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 200,
      width: 200,
      color: Colors.grey,
      child: const Center(
        child: Text(
          '?',
          style: TextStyle(fontSize: 32),
        ),
      ),
    );
  }
}

class _BackWidget extends StatelessWidget {
  const _BackWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 200,
      width: 200,
      decoration: const BoxDecoration(
        image: DecorationImage(
          image: AssetImage('assets/dog.jpg'),
          fit: BoxFit.cover,
        ),
      ),
    );
  }
}
5
likes
0
pub points
85%
popularity

Publisher

verified publishertajaouart.com

Animated Flip Card is a Flutter package for creating a flipping card animation with customizable front and back widgets, and various options for clickability, flip duration, and flip direction. It is simple to use and can be easily integrated into any project.

Repository (GitHub)
View/report issues

License

unknown (license)

Dependencies

flutter

More

Packages that depend on animated_flip_widget