flutter_common_widgets_softx 0.0.6

A modern Flutter UI toolkit by Ronak Softx — includes reusable, production-ready widgets like buttons, loaders, dividers, text fields, and snackbars to build stunning apps faster.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_common_widgets_softx/common/app_button.dart';
import 'package:flutter_common_widgets_softx/common/app_dashed_divider.dart';
import 'package:flutter_common_widgets_softx/common/app_divider.dart';
import 'package:flutter_common_widgets_softx/common/app_loader.dart';
import 'package:flutter_common_widgets_softx/common/app_outline_button.dart';
import 'package:flutter_common_widgets_softx/common/app_snackbar.dart';
import 'package:flutter_common_widgets_softx/common/app_text.dart';
import 'package:flutter_common_widgets_softx/common/app_textfield.dart';

void main() {
  runApp(const ExampleApp());
}

/// A minimal example application showcasing widgets from
/// the flutter_common_widgets_softx package.
class ExampleApp extends StatelessWidget {
  /// Creates the example app root widget.
  const ExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Common Widgets Example',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorSchemeSeed: Colors.blue,
        useMaterial3: true,
      ),
      home: const HomeScreen(),
    );
  }
}

/// The home screen displaying demos of common widgets.
class HomeScreen extends StatelessWidget {
  /// Creates the home screen for the example app.
  const HomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final controller = TextEditingController();

    return Scaffold(
      appBar: AppBar(
        title: const AppText(
          text: "Common Widgets Example",
          fontSize: 18,
          fontWeight: FontWeight.bold,
        ),
        centerTitle: true,
      ),
      body: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          const AppText(
            text: "✨ AppText Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          const AppText(
            text: "This is a custom text with Google Fonts support!",
            fontSize: 16,
            fontFamily: "Poppins",
          ),
          const SizedBox(height: 20),
          const AppDivider(thickness: 2, color: Colors.black12),
          const SizedBox(height: 20),
          const AppText(
            text: "🔥 AppButton Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          AppButton(
            text: const AppText(
              text: "Gradient Button",
              color: Colors.white,
              fontWeight: FontWeight.w600,
            ),
            gradient:
                const LinearGradient(colors: [Colors.purple, Colors.blue]),
            borderRadius: 30,
            onTap: () => appSnackBar(
              context: context,
              message: "Gradient button clicked!",
              icon: Icons.check_circle,
              backgroundColor: Colors.blueAccent,
            ),
          ),
          const SizedBox(height: 20),
          const AppText(
            text: "🔲 AppOutlineButton Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          AppOutlineButton(
            text: const AppText(
              text: "Outline Button",
              color: Colors.red,
              fontWeight: FontWeight.w600,
            ),
            borderColor: Colors.red,
            borderRadius: 12,
            suffixIcon: const Icon(Icons.logout, color: Colors.red),
            onTap: () => appSnackBar(
              context: context,
              message: "Outline button clicked!",
              icon: Icons.logout,
              backgroundColor: Colors.redAccent,
            ),
          ),
          const SizedBox(height: 20),
          const AppText(
            text: "🧾 AppTextField Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          AppTextField(
            controller: controller,
            hintText: "Enter your email",
            labelText: "Email Address",
            prefixIcon: const Icon(Icons.email),
            fillColor: Colors.white,
            focusedBorder: OutlineInputBorder(
              borderRadius: BorderRadius.circular(12),
              borderSide: const BorderSide(color: Colors.blueAccent, width: 1),
            ),
          ),
          const SizedBox(height: 20),
          const AppText(
            text: "⏳ AppLoader Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          const AppLoader(
            loaderType: LoaderType.ring,
          ),
          const SizedBox(height: 20),
          AppButton(
            text: const AppText(
              text: "Show Fullscreen Loader",
              color: Colors.white,
            ),
            color: Colors.indigo,
            onTap: () {
              final navigator = Navigator.of(context);
              showDialog(
                context: context,
                barrierDismissible: false,
                builder: (_) => const AppLoader(
                    fullScreen: true, loaderType: LoaderType.wave),
              );
              Future.delayed(const Duration(seconds: 2), () {
                if (navigator.mounted) {
                  navigator.pop();
                }
              });
            },
          ),
          const SizedBox(height: 20),
          const AppText(
            text: "〰️ AppDashedDivider Demo",
            fontSize: 20,
            fontWeight: FontWeight.bold,
            color: Colors.blueAccent,
          ),
          const SizedBox(height: 10),
          const AppDashedDivider(
            dashWidth: 8,
            dashSpace: 5,
            color: Colors.grey,
            thickness: 2,
          ),
        ],
      ),
    );
  }
}