Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter Text Color Theme doesn't work under ListTile title

Tags:

flutter

dart

I am getting started in Flutter and just trying out stuff. I set a custom theme, but Text Widgets under the title property of ListTile don't get the right color. Also Icons under the leading property don't get the right color as well.

I tried setting some other colors, and sorted out, that the Problem only exists within that element.

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'MyApp',
      theme: ThemeData(
          primaryColor: Colors.black,
          scaffoldBackgroundColor: Color(0xff202020),
          cardTheme: CardTheme(color: Colors.black),
          textTheme: TextTheme(
              body1: TextStyle(color: Colors.white),
              subtitle: TextStyle(color: Colors.white),
              headline: TextStyle(color: Colors.white)),
          iconTheme: IconThemeData(color: Colors.white)),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  HomePageState createState() => new HomePageState();
}

class HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("HomePage"),
          leading: IconButton(
              icon: Icon(Icons.arrow_back_ios),
              tooltip: "back to the last page.",
              onPressed: () {
                Navigator.pop(context);
              })
        ),
        body: Card(
          child: ListTile(
            title: Text("Test"),
            leading: new Icon(Icons.devices)
            ),
        ));
  }
}

The Text for the title should appear white as well as the icon, instead it is black. All other Text is white.

like image 396
Shadow Avatar asked Dec 31 '22 19:12

Shadow


1 Answers

The title on ListTile is using subhead textStyle of Theme. So if you want config color of ListTile on ThemeData you need change subhead.

textTheme: TextTheme(
          subhead: TextStyle(color: Colors.white),
          ...)
like image 167
dangngocduc Avatar answered Mar 23 '23 03:03

dangngocduc