custom_radio_grouped_button 2.2.1 copy "custom_radio_grouped_button: ^2.2.1" to clipboard
custom_radio_grouped_button: ^2.2.1 copied to clipboard

Custom Radio Buttons and Grouped Check Box Button

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