0

我想在我的应用程序中使用 ThemeData 的 textTheme 进行全局使用,而 textTheme 只是更改字体和颜色。

但是正如您在图片中看到的那样,Text Widgets 之间会有明显的区别。这种差异是怎么来的?因为上面标签的TextStyle其实和底部标签是一样的。ThemeData 是否会做更多的事情来改变我的 TextStyle?

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          primarySwatch: Colors.blue,
          textTheme: TextTheme(
            headline1: TextStyle(fontSize: 17, color: Color(0xFFFF0000)),
          )),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
              style: Theme.of(context).textTheme.headline1,
            ),
            Text(
              'You have pushed the button this many times:',
              style: TextStyle(fontSize: 17, color: Color(0xFFFF0000)),
            ),
          ],
        ),
      ),
    );
  }
}

在此处输入图像描述

4

1 回答 1

1

两个文本看起来不同的原因是你没有指定它们的 fontWeight 和 flutter 不幸地给两个文本不同的默认 fontWeights。您只需为两者指定相同的 fontWeight 即可。我尝试过这个。这是代码:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          primarySwatch: Colors.blue,
          textTheme: TextTheme(
            headline1: TextStyle(fontSize: 17, color: Color(0xFFFF0000),
                fontWeight: FontWeight.normal),
          )),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
              style: Theme.of(context).textTheme.headline1,
            ),
            Text(
              'You have pushed the button this many times:',
              style: TextStyle(fontSize: 17, color: Color(0xFFFF0000),
                  fontWeight: FontWeight.normal),
            ),
          ],
        ),
      ),
    );
  }
}
于 2021-08-16T06:27:54.947 回答