Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you add a label (title text) to a Checkbox in Flutter?

I am playing with Checkbox to see how it works, but I don't see a title option with it.

Checkbox(   title: Text("Checkbox label"),  // The named parameter 'title' isn't defined.   value: true,   onChanged: (newValue) { }, ); 

Do I have to create my own widget to add a title to it?

like image 816
Suragch Avatar asked Dec 18 '18 23:12

Suragch


People also ask

What is label in flutter?

label. Optional widget that describes the input field. When the input field is empty and unfocused, the label is displayed on top of the input field (i.e., at the same location on the screen where text may be entered in the input field).


1 Answers

If you need a Checkbox with a label then you can use a CheckboxListTile.

enter image description here

  CheckboxListTile(     title: Text("title text"), //    <-- label     value: checkedValue,     onChanged: (newValue) { ... },   ) 

If you want the checkbox on the left of the text then you can set the controlAffinity parameter.

enter image description here

  CheckboxListTile(     title: Text("title text"),     value: checkedValue,     onChanged: (newValue) { ... },     controlAffinity: ListTileControlAffinity.leading,  //  <-- leading Checkbox   ) 

Notes

  • Since it is a ListTile, clicking anywhere on the row activates the onChanged() callback. You need to rebuild it with the correct checked values yourself, though. See this answer.
  • An alternate solution would be to make your own widget using a Row with a Checkbox and a Text widget. You would probably want to wrap it in a gesture detector, though, so that taps on the text would also trigger an onChanged() callback. You could start with the CheckboxListTile source code as a reference.
like image 182
Suragch Avatar answered Sep 18 '22 10:09

Suragch