KrButton

KrButton is a Flutter package that provides custom TextButton and InkWell widgets with a built-in loading animation that is displayed while waiting for the onPressed function to complete. The buttons can be used just like regular TextButtons and InkWell widgets.

Usage

To use KrButton, simply replace your existing TextButton or InkWell with KrTextButton or KrInkWell, respectively. Here's an example:

import 'package:flutter/material.dart';
import 'package:kr_button/kr_button.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return KrTextButton(
      onPressed: () async {
        // Perform some time-consuming operation
      },
      child: Text('My Button'),
      onLoading: CircularProgressIndicator(),
      onError: Icon(Icons.error),
      style: TextButton.styleFrom(
        backgroundColor: Colors.blue,
        primary: Colors.white,
      ),
    );
  }
}

Features

KrButton provides the following features:

  • Built-in loading animation
  • Customizable loading and error widgets
  • Ability to customize the button style using the ButtonStyle parameter
  • Ability to customize the FocusNode using the focusNode parameter
  • KrButtonController class to manually control the state of the button

KrButtonController

KrButtonController is a class that can be used to manually control the state of a KrButton. To use KrButtonController, simply create an instance of it and pass it to the controller parameter of KrTextButton or KrInkWell. Here's an example:

import 'package:flutter/material.dart';
import 'package:kr_button/kr_button.dart';

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  final controller = KrButtonController();

  @override
  Widget build(BuildContext context) {
    return KrTextButton(
      controller: controller,
      onPressed: () async {
        // Perform some time-consuming operation
      },
      child: Text('My Button'),
      onLoading: CircularProgressIndicator(),
      onError: Icon(Icons.error),
      style: TextButton.styleFrom(
        backgroundColor: Colors.blue,
        primary: Colors.white,
      ),
    );
  }
}

You can then manually control the state of the button using the methods of the KrButtonController class:

// Start loading animation
controller.loading();

// Show error icon
controller.error();

// Show success icon
controller.success();

License

This package is released under the MIT License. See LICENSE for details.