animal_crossing_ui 0.4.1

Flutter UI library inspired by Animal Crossing with 60+ widgets, 16+ themes, and flat design without Material/Cupertino dependencies.

example/lib/main.dart

import 'package:flutter/widgets.dart';
import 'package:animal_crossing_ui/animal_crossing_ui.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return ACUIApp(
      title: 'Animal Crossing UI Example',
      theme: ACUIThemePresets.isabelle(),
      darkTheme: ACUIThemePresets.isabelle(dark: true),
      home: const HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  bool _checkboxValue = false;
  bool _switchValue = true;
  double _sliderValue = 0.5;

  @override
  Widget build(BuildContext context) {
    final theme = ACUITheme.of(context);

    return Container(
      color: theme.backgroundColor,
      child: Column(
        children: [
          ACUIAppBar(
            title: const Text('Animal Crossing UI Example'),
            backgroundColor: theme.primaryColor,
          ),
          Expanded(
            child: SingleChildScrollView(
              padding: const EdgeInsets.all(16),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  // Buttons Section
                  Text(
                    'Buttons',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  ACUIButton(
                    onPressed: () {},
                    child: const Text('Primary Button'),
                  ),
                  const SizedBox(height: 8),
                  ACUIButton(
                    variant: ACUIButtonVariant.secondary,
                    onPressed: () {},
                    child: const Text('Secondary Button'),
                  ),
                  const SizedBox(height: 8),
                  ACUIButton(
                    variant: ACUIButtonVariant.text,
                    onPressed: () {},
                    child: const Text('Text Button'),
                  ),
                  const SizedBox(height: 24),

                  // Form Controls Section
                  Text(
                    'Form Controls',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  const ACUITextField(placeholder: 'Enter your island name...'),
                  const SizedBox(height: 12),
                  Row(
                    children: [
                      ACUICheckbox(
                        value: _checkboxValue,
                        onChanged: (value) =>
                            setState(() => _checkboxValue = value),
                      ),
                      const SizedBox(width: 8),
                      Text(
                        'Enable notifications',
                        style: TextStyle(color: theme.textColor),
                      ),
                    ],
                  ),
                  const SizedBox(height: 12),
                  Row(
                    children: [
                      ACUISwitch(
                        value: _switchValue,
                        onChanged: (value) =>
                            setState(() => _switchValue = value),
                      ),
                      const SizedBox(width: 8),
                      Text(
                        'Dark mode',
                        style: TextStyle(color: theme.textColor),
                      ),
                    ],
                  ),
                  const SizedBox(height: 12),
                  ACUISlider(
                    value: _sliderValue,
                    onChanged: (value) => setState(() => _sliderValue = value),
                  ),
                  const SizedBox(height: 24),

                  // Cards Section
                  Text(
                    'Cards',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  ACUICard(
                    child: Padding(
                      padding: const EdgeInsets.all(16),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            'Welcome to your island!',
                            style: ACUITextStyles.headlineSmall.copyWith(
                              color: theme.textColor,
                            ),
                          ),
                          const SizedBox(height: 8),
                          Text(
                            'Start your adventure today.',
                            style: TextStyle(color: theme.textSecondaryColor),
                          ),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 24),

                  // Progress Section
                  Text(
                    'Progress Indicators',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  ACUILinearProgress(
                    value: 0.7,
                    backgroundColor: theme.surfaceColor,
                    color: theme.primaryColor,
                  ),
                  const SizedBox(height: 12),
                  Center(
                    child: ACUIProgressIndicator(
                      size: 40,
                      color: theme.primaryColor,
                    ),
                  ),
                  const SizedBox(height: 24),

                  // List Tile Section
                  Text(
                    'List Tiles',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  ACUIListTile(
                    leading: ACUIAvatar(
                      backgroundColor: theme.primaryColor,
                      child: Text(
                        'T',
                        style: TextStyle(color: theme.surfaceColor),
                      ),
                    ),
                    title: Text(
                      'Tom Nook',
                      style: TextStyle(color: theme.textColor),
                    ),
                    subtitle: Text(
                      'Shop Owner',
                      style: TextStyle(color: theme.textSecondaryColor),
                    ),
                  ),
                  const SizedBox(height: 24),

                  // Chips Section
                  Text(
                    'Chips',
                    style: ACUITextStyles.headlineMedium.copyWith(
                      color: theme.textColor,
                    ),
                  ),
                  const SizedBox(height: 8),
                  Wrap(
                    spacing: 8,
                    runSpacing: 8,
                    children: [
                      ACUIChip(
                        label: Text(
                          'Furniture',
                          style: TextStyle(color: theme.surfaceColor),
                        ),
                        backgroundColor: theme.primaryColor,
                      ),
                      ACUIChip(
                        label: Text(
                          'Tools',
                          style: TextStyle(color: theme.surfaceColor),
                        ),
                        backgroundColor: theme.secondaryColor,
                      ),
                      ACUIChip(
                        label: Text(
                          'Fish',
                          style: TextStyle(color: theme.textColor),
                        ),
                        backgroundColor: theme.surfaceColor,
                        onDeleted: () {},
                      ),
                    ],
                  ),
                  const SizedBox(height: 40),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}