uk_custom_widget 1.0.3

A new Flutter Custom packages project.

My Custom Widget

A Flutter package that provides some customizable widgets.

Widgets

• CustomCheckbox
• CustomRadioButton
• CustomAccordion
• CustomRatingBar

Custom Checkbox

Importing the CustomCheckbox widget:

import 'package:uk_custom_widget/uk_custom_checkbox.dart';

Use the CustomCheckbox widget in your app:

CustomCheckbox(
  value: isChecked,
  onChanged: (val) {
    setState(() {
      isChecked = val;
    });
  },
)

Properties

Property Name	Description	Default	Type
value	This is used for give the radio button a value	Required	Boolean
activeColor	This is the selected checkbox color	Blue	Colors
size	This is the checkbox size	24.0	Double
borderRadius	This is the border radius for checkbox	4	BorderRadius

Method

Function Name	Description
onChanged	This callback function is used when you click on Checkbox. It returns boolean value

Custom RadioButton

Importing the CustomRadioButton widget:

import 'package:uk_custom_widget/uk_custom_radio_button.dart';

Use the CustomRadioButton widget in your app:

    String selectedValue = 'option1';

    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,
      ),
    ),

Properties

Property Name	Description	Default	Type
value	This is used for give the radio button a value	Required	Generic
groupValue	This is the selected value of the radio button.	Required	Generic
activeColor	This is the selected radio button color	Blue	Colors
label	This is the label for the radio button	Required	string
labelStyle	This is the label style for the radio button	Optional	TextStyle

Method

Function Name	Description
onChanged	This callback function is used when you click on RadioButton. It returns selected value

Custom Accordion

Importing the CustomAccordion widget:

import 'package:uk_custom_widget/uk_custom_accordion.dart';

Use the CustomAccordion widget in your app:

    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],
    ),

Properties

Property Name	Description	Required	Type
title	The visible header of the accordion. Typically a Text, but can be any widget.	Yes	Widget
content	The collapsible/expandable content shown when accordion is open.	Yes	Widget
initiallyExpanded	Whether the accordion starts expanded. Default: false.	No	bool
animationDuration	Controls the duration of expand/collapse animation. Default: 300ms.	No	Duration
backgroundColor	Optional background color of the accordion container.	No	Color
padding	Padding around the title area. Default: EdgeInsets.all(16.0).	No	EdgeInsetsGeometry

Custom RatingBar

Importing the CustomRatingBar widget:

import 'package:uk_custom_widget/uk_custom_rating_bar.dart';

Use the CustomRatingBar widget in your app:

    CustomRatingBar(
      initialRating: 3,
      starCount: 5,
      size: 30,
      allowHalfRating: true,
      filledColor: Colors.orange,
      onRatingChanged: (rating) {
        print('Selected Rating: $rating');
      },
    ),

Properties

Property Name	Description	Required	Default	Type
starCount	Number of stars to show.	No	5	Widget
initialRating	The initial selected rating.	No	0.0	Widget
size	Size of each star icon.	No	32	bool
filledColor	Color of the filled stars.	No	Colors.amber	Duration
unfilledColor	Color of the unfilled (empty) stars.	No	Colors.grey	Color
allowHalfRating	Allows rating in halves	No	false	EdgeInsetsGeometry

Callback

Function Name	Description
onRatingChanged	Called whenever the user selects a new rating.