Search packages, repositories and app categories

GitHub repositoryAndresR173/loading_transition_button

loading_transition_button

Animated transition button

loading_transition_button project cover
Stars
5
Forks
0
Last push (UTC)
May 16, 2021
Project status
Active

Original README

English project snapshot. Visit GitHub for the latest content.

Loading Transition button

A Customizable transition button for Flutter

Getting Started

To use this package, add loading_transition_button as a dependency in your pubspec.yaml file.

dependencies:
 ...
 loading_transition_button: ^0.0.1

How to use

In your project add the following import:

import  'package:loading_transition_button/loading_transition_button.dart';

In order to use this widget you have to use a LoadingButtonController to handler the different states.

final _controller = LoadingButtonController();

This widget starts a loading animation once it's tapped or by using the controller. You can the launcher to init an error animation or stop the loading animation.

LoadingButton(
    color: Colors.blue,
    onSubmit: () => print('onSubmit'),
    controller: _controller,
    errorColor: Colors.red,
    transitionDuration: Duration(seconds: 1),
    child: Text(
    'Hit me!',
    style: Theme.of(context)
        .textTheme
        .bodyText1!
        .copyWith(color: Colors.white),
    ),
),

To support the transition to a different page to have to call the moveToScreen method

_controller.moveToScreen(
    context: context,
    page: SearchPage(),
    stopAnimation: true,
    navigationCallback: (route) =>
        Navigator.of(context).push(route),
),

navigationCallback will send you a new route that you can use for different navigation method like push or replace.

LoadingTransitionButton

AnimatedButton

Andres Rojas GitHub avatar
GitHub author

Andres Rojas ↗

iOS developer, Open Source lover

Medellín, ColombiaOfficial website ↗
LanguagesDartSwiftKotlinObjective-C

Packages published by this repository

Dependencies used

Dependency list 4 items

  • flutter{"sdk":"flutter"}
  • vector_math^2.1.0
  • flutter_testDevelopment{"sdk":"flutter"}
  • lintDevelopment^1.3.1

How do I choose a repository?

Start with your use case, compare repository activity, and check the original project before adopting it.

  1. Search by repository name, owner or description, then narrow the results by topic.
  2. Compare stars, forks and recent pushes. Stars show community interest, not a guarantee of quality.
  3. Read the README, license and issues on GitHub before using a project.

Sources and maintenance

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗