我该如何更改文本框工具栏的样式？

Question

我想更改与TextField的工具栏相关的填充/背景颜色/字体大小（当您长按TextField时，该工具栏将显示）。 我应该怎么办？ 我阅读了text_field.dart和text_selection.dart，但没有找到答案。

我注意到当我使用materialTapTargetSize：MaterialTapTargetSize.padded时，它有助于更改Textfield工具栏的填充，但我发现没有任何有用的方法来更改其样式，如背景颜色、跨度颜色等。

这是我的代码。我简化了代码。这段代码在main.dart中。TextField在另一个dart文件中。

MaterialApp(
      theme: ThemeData(
        splashColor: Colors.transparent,
        highlightColor: Colors.transparent,
        primaryColorBrightness: Brightness.light,
        buttonTheme: ButtonThemeData(
          minWidth: 0,
          padding: EdgeInsets.all(0), // Notice this
          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
          splashColor: Colors.transparent,
          highlightColor: Colors.transparent,
        ),home:SizedBox()
 )

当我更改填充时，文本字段工具栏填充将发生变化。我有点困惑，如何在主题未更改的情况下更改它。在TextStyle中没有找到有用的信息。翻译成：当我更改填充时，文本字段的工具栏填充也会随之更改。我有些困惑，不知道如何在不更改主题的情况下进行修改。在TextStyle中没有找到任何有用的信息。

TextField(
              style: CustomTextStyle.textField14TextStyle,
              keyboardType: widget.keyboardType,
              autocorrect: false,
              enableInteractiveSelection: true,
              decoration: InputDecoration(
                hintText: _getHintText(),
                hintStyle: CustomTextStyle.minorGray14TextStyle,
                enabledBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: widget.isError ? Color(0xffbb424a) : Color(0xff333333)),
                ),
                focusedBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: widget.isError ? Color(0xffbb424a) : CustomColor.obviousTextColor),
                ),
                contentPadding: EdgeInsets.symmetric(vertical: Global.isShortScreen ? 15 : 20),
              ),
              onSubmitted: (text) {
                if (widget.onSubmitted != null) {
                  widget.onSubmitted();
                }
              },
              controller: widget.controller,
              cursorColor: CustomColor.obviousTextColor,
            )

我尝试使用类似 Material( child: Theme(data:ThemeData(),child:TextField()) 的东西，但它不起作用。翻译成：我试图使用类似于 Material(child: Theme(data: ThemeData(), child: TextField())) 的代码，但它没有产生效果。

- mafanwei

---

你能和我们分享SS吗？ - undefined

什么是SS？@secret35 - undefined

你能分享截图吗？ - undefined

如果您在Flutter中使用TextField，您将获得相同的用户界面，因此截图是无用的。我的问题是询问TextField工具栏，而不是TextField本身。如果您长按TextField，工具栏将会显示。您可以先试一下吗？谢谢。 - undefined

Answer 1

如果要更改文本选择颜色，可以使用textSelectionTheme

cursorColor用于光标行

selectionHandleColor用于光标下方的气泡

selectionColor用于高亮颜色

textSelectionTheme: _theme.textSelectionTheme.copyWith(
        cursorColor: AppColors.purple,
        selectionHandleColor: AppColors.purple,
        selectionColor: AppColors.grey4,
 ),

如果要更改文本工具栏选项的样式，您可以使用 button 和 textTheme

textTheme: _theme.textTheme
          .copyWith(
            button: _theme.textTheme.button?.copyWith(
              //here
            ), 
          )
          .apply(fontFamily: GoogleFonts.roboto().fontFamily),

- Milvertion