Checkbox Widget

What is Checkbox Widget?

A material design checkbox.

Default Constructor

The default constructor creates a material design checkbox.

Checkbox(
    value:
    onChanged:
);

Constructor Parameters

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

Configure value parameter to indicate whether this checkbox is checked.

Configure onChanged parameter to call when the value of the checkbox changed.

Code snippet

The following code snippet shows how to configure Checkbox widget.

bool _isSelected = false;


Checkbox(
          value: _isSelected,
          onChanged: (bool newValue) {
            setState(() {
              _isSelected = newValue;
            });
          },
        ),

Demo Code

This example display's checkbox with label, and the onChange callback is when Checkbox checked and unChecked.

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

class CheckBoxDemo extends StatefulWidget {
  @override
  _CheckBoxDemoState createState() => _CheckBoxDemoState();
}

class _CheckBoxDemoState extends State<CheckBoxDemo> {
  bool _isSelected = false;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: <Widget>[
        Checkbox(
          value: _isSelected,
          onChanged: (bool newValue) {
            setState(() {
              _isSelected = 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 = 'CheckBox Demo';

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

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