如何更改 flutter 中 textField 的下划線顏色？

Question

我試圖定義輸入裝飾以更改輸入文本字段下划線的顏色。 但它不起作用。 誰能建議我在這里錯過了什么？

這是代碼片段：

decoration: InputDecoration(
    hintText: 'Username',
    hintStyle: TextStyle(color: Colors.white),
    border: new UnderlineInputBorder(
                                    borderSide: BorderSide(color: Colors.white, 
                                      width: 1.0, style: BorderStyle.none ),
    ),

Answer 1

decoration: InputDecoration(
  hintText: 'Username',
  hintStyle: TextStyle(color: Colors.white),
  enabledBorder: new UnderlineInputBorder(
    borderSide: BorderSide(
      color: Colors.white, 
      width: 1.0, 
      style: BorderStyle.none 
    ),
  ),
),

只需將邊框更改為enabledBorder 。 希望這有幫助！

Answer 2

我們必須同時使用enabledBorder和focusedBorder 。

• enabledBorder ：當TextField沒有焦點時它會工作。
• focusedBorder ：當TextField獲得焦點時它會起作用。

enabledBorder: new UnderlineInputBorder(
  borderSide: BorderSide(
    color: Colors.black
  ),
),
// and:
focusedBorder: new UnderlineInputBorder(
  borderSide: BorderSide(
    color: Colors.black
  ),
),

Answer 3

您必須將小部件層次結構放在MaterialApp下。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        title: 'Flutter WebView Demo',
        theme: new ThemeData(
          primarySwatch: Colors.blue,
        ),
          home: new Container(
             **//put widget here.**
        ));
  }
}

Answer 4

剛剛使用 -：

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

這個對我有用 ：）

Answer 5

您可以將TextField包裝在Theme並更改accentColor例如：

Theme(
  data: Theme.of(context).copyWith(accentColor: Colors.red),
  child: TextField(),
)

Answer 6

如果你想改變藍線顏色，使用下面的代碼..它有效

focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey)

Answer 7

 child: TextField(

                  controller: email,
                  enabled: true,
                  keyboardType: TextInputType.emailAddress,
                  decoration: InputDecoration(

                    filled: true,
                    fillColor: Color(0xFFF2F2F2),
                    enabledBorder: new OutlineInputBorder(
                        borderSide: new BorderSide(color: Colors.orange)),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Colors.orange),

                    ),
                    hintText: ' Email ',

                    icon: Icon(
                      Icons.email,
                      color: Colors.orange,
                      size: 30.0,
                    ),


                  )

                )