Flutter - 如何更改TextField的边框颜色?

13

我尝试了各种方法来改变文本框的边框颜色,但似乎都被忽略了。

我尝试使用sideBorder(即使是相同的宽度也被忽略),hintStyle,将特定主题应用于仅此小部件,它们都被忽略了。

child: new Theme(
      data: ThemeData(
      primaryColor: Colors.white,
      accentColor: Colors.white,
      hintColor: Colors.white //This is Ignored,
      inputDecorationTheme: InputDecorationTheme(
               border: OutlineInputBorder(
               borderSide: BorderSide(color: Colors.white) //This is Ignored
                    ),
                  ),
              ),
      child: new TextField(
             style: TextStyle(color: Colors.white, decorationColor: Colors.white),
             cursorColor: Colors.white,
             decoration: InputDecoration(
             border: new OutlineInputBorder(
             //borderRadius: const BorderRadius.all(Radius.circular(30.0)),
             borderSide: BorderSide(color: Colors.white, width: 0.0) //This is Ignored,
                      ),
                      hintText: "Search people",
                    ),
                  ),
                  //new Divider(color: Colors.white, height: 20),

          )

我想改变那条发际线似的黑色边框,调整它的颜色和宽度。

当前样式图片

2个回答

25
使用enabledBorderfocusedBorder(当文本字段获得焦点时)
InputDecoration(
              enabledBorder: OutlineInputBorder(
                  borderSide: BorderSide(
                      color: Colors.red, width: 5.0),
                  ),
              focusedBorder: OutlineInputBorder(
                  borderSide: BorderSide(
                      color: Colors.blue, width: 3.0),
                  ),
              hintText: "Search people",
            ),

1
谢谢,你帮了大忙!! - Ismaeil Ghouneim

0

我同意其他答案,但如果你只使用下限,则可以使用以下代码:

    TextField(
          decoration: InputDecoration(
            focusedBorder: UnderlineInputBorder(
                borderSide: BorderSide(color: Colors.black)),
          ),
        )

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接