All Projects → handoing → flutter_page_transition

handoing / flutter_page_transition

Licence: MIT License
A rich, convenient, easy-to-use flutter page transition package

Programming Languages

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

Projects that are alternatives of or similar to flutter page transition

Flutter-firestore-auth
Flutter mobile app with firestore authentication including Email and Social auth.
Stars: ✭ 95 (+72.73%)
Mutual labels:  flutter-package
custom timer
A Flutter package to create a customizable timer.
Stars: ✭ 25 (-54.55%)
Mutual labels:  flutter-package
uploadcare client
A flutter library for working with Uploadcare REST API. File uploads, media processing, and adaptive delivery for web and mobile.
Stars: ✭ 14 (-74.55%)
Mutual labels:  flutter-package
sliding clipped nav bar
Bottom navigation bar with sliding clip effect.
Stars: ✭ 46 (-16.36%)
Mutual labels:  flutter-package
flutter country picker
A flutter package to select a country from a list of countries.
Stars: ✭ 43 (-21.82%)
Mutual labels:  flutter-package
credit card validator
A Dart package that validates credit card numbers, expiration dates, and security codes (CVV/CVC) based on the type of credit card
Stars: ✭ 19 (-65.45%)
Mutual labels:  flutter-package
eva icons flutter
Flutter package for Eva Icons. Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items. https://pub.dartlang.org/packages/eva_icons_flutter
Stars: ✭ 80 (+45.45%)
Mutual labels:  flutter-package
editable
This library allows you to create editable tables and spreadsheets with ease, either by providing initial row and column count to display an empty table or use it with predefined rows and column data sets.
Stars: ✭ 85 (+54.55%)
Mutual labels:  flutter-package
flutter-bloc-patterns
A set of most common BLoC use cases built on top of flutter_bloc library
Stars: ✭ 58 (+5.45%)
Mutual labels:  flutter-package
Flutter-Apps
🌀 This is mainly focus on a complete application for production
Stars: ✭ 18 (-67.27%)
Mutual labels:  flutter-package
injector io
InjectorIO - Dependency Injection for Flutter
Stars: ✭ 73 (+32.73%)
Mutual labels:  flutter-package
getwidget-web-kit
Get Widget Web app Demo
Stars: ✭ 40 (-27.27%)
Mutual labels:  flutter-package
dart-package-analyzer
GitHub Action that uses the Dart Package Analyzer to compute the Pub score of Dart/Flutter packages
Stars: ✭ 44 (-20%)
Mutual labels:  flutter-package
glider
Server-side rendering for mobile apps, powered by Flutter
Stars: ✭ 20 (-63.64%)
Mutual labels:  flutter-package
flutter-docset
Community driven Flutter Docset for Dash.app
Stars: ✭ 56 (+1.82%)
Mutual labels:  flutter-package
time chart
A scrollable time chart in Flutter.
Stars: ✭ 21 (-61.82%)
Mutual labels:  flutter-package
nativeweb
Build your Own Plugin using (PlatformViews) Demo for Flutter Live 2018 Extended Event - Hyderabad
Stars: ✭ 26 (-52.73%)
Mutual labels:  flutter-package
qrcode
A flutter plugin for scanning QR codes. Use AVCaptureSession in iOS and zxing in Android.
Stars: ✭ 69 (+25.45%)
Mutual labels:  flutter-package
progressive image
A flutter widget that progressively loads large images using Low-Quality Image Placeholders.
Stars: ✭ 28 (-49.09%)
Mutual labels:  flutter-package
pmvvm
A clean & simple MVVM solution for state management using Provider package.
Stars: ✭ 33 (-40%)
Mutual labels:  flutter-package

flutter_page_transition

A rich, convenient, easy-to-use flutter page transition package.

Pub Version Language License: MIT

README in Chinese

Some Demos

Getting Started

Add this to your package's pubspec.yaml file:

dependencies:
  flutter_page_transition: ^0.1.0

You can also depend on this package stored in my repository:

flutter_page_transition:
  git:
    url: git://github.com/handoing/flutter_page_transition.git

You should then run flutter packages upgrade.

Transition Type

Page Transition Type Direction
slideInLeft ⬅️
slideInLeft ➡️
slideInUp ⬆️
slideInDown ⬇️
slideLeft ⬅️
slideRight ➡️
slideUp ⬆️
slideDown ⬇️
slideParallaxLeft ⬅️
slideParallaxRight ➡️
slideParallaxUp ⬆️
slideParallaxDown ⬇️
slideZoomLeft ⬅️
slideZoomRight ➡️
slideZoomUp ⬆️
slideZoomDown ⬇️
rippleRightUp ↖️
rippleLeftUp ↗️
rippleLeftDown ↘️
rippleRightDown ↙️
rippleMiddle 🎆
transferRight ⬅️
transferUp ⬆️
fadeIn
custom

Example

Use PageRouteBuilder Widget

initialRoute: 'Home',
onGenerateRoute: (RouteSettings routeSettings){
    return new PageRouteBuilder<dynamic>(
      settings: routeSettings,
      pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
        switch (routeSettings.name){
          case 'Home':
            return HomePage();
          case 'Other':
            return OtherPage();
          default:
            return null;
        }
      },
      transitionDuration: const Duration(milliseconds: 300),
      transitionsBuilder: (BuildContext context, Animation<double> animation,
          Animation<double> secondaryAnimation, Widget child) {
          return effectMap[PageTransitionType.slideInLeft](Curves.linear, animation, secondaryAnimation, child);
      }
    );
}

// use Navigator
Navigator.of(context).pushNamed('Other');
// or
Navigator.of(context).push(PageTransition(type: PageTransitionType.slideInLeft, child: FirstPage()));

Create custom methods:

transitionEffect.createCustomEffect(
  handle: (Curve curve, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
    return new SlideTransition(
      position: new Tween<Offset>(
        begin: const Offset(1.0, 0.0),
        end: const Offset(0.0, 0.0),
      ).animate(CurvedAnimation(parent: animation, curve: curve)),
      child: child,
    );
  }
);

// use custom
effectMap[PageTransitionType.custom](Curves.linear, animation, secondaryAnimation, child);

Test

run test

flutter test

Test Driver

run driver test

cd example/
flutter drive --target=test_driver/app.dart

License

MIT

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].