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

A comprehensive, theme-aware collection of production-ready, highly customizable Flutter UI widgets: buttons, text fields, dropdowns, dialogs, shimmer, loaders, empty/error states, cards, tiles, avata [...]

example/lib/main.dart

import 'package:flutter/material.dart';

import 'screens/buttons_example.dart';
import 'screens/inputs_example.dart';
import 'screens/dropdown_example.dart';
import 'screens/dialogs_example.dart';
import 'screens/loading_example.dart';
import 'screens/states_example.dart';
import 'screens/cards_example.dart';
import 'screens/images_example.dart';

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

/// Root of the example app. Notice that none of the CB widgets shown in
/// the demo screens hardcode any colors of their own — everything comes
/// from the [ThemeData] configured here. Toggle light/dark from the app
/// bar to see the widgets adapt automatically.
class CBExampleApp extends StatefulWidget {
  const CBExampleApp({super.key});

  @override
  State<CBExampleApp> createState() => _CBExampleAppState();
}

class _CBExampleAppState extends State<CBExampleApp> {
  ThemeMode _mode = ThemeMode.light;

  void _toggleTheme() {
    setState(() {
      _mode = _mode == ThemeMode.light ? ThemeMode.dark : ThemeMode.light;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'CrossBuild Custom Widgets',
      debugShowCheckedModeBanner: false,
      themeMode: _mode,
      theme: ThemeData(
        useMaterial3: true,
        colorSchemeSeed: Colors.indigo,
        brightness: Brightness.light,
      ),
      darkTheme: ThemeData(
        useMaterial3: true,
        colorSchemeSeed: Colors.indigo,
        brightness: Brightness.dark,
      ),
      home: HomeScreen(onToggleTheme: _toggleTheme, mode: _mode),
    );
  }
}

class HomeScreen extends StatelessWidget {
  const HomeScreen({super.key, required this.onToggleTheme, required this.mode});

  final VoidCallback onToggleTheme;
  final ThemeMode mode;

  @override
  Widget build(BuildContext context) {
    final destinations = <_Destination>[
      _Destination('Buttons', Icons.smart_button_outlined, const ButtonsExampleScreen()),
      _Destination('Inputs', Icons.text_fields_outlined, const InputsExampleScreen()),
      _Destination('Dropdown', Icons.arrow_drop_down_circle_outlined, const DropdownExampleScreen()),
      _Destination('Dialogs', Icons.chat_bubble_outline, const DialogsExampleScreen()),
      _Destination('Loading', Icons.hourglass_empty, const LoadingExampleScreen()),
      _Destination('States', Icons.inbox_outlined, const StatesExampleScreen()),
      _Destination('Cards & Tiles', Icons.dashboard_outlined, const CardsExampleScreen()),
      _Destination('Images & Avatars', Icons.image_outlined, const ImagesExampleScreen()),
    ];

    return Scaffold(
      appBar: AppBar(
        title: const Text('CrossBuild Custom Widgets'),
        actions: [
          IconButton(
            tooltip: 'Toggle theme',
            icon: Icon(mode == ThemeMode.light ? Icons.dark_mode_outlined : Icons.light_mode_outlined),
            onPressed: onToggleTheme,
          ),
        ],
      ),
      body: ListView.separated(
        padding: const EdgeInsets.all(16),
        itemCount: destinations.length,
        separatorBuilder: (_, __) => const SizedBox(height: 8),
        itemBuilder: (context, index) {
          final d = destinations[index];
          return Card(
            child: ListTile(
              leading: Icon(d.icon),
              title: Text(d.title),
              trailing: const Icon(Icons.chevron_right),
              onTap: () => Navigator.of(context).push(
                MaterialPageRoute(builder: (_) => d.screen),
              ),
            ),
          );
        },
      ),
    );
  }
}

class _Destination {
  _Destination(this.title, this.icon, this.screen);
  final String title;
  final IconData icon;
  final Widget screen;
}
4
likes
130
points
72
downloads

Documentation

Documentation
API reference

Publisher

unverified uploader

Weekly Downloads

A comprehensive, theme-aware collection of production-ready, highly customizable Flutter UI widgets: buttons, text fields, dropdowns, dialogs, shimmer, loaders, empty/error states, cards, tiles, avatars, snackbars and more.

Repository (GitHub)
View/report issues

Topics

#widget #ui #buttons #dropdown #theming

License

MIT (license)

Dependencies

cached_network_image, characters, flutter, shimmer

More

Packages that depend on crossbuild_custom_widgets