leoncolt / gradient_loading_button

Loading Button

A simple button that gives you the possibility to transform into a circular one and shows a progress indicator and with success and error state.

How to use

Container(
  width: 200,
  height: 60,
  child: LoadingButton(
    gradient: new LinearGradient(
      colors: <Color>[
        Colors.red,
        Colors.blue,
      ]
    ),
    style: new ButtonStyle(
      shape: MaterialStateProperty.all(new RoundedRectangleBorder(
        borderRadius:
            const BorderRadius.all(const Radius.circular(15.0)),
      )),
    ),
    strokeWidth: 2,
    child: Text(
      "Sample",
      style: TextStyle(
        color: Colors.white,
        fontSize: 24,
      ),
    ),
    errorChild: const Icon( Icons.close_sharp, color: Colors.white, ),
    successChild: const Icon( Icons.check_sharp, color: Colors.white, ),
    onPressed: ( controller ) async {
      await controller.loading();
      await new Future.delayed( const Duration( seconds: 3 ) );
      if ( Random.secure().nextBool() )
        await controller.success();
      else await controller.error();
    },
  ),
),

Please check the example folder for a simple implementation.

Changelog

Please see the Changelog page to know what's recently changed.

Contributions

Feel free to contribute to this project.

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue. If you fixed a bug or implemented a new feature, please send a pull request.

License

This project is licensed under the MIT License - see the LICENSE.md file for details