better_skeleton 0.0.1
better_skeleton: ^0.0.1 copied to clipboard

A new flutter plugin project.

Glass effect - for your skeleton loading #

Show a glass effect using a single AnimationController over a list of Widgets.



Apparence.io logo

Developed with 💙  by Apparence.io

Apparence.io better skeleton plugin gif

Tldr - features? #

  • Show a glass effect using a single AnimationController over a list of Widgets

Getting Started #

Create an animation controller in repeat mode then just provide this controller to every AnimatedSkeleton. This effect is made using a custom RenderWidget.

Example of using:

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
  late final AnimationController animationController;

  @override
  void initState() {
    super.initState();
    animationController = AnimationController(vsync: this, duration: Duration(milliseconds: 1000))..repeat();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          children: [
            SizedBox(height: 100),
            AnimatedSkeleton(
              listenable: animationController,
              child: FakeCard(),
            ),
            AnimatedSkeleton(
              listenable: animationController,
              child: FakeCard(),
            ),
            AnimatedSkeleton(
              listenable: animationController,
              child: FakeCard2(),
            ),
          ],
        ),
      ),
    );
  }
}

Note: FakeCard is a container widget we made with just a grey background. See example.

5
likes
90
pub points
28%
popularity

Publisher

apparence.io

A new flutter plugin project.

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter, vector_math

More

Packages that depend on better_skeleton