nice_loading_button 0.0.1 copy "nice_loading_button: ^0.0.1" to clipboard
nice_loading_button: ^0.0.1 copied to clipboard

An animated loading button package that allows you to create beautiful loadding button with lots of customized properties.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:nice_loading_button/nice_loading_button.dart';

void main() {
  runApp(
    const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        alignment: Alignment.center,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // Nice Loading Button with CircularProgress widget
            LoadingButton(
              height: 50,
              borderRadius: 8,
              animate: true,
              color: Colors.indigo,
              width: MediaQuery.of(context).size.width * 0.44,
              loader: Container(
                padding: const EdgeInsets.all(10),
                width: 40,
                height: 40,
                child: const CircularProgressIndicator(
                  valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
                ),
              ),
              child: const Text("Login"),
              onTap: (startLoading, stopLoading, buttonState) async {
                if (buttonState == ButtonState.idle) {
                  startLoading();
                  // Do something here
                  await Future.delayed(const Duration(seconds: 5));
                  stopLoading();
                }
              },
            ),
            const SizedBox(height: 50),
            // Nice Loading Button with custom Text
            LoadingButton(
              height: 50,
              borderRadius: 8,
              roundLoadingShape: false,
              color: Colors.red,
              width: MediaQuery.of(context).size.width * 0.44,
              minWidth: MediaQuery.of(context).size.width * 0.29,
              loader: const Text("Logging in..."),
              child: const Text("Login"),
              onTap: (startLoading, stopLoading, buttonState) async {
                if (buttonState == ButtonState.idle) {
                  startLoading();
                  // Do something here
                  await Future.delayed(const Duration(seconds: 5));
                  stopLoading();
                }
              },
            ),
            const SizedBox(height: 50),
            // Nice Loading Button with Custom Loading
            LoadingButton(
              height: 50,
              borderRadius: 8,
              animate: true,
              color: Colors.cyan,
              width: MediaQuery.of(context).size.width * 0.44,
              loader: Container(
                padding: const EdgeInsets.all(10),
                child: const Center(
                  child: SpinKitDoubleBounce(
                    color: Colors.white,
                  ),
                ),
              ),
              child: const Text("Login"),
              onTap: (startLoading, stopLoading, buttonState) async {
                if (buttonState == ButtonState.idle) {
                  startLoading();
                  // Do something here
                  await Future.delayed(const Duration(seconds: 5));
                  stopLoading();
                }
              },
            ),
          ],
        ),
      ),
    );
  }
}
4
likes
110
pub points
41%
popularity

Publisher

verified publishernimusoftlabs.com

An animated loading button package that allows you to create beautiful loadding button with lots of customized properties.

Homepage

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on nice_loading_button