[英]How can a change the underline color of textField in flutter?
I have tried to define the Input decoration to change the color of underline of input TextField.我试图定义输入装饰以更改输入文本字段下划线的颜色。 But it's not working.但它不起作用。 can anyone suggest what am i missing here?谁能建议我在这里错过了什么?
Here is the Code snippet:这是代码片段:
decoration: InputDecoration(
hintText: 'Username',
hintStyle: TextStyle(color: Colors.white),
border: new UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white,
width: 1.0, style: BorderStyle.none ),
),
decoration: InputDecoration(
hintText: 'Username',
hintStyle: TextStyle(color: Colors.white),
enabledBorder: new UnderlineInputBorder(
borderSide: BorderSide(
color: Colors.white,
width: 1.0,
style: BorderStyle.none
),
),
),
Just change border to enabledBorder
.只需将边框更改为enabledBorder
。 Hope this help!希望这有帮助!
We have to use both enabledBorder
and focusedBorder
.我们必须同时使用enabledBorder
和focusedBorder
。
enabledBorder
: It will work when TextField
not having focus. enabledBorder
:当TextField
没有焦点时它会工作。focusedBorder
: It will work when TextField
has the focus. focusedBorder
:当TextField
获得焦点时它会起作用。enabledBorder: new UnderlineInputBorder(
borderSide: BorderSide(
color: Colors.black
),
),
// and:
focusedBorder: new UnderlineInputBorder(
borderSide: BorderSide(
color: Colors.black
),
),
You have to put widget hierarchy under MaterialApp .您必须将小部件层次结构放在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.**
));
}
}
Just used -:刚刚使用 -:
decoration: InputDecoration(
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.cyan),
),
),
it works for me :)这个对我有用 :)
You can wrap your TextField
in Theme
and change accentColor
like:您可以将TextField
包装在Theme
并更改accentColor
例如:
Theme(
data: Theme.of(context).copyWith(accentColor: Colors.red),
child: TextField(),
)
If you want change that blue line color, used this below code..it works如果你想改变蓝线颜色,使用下面的代码..它有效
focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey)
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,
),
)
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.