Sunday, May 24, 2020

How to use CheckboxListTile Widget Flutter ?

Series - Lit Flutter Widgets


I am feeling proud to announce that from this article onwards, I am going to begin a series named " Lit Flutter Widgets," and this is going to be the very first article of this series. In this series, you'll learn about some of the formidable and best flutter widgets available out there.

In this article, you are going to learn about the CheckboxListTileWidget in Flutter. On the date of writing this article, this widget is also included in the "Flutter Widget of the Week," Series Started by flutter team.

CheckboxTile Widget



CheckboxTile widget as its name suggests this widget is made using a combination of two widgets Checkbox and Tile Widgets that are already available in Flutters Widget library.

In simple words, it can be defined as a Checkbox with a label.

This is a simple code explaining the working of CheckboxTile Widget.
 CheckboxListTile(  
          title: Text("This is the text",),  
          secondary: Icon(Icons.add_alarm),  
          controlAffinity: ListTileControlAffinity.leading,  
          value: _checked,  
          onChanged: (bool value){  
           setState((){  
            _checked=value;  
           });  
          },  
          activeColor: Colors.green,  
          checkColor: Colors.black,  
         ),  

There are two essential parts in CheckboxTile Widget and the rest of they can be used according to use cases.

1. Title: The title parameter is used to display the Text widget i.e. to show text part of the checkbox label.

2. Secondary: The secondary parameter is used to display the icon widget in the label of the CheckboxTileWidget.

4. ControlAffinity: The control affinity parameter is used to control on which side it will appear on.
It can have one of the four values i.e ListTileControlAffinity.leadingListTileControlAffinity.trailing or  ListTileControlAffinity.platform

5. Values: This is used to maintain a state of whether the value is checked or not.

6. OnChanged: This parameter is called when there is some change in the value or only when the value in the checkbox changes

7. ActiveColor and checkColor: These parameters are used when we want to change the default colour provided for the CheckboxTileWidget.

The source code for the complete running application is given below.

Conclusion

In this article, you learned about the usage, properties, and parameters of CheckboxTile Widget in Flutter. I also implemented the code in a full running Flutter Application.
For more information, you can visit flutter.dev

Thanks for reading the article.
Also, let me know whats your favourite flutter widget till now ;)?
Previous Post
Next Post

post written by:

Hi, Navjyot Singh is a coder, content maker and a freelance developer who's pursuing an undergraduate Engineering degree in Computer Science. He started out as a web developer but later picked up the mobile as his favourite platform to develop applications. A Writer by day and coder by night is loathed to discuss himself as the third person but can be persuaded to do so from time to time.

0 comments: