group_button

Build Status License: MIT Pub

Flutter custom widget to make a group buttons.
Included Radio and CheckBox buttons models.
pub package

Getting Started

Follow these steps to use this package

Add dependency

dependencies:
  group_button: ^1.0.2 #latest version

Add import package

import 'package:group_button/group_button.dart';

Easy to use

Simple example of use GroupButton
Put this code in your project at an screen and learn how it works 😊

GroupButton(
    isRadio: false,
    spacing: 10,
    onSelected: (index, isSelected) => print('$index button is selected'),
    buttons: ["12:00", "13:00", "14:30", "18:00", "19:00", "21:40"],
)

Customize

In order to customize your buttons inside GroupButton you can use code below
This code includes all the fields used in GroupButton

GroupButton(
    spacing: 5,
    isRadio: false,
    direction: Axis.horizontal,
    onSelected: (index, isSelected) =>
          print('$index button is ${isSelected ? 'selected' : 'unselected'}'),
    buttons: ["Dart","Kotlin","Java","Swift","Objective-C","Python","JS"],
    selectedTextStyle: TextStyle(
        fontWeight: FontWeight.w600,
        fontSize: 16,
        color: Colors.red,
    ),
    unselectedTextStyle: TextStyle(
        fontWeight: FontWeight.w600,
        fontSize: 14,
        color: Colors.grey[600],
    ),
    selectedColor: Colors.white,
    unselectedColor: Colors.grey[300],
    selectedBorderColor: Colors.red,
    unselectedBorderColor: Colors.grey[500],
    borderRadius: BorderRadius.circular(5.0),
    selectedShadow: <BoxShadow>[BoxShadow(color: Colors.transparent)],
    unselectedShadow: <BoxShadow>[BoxShadow(color: Colors.transparent)],
)

Attributes

AttributeAnnotation
onSelectedString list that will be displayed on buttons in the GroupButton
Content CellCallback Function works by clicking on a group element
Return int index of selected button and isSelected if isRadio = false
isRadiobool variable for switching between modes ChackBox and Radio
if the isRadio = true, only one button can be selected
if the isRadio = false, you can select several at once
directionThe direction of arrangement of the buttons in GroupButton
spacingThe spacing between buttons inside GroupButton
selectedTextStyleTextStyle of text of selected button(s)
unselectedTextStyleTextStyle of text of unselected buttons
selectedColorbackground Color of selected button(s)
unselectedColorbackground Color of unselected buttons
selectedBorderColorborder Color of selected button(s)
unselectedBorderColorborder Color of unselected buttons
borderRadiusBorderRadius of buttons
How much the button will be rounded
selectedShadowlist of selected button(s) BoxShadow
unselectedShadowlist of unselected buttons BoxShadow

For help getting started with 😍 Flutter, view online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

Libraries

group_button