Circular Loading Button: Enhancing Your Flutter App with Animated Progress Indicators

I’m excited to introduce a solution for creating interactive and visually appealing loading buttons in Flutter. This package leverages native Flutter buttons to provide customizable, animated progress indicators.

Key Features

• Native Button Integration: Supports various button types (ElevatedButton, FilledButton, OutlinedButton), ensuring seamless integration with your app’s theme.
• State Management: Easily manage button states (idle, loading) with simple state changes.
• Customizable Sizes: Define button sizes for both loading and idle states using expandedSize and loadingSize parameters.

Code Example

Here’s a basic example to demonstrate how to use the Circular Loading Button:

// Set initial button state
LoadingButtonState _currentState = LoadingButtonState.idle;

LoadingButton(
  type: LoadingButtonType.elevated,
  state: _currentState,
  onPressed: () {
    // Change button state to loading
    setState(() => _currentState = LoadingButtonState.loading);

    // Wait 3 seconds and reset to idle
    Future.delayed(const Duration(seconds: 3), () => setState(() => _currentState = LoadingButtonState.idle));
  },
  child: const Text('Tap me!')
)

Why Use Circular Loading Button?

The Circular Loading Button package simplifies the creation of interactive loading indicators, enhancing user experience by providing clear feedback during asynchronous operations. Its integration with native buttons ensures consistent theming and easy customization.

Conclusion

I invite Flutter developers to explore the Circular Loading Button package and contribute to its development. Your feedback and contributions are invaluable in refining this tool.

To get started, visit the Circular Loading Button package page. I hope this package proves as useful to you as it has in my projects.

Thank you for your support and happy coding!