Skip to content

Latest commit

 

History

History
111 lines (88 loc) · 2.74 KB

README.md

File metadata and controls

111 lines (88 loc) · 2.74 KB

custom_radio_grouped_button

Pub

Custom Radio Buttons and Grouped Check Box Button

Custom Flutter widgets that makes Checkbox and Radio Buttons much cleaner and easier

Installing

Add the following to your pubspec.yaml file:

dependencies:
  custom_radio_grouped_button: any

Creating Radio Button

CustomRadioButton(
  elevation: 0,
  absoluteZeroSpacing: true,
  unSelectedColor: Theme.of(context).canvasColor,
  buttonLables: [
    'Student',
    'Parent',
    'Teacher',
  ],
  buttonValues: [
    "STUDENT",
    "PARENT",
    "TEACHER",
  ],
  buttonTextStyle: ButtonTextStyle(
      selectedColor: Colors.white,
      unSelectedColor: Colors.black,
      textStyle: TextStyle(fontSize: 16)),
  radioButtonValue: (value) {
    print(value);
  },
  selectedColor: Theme.of(context).accentColor,
),

Creating Grouped Button

CustomCheckBoxGroup(
  buttonTextStyle: ButtonTextStyle(
    selectedColor: Colors.red,
    unSelectedColor: Colors.orange,
    textStyle: TextStyle(
      fontSize: 16,
    ),
    selectedTextStyle: TextStyle(
      fontSize: 20,
      fontWeight: FontWeight.w700,
    ),
  ),
  unSelectedColor: Theme.of(context).canvasColor,
  buttonLables: [
    "M",
    "T",
    "W",
    "T",
    "F",
    "S",
    "S",
  ],
  buttonValuesList: [
    "Monday",
    "Tuesday",
    "Wednesday",
    "Thursday",
    "Friday",
    "Saturday",
    "Sunday",
  ],
  checkBoxButtonValues: (values) {
    print(values);
  },
  spacing: 0,
  defaultSelected: "Monday",
  horizontal: false,
  enableButtonWrap: false,
  width: 40,
  absoluteZeroSpacing: false,
  selectedColor: Theme.of(context).accentColor,
  padding: 10, 
);

Changing values Programiically

You can acces the widget's state using Key now

Example: Create a key for the CustomRadioButton widget

final key = new GlobalKey<CustomRadioButtonState<T>>();

now to change the value of the widget pass the value to the selectButton method

key.currentState.selectButton(<value>);

Similarly for the CustomCheckBoxGroup widget

final key = new GlobalKey<CustomCheckBoxGroupState<T>>();

key.currentState.selectButton(<value>);

Screenshots

Grouped Button

Grouped Button