All Projects → maddyb99 → shimmer_animation

maddyb99 / shimmer_animation

Licence: MIT license
This shimmer animation widget can help you bring simple yet beautiful skeleton loaders to your flutter app with ease.

Programming Languages

dart
5743 projects
objective c
16641 projects - #2 most used programming language
HTML
75241 projects
java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to shimmer animation

sliding panel
A Flutter slidable widget that provides an easy to use configuration. Highly customisable. Just as you want it!
Stars: ✭ 88 (+203.45%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package, flutter-packages
Motion-Tab-Bar
A beautiful animated flutter widget package library. The tab bar will attempt to use your current theme out of the box, however you may want to theme it.
Stars: ✭ 237 (+717.24%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
flex color scheme
A Flutter package to make and use beautiful color scheme based themes.
Stars: ✭ 370 (+1175.86%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
liquid button
Liquify your buttons, web demo at website
Stars: ✭ 18 (-37.93%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
buttons tabbar
A Flutter package that implements a TabBar where each label is a toggle button.
Stars: ✭ 49 (+68.97%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
dough
This package provides some widgets you can use to create a smooshy UI.
Stars: ✭ 518 (+1686.21%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
getwidget-docs
Get Widgets UI library docs.
Stars: ✭ 17 (-41.38%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
flutter-app
Full Feature Todos Flutter Mobile app with fireStore integration.
Stars: ✭ 138 (+375.86%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
overflow view
A widget displaying children in a line until there is not enough space and showing a the number of children not rendered.
Stars: ✭ 136 (+368.97%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
flutter sliding tutorial
User onboarding library with smooth animation of objects and background colors
Stars: ✭ 127 (+337.93%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
rainbow container
🌈 A magical container which changes colors whenever its build method is called.
Stars: ✭ 21 (-27.59%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
survey kit
Flutter library to create beautiful surveys (aligned with ResearchKit on iOS)
Stars: ✭ 68 (+134.48%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
Interactive-Add-Button-Layout
Custom Layout with interactive add button to impove your UI and UX .
Stars: ✭ 20 (-31.03%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
FlutterLoadingGIFs
Loading indicator GIFs. Material and Cupertino (Android and iOS) loading indicators in assorted sizes. Use as placeholders for loading remote image assets. Demo: https://gallery.codelessly.com/flutterwebsites/loadinggifs/
Stars: ✭ 28 (-3.45%)
Mutual labels:  flutter-widget, flutter-ui, flutter-package
flutter paging
A small library support load infinite for ListView - GridView on Flutter.
Stars: ✭ 32 (+10.34%)
Mutual labels:  flutter-ui, flutter-package, flutter-packages
seo renderer
A Flutter Web Plugin to display Text Widget as Html for SEO purpose
Stars: ✭ 103 (+255.17%)
Mutual labels:  flutter-widget, flutter-package
barcode.flutter
barcode generate library for Flutter
Stars: ✭ 58 (+100%)
Mutual labels:  flutter-widget, flutter-package
custom radio grouped button
Custom Flutter widgets that makes Checkbox and Radio Buttons much cleaner and easier.
Stars: ✭ 144 (+396.55%)
Mutual labels:  flutter-widget, flutter-ui
flutter scatter
A widget that displays a collection of dispersed and non-overlapping children
Stars: ✭ 85 (+193.1%)
Mutual labels:  flutter-widget, flutter-package
incrementally loading listview
An extension of the Flutter ListView widget for incrementally loading items upon scrolling
Stars: ✭ 172 (+493.1%)
Mutual labels:  flutter-widget, flutter-package

Shimmer Animation

pub package Libraries.io dependency status for latest release License

Supports Null Safety

This shimmer animation widget can help you bring simple yet beautiful skeleton loaders to your project with ease.

Shimmer is very widely used as the default animation for skeleton loaders or placeholder widgets throughout the development community. Therefore, having an easy to use, yet customizable widget ready to use for Android, iOS and Web, gives developers an advantage to focus on their actual functionality, let shimmer make the loading experience smoother.

Examples

An example can be found in the example directory of this repository.

A list of detailed examples can be found in this Examples Repository

Full Screen Loading Widgets Loading Buttons

How to use

Add shimmer_animation to pubspec.yaml of your project:

dependencies:
  shimmer_animation: ^2.1.0

Import it in your Dart code:

import 'package:shimmer_animation/shimmer_animation.dart';

Wrap any widget with Shimmer() widget to apply animaton:

  Shimmer(
    child: Container(
      color: Colors.deepPurple,
    ),
  ),

A number of parameters can be passed to customise the look and feel of this animation:

  Shimmer(
    duration: Duration(seconds: 3), //Default value
    interval: Duration(seconds: 5), //Default value: Duration(seconds: 0)
    color: Colors.white, //Default value
    colorOpacity: 0, //Default value
    enabled: true, //Default value
    direction: ShimmerDirection.fromLTRB(),  //Default Value
    child: Container(
      color: Colors.deepPurple,
    ),
  ),

Parameters:

  • @required child : accepts a child Widget over which the animation is to be displayed
  • color : accepts a parameter of type Color and sets the color of the animation overlay. Default value is Colors.white
  • color : accepts a parameter of type double and sets the Opacity of the color of the animation overlay. Default value is 0.3
  • enabled : accepts a bool which toggles the animation on/off. Default value is true
  • duration : accepts a Duration that would be the time period of animation. Default value is Duration(seconds: 3)
  • interval : accepts a Duration that would be the interval between the repeating animation. Default value is Duration(seconds: 0) i.e. no interval
  • direction : accepts a ShimmerDirection and aligns the animation accordingly. Default value is ShimmerDirection.fromLBRT()

A detailed API Reference can be found here.

License

MIT License.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].