Radio Widget

What is Radio Widget?

A material design radio button.

Default Constructor

The default constructor creates a material design radio button.

Radio(
    value:
    groupValue:
    onChanged:
);

Constructor Parameters

It contains many input parameters which can be configured to change its behavior and appearance.

Configure value parameter to represent the value to this radio button.

Configure groupValue parameter to define currently selected value for a group of radio buttons.

Configure onChanged parameter to call when the user selects this radio button.

Code snippet

The following code snippet shows how to configure Radio button widget.

enum PizzaSize { Small, Medium, Large }

PizzaSize _selectedItem;

Radio(
          value: PizzaSize.Large,
          groupValue: _selectedItem,
          onChanged: (PizzaSize newValue) {
            setState(() {
              _selectedItem = newValue;
            });
          },
        ),

Demo Code

This example display's Radio button with label, and the onChange callback is when Radio checked.

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

enum PizzaSize { Small, Medium, Large }

class RadioDemo extends StatefulWidget {
  @override
  _RadioDemoState createState() => _RadioDemoState();
}

class _RadioDemoState extends State<RadioDemo> {
  PizzaSize _selectedItem;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: <Widget>[
        Radio(
          value: PizzaSize.Large,
          groupValue: _selectedItem,
          onChanged: (PizzaSize newValue) {
            setState(() {
              _selectedItem = newValue;
            });
          },
        ),
        Expanded(
          child: RichText(
            text: TextSpan(
              text: 'Large Pizza',
              style: TextStyle(
                color: Colors.blueAccent,
              ),
              recognizer: TapGestureRecognizer()
                ..onTap = () {
                  print('Label has been tapped.');
                },
            ),
          ),
        ),
      ],
    );
  }
}

class MyApp extends StatelessWidget {
  static const String _title = 'Radio Demo';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: RadioDemo(),
      ),
    );
  }
}

void main() => runApp(MyApp());