leo_easy_ui_kit 0.7.10

Leo Easy UI Kit: effortless yet powerful Flutter UI components.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:leo_easy_ui_kit/leo_easy_ui_kit.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Leo Easy UI Kit Demo',
      theme: ThemeData(useMaterial3: true, colorSchemeSeed: Colors.blue),
      home: const ExampleHomePage(),
    );
  }
}

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

  @override
  State<ExampleHomePage> createState() => _ExampleHomePageState();
}

class _ExampleHomePageState extends State<ExampleHomePage> {
  final roles = const ['Student', 'Teacher', 'Admin'];
  String? role = 'Student';

  final interests = const ['Math', 'Science', 'English', 'Programming'];
  List<String> selectedInterests = const [];

  String? level = 'Beginner';
  int? age = 18;

  final searchController = SearchRecommendationController<String>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Leo Easy UI Kit example')),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text('Dropdown', style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            easyDropdownOf<String>(
              items: roles,
              value: role,
              onChanged: (value) => setState(() => role = value),
            ),
            const SizedBox(height: 24),
            Text('Checkbox (multi-select)',
                style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            easyCheckboxOf<String>(
              items: interests,
              values: selectedInterests,
              onChangedMany: (values) =>
                  setState(() => selectedInterests = values),
              multiSelect: true,
            ),
            const SizedBox(height: 24),
            Text('Button group',
                style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            easyButtonGroupOf<String>(
              items: const ['Beginner', 'Intermediate', 'Advanced'],
              value: level,
              onChanged: (value) => setState(() => level = value),
            ),
            const SizedBox(height: 24),
            Text('Text field',
                style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            easyTextFieldOf<int>(
              value: age,
              onChanged: (value) => setState(() => age = value),
              hintText: 'Age',
              keyboardType: TextInputType.number,
              parser: (text) => int.tryParse(text),
            ),
            const SizedBox(height: 24),
            const SizedBox(height: 24),
            Text('Search', style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            easySearchOf<String>(
              items: const ['Alice', 'Bob', 'Charlie', 'Dave', 'Eve'],
              label: (v) => v,
              onSelected: (value) {
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text('Selected: $value')),
                );
              },
            ),
            const SizedBox(height: 24),
            Text('Multi-Select Sheet', style: Theme.of(context).textTheme.titleLarge),
            const SizedBox(height: 8),
            ElevatedButton(
              onPressed: () {
                EasySearchMultiSelectSheet.show(
                  context: context,
                  title: 'Select Fruits',
                  items: const ['Apple', 'Banana', 'Cherry', 'Date', 'Elderberry', 'Fig', 'Grape'],
                  initialSelectedItems: const [],
                  getSearchText: (item) => item,
                  recommendationBuilder: (selectedItems, toggleSelection) {
                    final recommendations = const ['Apple', 'Banana'];
                    return SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: Row(
                        children: recommendations.map((fruit) {
                          final isSelected = selectedItems.contains(fruit);
                          return Padding(
                            padding: const EdgeInsets.only(right: 8.0),
                            child: ChoiceChip(
                              label: Text(fruit),
                              selected: isSelected,
                              onSelected: (_) => toggleSelection(fruit),
                            ),
                          );
                        }).toList(),
                      ),
                    );
                  },
                ).then((selectedList) {
                  if (!context.mounted) return;
                  if (selectedList != null) {
                    ScaffoldMessenger.of(context).showSnackBar(
                      SnackBar(content: Text('Selected ${selectedList.length} items: ${selectedList.join(", ")}')),
                    );
                  }
                });
              },
              child: const Text('Open Multi-Select Sheet'),
            ),
          ],
        ),
      ),
    );
  }
}