dart 我如何在Flutter中为禁用的文本表单字段的标签设置主题颜色？

u5i3ibmn 于 12个月前发布在 Flutter

关注(0)|答案(4)|浏览(156)

我想在我的Flutter应用程序中应用一个主题在禁用的文本字段的标签上，因为我现在的灰色很难阅读。
我想将其应用到我的整个应用程序，所以我想使用主题化，但是，我没有找到任何解决方案，使我能够自定义标签的文本样式只有当文本表单字段被禁用

如何在Flutter中为禁用的文本表单字段标签设置主题和全局颜色？

我知道如何有条件地更改标签的文本样式，但是，我需要记住始终使用相同的样式（或者我可以 Package 小部件，但这听起来也不是最佳的）。我可以通过decoration命名参数自定义标签的颜色，如下所示：

TextFormField(
  enabled: isEnabled,
  decoration: InputDecoration(
    labelText: 'Value',
    labelStyle: TextStyle(color: isEnabled ? Colors.green : Colors.red),
  ),
  // .... other fields, like controller might come here
),

字符串

dart

来源：https://stackoverflow.com/questions/57035045/how-can-i-theme-the-color-the-disabled-text-form-fields-label-in-flutter

4条答案

按热度按时间

hc8w905p1#

您可以使用Theme来 Package 您的小部件设置属性 disabledColor。
示例：Demo

final customText = Theme(
  data: ThemeData(
    disabledColor: Colors.blue,
  ),
  child: TextFormField(
    enabled: false,
    decoration: const InputDecoration(
        icon: Icon(Icons.person),
        hintText: 'What do people call you?',
        labelText: 'Name *',
    ),
  ),
);

字符串
或全局

Widget build(BuildContext context) {
  return MaterialApp(
    title: 'Flutter Demo',
    theme: ThemeData(
      disabledColor: Colors.blue,
    ),
    home: MyHomePage(title: 'Flutter Demo Home Page'),
  );
}

型

赞(0）回复(0）举报 12个月前

5us2dqdw2#

可以使用InputDecorationTheme。
MaterialApp有一个属性theme，您可以在其中设置自定义ThemeData。
ThemeData有一个属性inputDecorationTheme，您可以在其中设置InputDecorationTheme。
InputDecorationTheme有很多属性可用于自定义文本字段。

MaterialApp(
        theme: ThemeData(
          inputDecorationTheme: InputDecorationTheme(
            border: OutlineInputBorder(),
            contentPadding: EdgeInsets.symmetric(
              vertical: 22,
              horizontal: 26,
            ),
            labelStyle: TextStyle(
              fontSize: 35,
              decorationColor: Colors.red,
            ),
        ),
)

字符串

赞(0）回复(0）举报 12个月前

monwx1rj3#

要为InputDecoration中的禁用字段定义其他标签颜色，可以使用MaterialStateTextStyle.resolveWith

labelStyle: MaterialStateTextStyle.resolveWith(
  (Set<MaterialState> states) {
    if (states.contains(MaterialState.disabled)) {
      return const TextStyle(
        color: Colors.grey,
      );
    } else {
      return TextStyle(
        color: Colors.blue,
      );
    }
  },
),

字符串

赞(0）回复(0）举报 12个月前

wd2eg0qa4#

这就是我的工作：
style：bodyText（）.copyWith（color：Colors.black），在我的例子中，//bodyText（）是在其他地方定义的
它强制文本颜色为黑色，而不管TextFormField是启用还是禁用

赞(0）回复(0）举报 12个月前