CODEWITHSUNDEEP
dartflutter
Milie
Milie

Reputation: 435

How to make SwitchListTile Icon clickable?

Is it possible to make the secondary property of the SwitchListTile tapable? In this case, an icon is used:

SwitchListTile(
  title: const Text('Lights'),
  value: _lights,
  onChanged: (bool value) { setState(() { _lights = value; }); },
  secondary: const Icon(Icons.lightbulb_outline), //can this be selected?
)

Ideally, instead of creating another widget, I would like to use the Icon in the secondary property to display a message when the user selects it.

Currently when the icon, or entire widget is selected, the switch is toggled. What is the best way to handle this action?

Thanks.

Upvotes: 2

Views: 2453

Answers (2)

thijsdaniels89
thijsdaniels89

Reputation: 31

You could wrap your Icon in an IconButton.

SwitchListTile(
  title: const Text('Lights'),
  value: _lights,
  onChanged: (value) => setState(() => _lights = value),
  secondary: IconButton(
    icon: Icon(Icons.lightbulb_outline),
    onPressed: () {},
  ),
)

Upvotes: 1

diegoveloper
diegoveloper

Reputation: 103421

Wrap your Icon inside InkWell to handle the tap :

      secondary: InkWell(
                onTap: () {
                  print("click light");
                },
                child: const Icon(Icons.lightbulb_outline),
              ),

More info here: https://docs.flutter.io/flutter/material/InkWell-class.html

Upvotes: 3

Related Questions