Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jogboms/flutter_spinkit
✨ A collection of loading indicators animated with flutter. Heavily Inspired by http://tobiasahlin.com/spinkit.
https://github.com/jogboms/flutter_spinkit
android animation animation-library dart dartlang flutter flutter-plugin ios loaders loading loading-animations spinkit
Last synced: 6 days ago
JSON representation
✨ A collection of loading indicators animated with flutter. Heavily Inspired by http://tobiasahlin.com/spinkit.
- Host: GitHub
- URL: https://github.com/jogboms/flutter_spinkit
- Owner: jogboms
- License: mit
- Created: 2018-06-25T09:30:45.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-06-09T06:27:43.000Z (5 months ago)
- Last Synced: 2024-10-13T23:43:48.567Z (21 days ago)
- Topics: android, animation, animation-library, dart, dartlang, flutter, flutter-plugin, ios, loaders, loading, loading-animations, spinkit
- Language: Dart
- Homepage:
- Size: 3.03 MB
- Stars: 3,001
- Watchers: 33
- Forks: 305
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-loading-indicators - Flutter Spinkit - A collection of loading indicators animated with flutter. (Dart)
- awesome-coding - flutter_spinkit
README
# ✨ Flutter Spinkit
[](https://github.com/jogboms/flutter_spinkit/actions/workflows/main.yml) [](https://codecov.io/gh/jogboms/flutter_spinkit) [](https://pub.dartlang.org/packages/flutter_spinkit)
A collection of loading indicators animated with flutter. Heavily inspired by [@tobiasahlin](https://github.com/tobiasahlin)'s [SpinKit](https://github.com/tobiasahlin/SpinKit).
## 🎖 Installing
```yaml
dependencies:
flutter_spinkit: ^5.2.1
```
### ⚡️ Import
```dart
import 'package:flutter_spinkit/flutter_spinkit.dart';
```
## 🎮 How To Use
```dart
const spinkit = SpinKitRotatingCircle(
color: Colors.white,
size: 50.0,
);
```
```dart
final spinkit = SpinKitFadingCircle(
itemBuilder: (BuildContext context, int index) {
return DecoratedBox(
decoration: BoxDecoration(
color: index.isEven ? Colors.red : Colors.green,
),
);
},
);
```
```dart
final spinkit = SpinKitSquareCircle(
color: Colors.white,
size: 50.0,
controller: AnimationController(vsync: this, duration: const Duration(milliseconds: 1200)),
);
```
For more info, please, refer to the `showcase.dart` in the example.
## 🚀 Showcase
RotatingPlain
DoubleBounce
Wave
WanderingCubes
FadingFour
FadingCube
Pulse
ChasingDots
ThreeBounce
Circle
CubeGrid
FadingCircle
RotatingCircle
FoldingCube
PumpingHeart
HourGlass
PouringHourGlass
PouringHourGlassRefined
FadingGrid
Ring
Ripple
SpinningCircle
SpinningLines
SquareCircle
DualRing
PianoWave
DancingSquare
ThreeInOut
WaveSpinner
PulsingGrid
> Some GIF images gotten from [Android Spinkit](https://github.com/ybq/Android-SpinKit).
## 🐛 Bugs/Requests
If you encounter any problems feel free to open an issue. If you feel the library is
missing a feature, please raise a ticket on Github and I'll look into it.
Pull request are also welcome.
### ❗️ Note
For help getting started with Flutter, view our online
[documentation](https://flutter.io/).
For help on editing plugin code, view the [documentation](https://flutter.io/platform-plugins/#edit-code).
## ☀️ Authors
## ⭐️ License
MIT License