uk_custom_widget 1.0.5

A new Flutter Custom packages project.

example/main.dart

import 'package:flutter/material.dart';
import 'package:uk_custom_widget/models/custom_dropdown_item.dart';
import 'package:uk_custom_widget/uk_custom_accordion.dart';
import 'package:uk_custom_widget/uk_custom_autocomplete.dart';
import 'package:uk_custom_widget/uk_custom_avatar.dart';
import 'package:uk_custom_widget/uk_custom_checkbox.dart';
import 'package:uk_custom_widget/uk_custom_dropdown.dart';
import 'package:uk_custom_widget/uk_custom_radio_button.dart';
import 'package:uk_custom_widget/uk_custom_rating_bar.dart';
import 'package:uk_custom_widget/uk_custom_switch.dart'; // import your widget

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

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

  @override
  State<MyExampleApp> createState() => _MyExampleAppState();
}

class _MyExampleAppState extends State<MyExampleApp> {
  bool isChecked = false;
  String selectedValue = 'option1';
  bool isOn = false;

  final items = [
    CustomDropdownItem(label: 'Red', value: 'red'),
    CustomDropdownItem(label: 'Green', value: 'green'),
    CustomDropdownItem(label: 'Blue', value: 'blue'),
    CustomDropdownItem(label: 'Yellow', value: 'yellow'),
    CustomDropdownItem(label: 'Sky', value: 'sky'),
    CustomDropdownItem(label: 'Black', value: 'black'),
  ];

  final List<CustomAutocompleteItem> cityOptions = [
    CustomAutocompleteItem(label: 'New York', value: 'ny'),
    CustomAutocompleteItem(label: 'Los Angeles', value: 'la'),
    CustomAutocompleteItem(label: 'Chicago', value: 'chi'),
    CustomAutocompleteItem(label: 'Houston', value: 'hou'),
    CustomAutocompleteItem(label: 'Phoenix', value: 'phx'),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My Custom Widget Example',
      home: Scaffold(
        appBar: AppBar(title: const Text('Example Screen')),
        body: SafeArea(
          child: Container(
            child: Padding(
              padding: const EdgeInsets.all(20.0),
              child: Column(
                children: [
                  Row(
                    children: [
                      Text(
                        "Hi, Jared!",
                        style: TextStyle(
                          color: const Color.fromARGB(255, 26, 25, 25),
                        ),
                      ),
                      CustomCheckbox(
                        value: isChecked,
                        onChanged: (val) {
                          setState(() {
                            isChecked = val;
                          });
                        },
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      CustomRadioButton<String>(
                        value: 'option1',
                        groupValue: selectedValue,
                        activeColor: Colors.red,
                        onChanged: (val) {
                          setState(() {
                            selectedValue = val;
                          });
                        },
                        label: 'Option 1',
                        labelStyle: const TextStyle(
                          color: Color.fromARGB(255, 26, 25, 25),
                          fontSize: 20,
                        ),
                      ),
                      CustomRadioButton<String>(
                        value: 'option2',
                        groupValue: selectedValue,
                        activeColor: Colors.red,
                        onChanged: (val) {
                          setState(() {
                            selectedValue = val;
                          });
                        },
                        label: 'Option 2',
                        labelStyle: const TextStyle(
                          color: Color.fromARGB(255, 26, 25, 25),
                          fontSize: 20,
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      Expanded(
                        child: Padding(
                          padding: const EdgeInsets.all(0.0),
                          child: CustomAccordion(
                            title: Text(
                              "Tap to Expand",
                              style: TextStyle(fontSize: 18),
                            ),
                            content: Text(
                              "This is the hidden content that becomes visible when expanded. You can place any widget here.",
                            ),
                            backgroundColor: Colors.grey[200],
                          ),
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      CustomRatingBar(
                        initialRating: 3,
                        starCount: 5,
                        size: 30,
                        allowHalfRating: true,
                        filledColor: Colors.orange,
                        onRatingChanged: (rating) {
                          print('Selected Rating: $rating');
                        },
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      CustomSwitch(
                        value: isOn,
                        onChanged: (newValue) {
                          setState(() {
                            isOn = newValue;
                          });
                        },
                        activeColor: Colors.blue,
                        inactiveColor: Colors.grey,
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      Expanded(
                        child: Padding(
                          padding: const EdgeInsets.all(0.0),
                          child: CustomDropdown<String>(
                            items: items,
                            selectedValue: 'green',
                            onItemSelected: (val) {
                              print('You selected: $val');
                            },
                          ),
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      Expanded(
                        child: CustomAutocomplete(
                          items: cityOptions,
                          onSelected: (item) {
                            print(
                              'Selected => Label: ${item.label}, Value: ${item.value}',
                            );
                          },
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 10),
                  Row(
                    children: [
                      CustomAvatar(
                        imageUrl:
                            'https://images.unsplash.com/photo-1633332755192-727a05c4013d?q=80&w=1160&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
                        radius: 40,
                        borderColor: Colors.orange,
                        borderWidth: 3,
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}