https://github.com/asif-faizal/pull-to-refresh-rive
This Flutter project demonstrates a custom pull-to-refresh animation using Rive and its state machines
https://github.com/asif-faizal/pull-to-refresh-rive
animation rive state-machines
Last synced: 7 months ago
JSON representation
This Flutter project demonstrates a custom pull-to-refresh animation using Rive and its state machines
- Host: GitHub
- URL: https://github.com/asif-faizal/pull-to-refresh-rive
- Owner: Asif-Faizal
- Created: 2024-07-13T07:46:11.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-25T05:36:49.000Z (10 months ago)
- Last Synced: 2025-01-21T18:19:01.341Z (9 months ago)
- Topics: animation, rive, state-machines
- Language: Dart
- Homepage:
- Size: 288 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Custom Pull-to-Refresh Animation with [Rive](https://rive.app/) in Flutter
https://github.com/user-attachments/assets/190afde9-f818-448a-b11a-8465376b1ff3
This Flutter project demonstrates a custom pull-to-refresh animation using Rive and its state machines to reflect different states during the pull-to-refresh process. The project integrates Rive's powerful animation capabilities to create a smooth and visually appealing refresh interaction.
## Features
Custom Pull-to-Refresh: The pull-to-refresh interaction is animated with a Rive animation.
State Machines: Rive state machines are used to reflect different states of the pull-to-refresh, such as "idle," "pulling," "refreshing," and "completed."
Smooth Integration: The Rive animation is smoothly integrated with Flutter's RefreshIndicator.
## Installation
### Clone this repository:
```bash
git clone https://github.com/Asif-Faizal/Rive-Pull_refresh.git
```
### Navigate to the project directory:
```bash
cd Pull-to-Refresh-Rive
```
Make sure you have an active Rive account and use their tools to design your pull-to-refresh animation. Export the .riv file and place it in the assets directory.
Add the Rive package to your pubspec.yaml:
```yaml
dependencies:
flutter:
sdk: flutter
rive: ^0.8.0
```
Update your pubspec.yaml to include the assets directory:
```yaml
flutter:
assets:
- assets/animations/pull_to_refresh.riv
```
### Install the dependencies:
```bash
flutter pub get
```