TextFormField borderSide 颜色不起作用

Question

我正在尝试在边框上添加颜色，但它不起作用，请检查我哪里做错了。

这是我的代码

  passwordtext() {
    return Container(
        width: MediaQuery.of(context).size.width * 0.9,
        child: Focus(
          focusNode: myFocusNode,
          child: TextFormField(
            decoration: InputDecoration(
                focusedBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.all(Radius.circular(10.0)),
                    borderSide: BorderSide(color: HexColor("#d8d6de"))),
                border: OutlineInputBorder(
                    borderRadius: BorderRadius.all(Radius.circular(10.0)),
                    borderSide: BorderSide(color: Colors.red)),
                
          ),
        ));
  }

当我点击我想要的字段边框颜色时，我也没有点击它

Answer 1

试试这个

 Container(
      margin: const EdgeInsets.all(10.0),
      padding: const EdgeInsets.all(2.0),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.blueAccent)
      ),
      child: Text('MyBorder'),
    )

Answer 2

您需要在 InputDecoration

上致电 enabledBorder

TextFormField(
          decoration: InputDecoration(
            focusedBorder: OutlineInputBorder(
                borderRadius: BorderRadius.all(Radius.circular(10.0)),
                borderSide: BorderSide(color: Colors.green)),
            border: OutlineInputBorder(
                borderRadius: BorderRadius.all(Radius.circular(10.0)),
                borderSide: BorderSide(color: Colors.red)),
            enabledBorder: OutlineInputBorder(
                borderRadius: BorderRadius.all(Radius.circular(10.0)),
                borderSide: BorderSide(color: Colors.green)), // your color
          ),
        ),

更多关于InputDecoration

Answer 3

试试下面的代码希望对你有帮助。参考启用边框 here

 Container(
            width: MediaQuery.of(context).size.width * 0.9,
            child: Focus(
              focusNode: myFocusNode,
              child: TextFormField(
                decoration: InputDecoration(
                  focusedBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.all(
                      Radius.circular(10.0),
                    ),
                    borderSide: BorderSide(color: Colors.black),
                  ),
                  enabledBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.all(
                      Radius.circular(10.0),
                    ),
                    borderSide: BorderSide(color: Colors.red),
                  ),
                ),
              ),
            ),
          ),

焦点之前的结果屏幕-

焦点后的屏幕 ->

Answer 4

像下面给出的代码一样更改您的输入装饰（对于 TextFormField）

decoration: InputDecoration(
                  focusedBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(10.0)),
                      borderSide: BorderSide(color: Color(0xffd8d6de))),
                  disabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(10.0)),
                      borderSide: BorderSide(color: Color(0xffd8d6de))),
                  enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(10.0)),
                      borderSide: BorderSide(color: Color(0xffd8d6de))),
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(10.0)),
                      borderSide: BorderSide(color: Color(0xffd8d6de))),
                ),

为 focusedBorder、disabledBorder 和 enabledBorder 赋予相同的属性，这样每次 textformfiled 看起来都一样。

谢谢

Answer 5

您只需要在 InputDecoration 上添加 enabledBorder 将其添加到您的代码中

enabledBorder: OutlineInputBorder(
            borderRadius: BorderRadius.all(Radius.circular(10.0)),
            borderSide: BorderSide(color: Colors.blue),
),

TextFormField borderSide 颜色不起作用

TextFormField borderSide color is not working

flutter

flutter-layout

border

textfield