Home > Software design >  appbar icons aren't being effected by the themedata
appbar icons aren't being effected by the themedata

Time:11-10

I'm trying to set up the themedata for my app and i can't get the color of the icons in the app bar to change.

import 'package:flutter/material.dart';


void main() {
  runApp(
    const MyApp(),
  );
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  static const primaryColor = Color(0xFF0A0E21);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        appBarTheme: AppBarTheme(
          color: primaryColor,
          iconTheme: IconThemeData(
            color: Colors.white,
            size: 40,
          ),
          foregroundColor: Colors.white,
        ),
        scaffoldBackgroundColor: primaryColor,
        textTheme: TextTheme(
          bodyText1: TextStyle(
            fontWeight: FontWeight.bold,
            fontFamily: 'SourceSansPro',
          ),
        ),
      ),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text('HELLO'),
          toolbarHeight: 60.0,
          //centerTitle: true,

          actions: [
            IconButton(
              onPressed: null,
              icon: Icon(
                Icons.settings,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

I can change the color in the appbar widget itself but i don't want to do that over multiple pages.

weirdly enough, the size parameter in the IconThemeData is having an effect. but not the color.

i've also tried a full restart of the emulator too.

any help would be greatly appreciated.

CodePudding user response:

For IconButton's , It is using disabledColor color by default.

You can check by

 theme: ThemeData.dark().copyWith(
        disabledColor: Colors.white,

Also for your case, you can do

icon: Icon(
  Icons.settings,
  color: Theme.of(context).iconTheme.color,
),
  • Related