radio_grouped_buttons 1.0.0+1

  • Readme
  • Changelog
  • Example
  • Installing
  • 82

radio_grouped_button #

This Widget is specially designed for List of grouped radio buttons in grid manner flutter. You can customize it any time with its all attributes. You can create radio button group in horizontal manner or vertical manner as you wish. Button width,height spaces between buttons,colors all the things are customizable.

Installing #

dependencies:
    radio_grouped_buttons: 1.0.0+1

Creating radio button #

Make sure You have included the parent widget with bounded like container with width and height. By Default the initial selected value is the first value of the list that you provide for the button value list.

All Attributes #

CustomRadioButton({this.buttonLables,
    this.buttonValues,
    this.radioButtonValue,
    this.buttonWidth,
    this.buttonColor,
    this.selectedColor,
    this.buttonHeight,
    this.horizontal,
    this.enableShape,
    this.elevation,
    this.customShape,
    this.fontSize,
    this.lineSpace,
    this.buttonSpace,
    this.buttonBorderColor,
    this.textColor,
    this.selectedTextColor
  })

creating horizontal radio button list #

When It overflow container width It will be added to next line automatically.

            Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 160,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  horizontal: true,
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                ),
              ),

creating vertical radio button list #

When It overflow container width in one line It will be automatically added to new column inside the parent widget.

            Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 250,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                ),
              ),

horizontal and vertical radio buttons

Creating Equal width vertical radio button list #

If you want to create the buttons with equal width and height buttonWidth and buttonHeight attributes are also available

            Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 250,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                  buttonWidth: 150,
                ),
              ),

creating equal width horizontal button list #

                  Container(
                    padding: EdgeInsets.all(10),
                    width: MediaQuery.of(context).size.width,
                    height: 250,
                    child: CustomRadioButton(
                      buttonLables: buttonList,
                      buttonValues: buttonList,
                      radioButtonValue: (value)=>print(value),
                      horizontal: true,
                      enableShape: true,
                      buttonSpace: 5,
                      buttonColor: Colors.white,
                      selectedColor: Colors.cyan,
                      buttonWidth: 150,
                    ),
                  )

horizontal and vertical radio buttons

[0.0.1] - 30/05/2020 #

  • Initial Release. This is a smart flutter widget that is fully customizable for radio button group creations.

    Features:

    • Equal width buttons
    • radio buttons horizontal
    • radio buttons vertical
    • radio buttons equal width and height

[1.0.0] - 30/05/2020 #

##[1.0.0+1]- 1/07/2020 Readme updated and some issues fixed.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:radio_grouped_buttons/radio_grouped_buttons.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Group Grid View radio Buttons',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: GroupGridRadioButtonExample(),
    );
  }
}

class GroupGridRadioButtonExample extends StatefulWidget {
  @override
  _GroupGridRadioButtonExampleState createState() => _GroupGridRadioButtonExampleState();
}

class _GroupGridRadioButtonExampleState extends State<GroupGridRadioButtonExample> {

  ///horizontal list of buttons
  List<String> buttonList=[
      "Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          title: Text("Group grid Radio Button Example"),
        ),
        body: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              SizedBox(height: 20,),
              Text("Horizontal radio list"),
              ///use this widget in bounded parent widget
              Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 160,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  horizontal: true,
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                  //buttonWidth: 150,
                ),
              ),
              SizedBox(height: 20,),


              Text("Vertical radio list"),
              ///use this widget in bounded parent widget
              Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 250,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                  //buttonWidth: 150,
                ),
              ),
              SizedBox(height: 20,),


              Text("Same length button radio vertical list"),
              ///use this widget in bounded parent widget
              Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 250,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                  buttonWidth: 150,
                ),
              ),
              SizedBox(height: 20,),


              Text("Same length button radio horizontal list"),
              ///use this widget in bounded parent widget
              Container(
                padding: EdgeInsets.all(10),
                width: MediaQuery.of(context).size.width,
                height: 250,
                child: CustomRadioButton(
                  buttonLables: buttonList,
                  buttonValues: buttonList,
                  radioButtonValue: (value)=>print(value),
                  horizontal: true,
                  enableShape: true,
                  buttonSpace: 5,
                  buttonColor: Colors.white,
                  selectedColor: Colors.cyan,
                  buttonWidth: 150,
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  radio_grouped_buttons: ^1.0.0+1

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:radio_grouped_buttons/radio_grouped_buttons.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
64
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
82
Learn more about scoring.

We analyzed this package on Jul 11, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.8.4
  • pana: 0.13.15
  • Flutter: 1.17.5

Analysis suggestions

Package not compatible with SDK dart

Because:

  • radio_grouped_buttons that is a package requiring null.

Health suggestions

Format lib/custom_buttons/custom_radio_buttons_group.dart.

Run flutter format to format lib/custom_buttons/custom_radio_buttons_group.dart.

Format lib/radio_grouped_buttons.dart.

Run flutter format to format lib/radio_grouped_buttons.dart.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.7.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.12 1.14.13
meta 1.1.8 1.2.2
sky_engine 0.0.99
typed_data 1.1.6 1.2.0
vector_math 2.0.8 2.1.0-nullsafety
Dev dependencies
flutter_test