Flutter:主题不适用于“文本”小部件

mar*_*rkt 5 dart flutter

我试图制作一个仅适用于该主题的子级的自定义主题。

但是,当我运行该应用程序时,显示“你好”的文本小部件仍为蓝色。我想把它变黄。

谁能告诉我我要去哪里错了?

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          brightness: Brightness.dark,
          primaryColor: Colors.lightBlue[800],
          accentColor: Colors.cyan[600],
          textTheme: TextTheme(body1: TextStyle(color: Colors.blue))),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: Text(widget.title),
        ),
        body: Center(
            child: Theme(
                data: Theme.of(context).copyWith(
                    textTheme:
                        TextTheme(body1: TextStyle(color: Colors.yellow))),
                child: Text("hello"))));
  }
}
Run Code Online (Sandbox Code Playgroud)

Rém*_*let 9

要主题 a,Text您需要将值分配给style属性

Text("Hello", style: Theme.of(context).textTheme.body1)
Run Code Online (Sandbox Code Playgroud)

确保context在执行时使用正确的Theme.of(context)。您需要一个context新的Theme.

您需要执行以下操作:

 Theme(
     child: Builder(
       builder: (context) {
         return Text("Hello", style: Theme.of(context).textTheme.body1);
       }
     )
  )
Run Code Online (Sandbox Code Playgroud)


Kir*_*hov 7

这是另一种方式,因为有时覆盖默认样式更方便

文本小部件:

如果style参数为空,则文本将使用最近的封闭DefaultTextStyle.

  @override
  Widget build(BuildContext context) {
    final DefaultTextStyle defaultTextStyle = DefaultTextStyle.of(context);
    TextStyle effectiveTextStyle = style;
    if (style == null || style.inherit)
      effectiveTextStyle = defaultTextStyle.style.merge(style);
Run Code Online (Sandbox Code Playgroud)

所以,如果你想覆盖Text小部件的默认样式(当你不传递style属性时),你需要使用DefaultTextStyle小部件

return new Scaffold(
    appBar: new AppBar(
      title: Text(widget.title),
    ),
    body: Center(
        child: DefaultTextStyle(
          style: Theme.of(context).textTheme.body1.copyWith(color: Colors.yellow), 
          child: Text("hello"))
        )
);
Run Code Online (Sandbox Code Playgroud)

默认文本样式

MaterialApp使用它TextStyle作为它DefaultTextStyle来鼓励开发人员有意识地关注他们的DefaultTextStyle