CODEWITHSUNDEEP
colorsdartflutterpopupicons
willy wijaya
willy wijaya

Reputation: 772

Flutter PopupMenu change icon color

how to change icon colour on PopupMenuButton, I have used Theme with iconTheme but it doesn't affect the icon on CheckedPopupMenuItem nor PopupMenuItem.

Scaffold(
      backgroundColor: Colors.transparent,
      appBar: AppBar(
        elevation: 0.0,
        backgroundColor: Colors.transparent,
        actions: <Widget>[
          Theme(
            data: Theme.of(context).copyWith(
              cardColor: Colors.indigo,
              iconTheme: IconThemeData(color: Colors.white),
            ),
            child: ListTileTheme(
              iconColor: Colors.white,
              child: PopupMenuButton<String>(
                onSelected: _showCheckedMenuSelections,
                itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
                  CheckedPopupMenuItem<String>(
                    value: _checkedValue1,
                    checked: _showRoles,
                    child: Text(_checkedValue1, style: Theme.of(context).textTheme.body1),
                  ),
                  const PopupMenuDivider(),
                  PopupMenuItem<String>(
                    value: 'Get Link',
                    child: ListTile(
                      leading: Icon(Icons.phonelink),
                      title: Text('Get link', style: Theme.of(context).textTheme.body1),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),

The result is look like this : enter image description here

Upvotes: 5

Views: 12089

Answers (2)

Miriam
Miriam

Reputation: 367

Just do this

 appBar: AppBar(
          iconTheme: IconThemeData(color: Colors.white, size: 10.0),
          elevation: 4.0,
          backgroundColor: Colors.black,
)

Upvotes: 7

Darshan
Darshan

Reputation: 11679

You can wrap the Icon widget inside IconButton which provides color property to change the icon color. Sample code below:

value: 'Get Link',
    child: ListTile(
    leading: IconButton(
      icon: Icon(Icons.phonelink,
      color: Colors.blue,),
      onPressed: () {},
    ),
    title: Text('Get link', style: Theme.of(context).textTheme.body1),
    ),

enter image description here

Upvotes: 5

Related Questions