如何确定文本颜色在 Flutter ?

mzmfm0qo  于 2023-11-21  发布在  Flutter
关注(0)|答案(2)|浏览(149)

我想找出AppBar文本的颜色:

import 'package:flutter/material.dart';

void main() => runApp(const MaterialApp(
      home: MyHomePage(),
    ));

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    print(Theme.of(context).appBarTheme.foregroundColor); // null
    print(Theme.of(context)
        .colorScheme
        .onPrimary); // Color(0xffffffff) - wrong: text is black not white
    return const Scaffold(
      body: Text('ok'),
    );
  }
}

字符串
我该怎么办?

olmpazwi

olmpazwi1#

当我们没有为appBarTheme提供任何主题数据时,它将默认使用textTheme.titleLarge来获取颜色使用。

Theme.of(context).textTheme.titleLarge?.color;

字符串
titleTextStyle记录如下
如果此属性为空,则使用[ThemeData.appBarTheme]的[AppBarTheme.titleTextStyle]。
如果该值也为null,则默认值为整个主题的[TextTheme.titleLarge] [TextStyle]的副本,颜色设置为应用程序栏的[foregroundColor]。

xxe27gdn

xxe27gdn2#

当然,Theme.of(context)让你可以访问widget树中的当前主题。但是,在AppBar文本颜色的情况下,它继承自主题中的AppBarThemeTextTheme
要检索AppBar的文本颜色,您应该访问AppBarTheme中的textTheme属性:

import 'package:flutter/material.dart';

void main() => runApp(const MaterialApp(
      home: MyHomePage(),
    ));

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final appBarTheme = Theme.of(context).appBarTheme;
    final appBarTextTheme = appBarTheme.textTheme;
    final appBarTextColor = appBarTextTheme?.headline6?.color;

    print(appBarTextColor); // This will print the color of AppBar text

    print(Theme.of(context).colorScheme.onPrimary); // This is the primary color, not AppBar text color

    return const Scaffold(
      body: Text('ok'),
    );
  }
}

字符串
这段代码获取AppBartextTheme,然后从headline6中检索颜色,这通常对应于AppBar标题中使用的文本样式。appBarTextColor将表示AppBar文本的颜色。
请记住,如果没有指定headline6,或者它是从其他源继承的,直接访问它的颜色可能会返回null,因此请确保在代码中优雅地处理这种情况。

相关问题