我需要一个圆角TextField
,我可以这样做,但是它显示的是默认边框颜色。我尝试更改borderSide
,但无法更改颜色(颜色仍为黑色):
TextFormField(
decoration: InputDecoration(
prefixIcon: Icon(
Icons.person,
color: Colors.white,
),
border: OutlineInputBorder(
// width: 0.0 produces a thin "hairline" border
borderRadius: BorderRadius.all(Radius.circular(90.0)),
borderSide: BorderSide(color: Colors.white24)
//borderSide: const BorderSide(),
),
hintStyle: TextStyle(color: Colors.white,fontFamily: "WorkSansLight"),
filled: true,
fillColor: Colors.white24,
hintText: 'Password'),
),
我需要这个,并且我不需要焦点线,但是光标应该是白色的。我尝试更改border
参数中的所有内容,但仍然没有更改。
我想要:
我得到这个:
答案 0 :(得分:2)
创建透明边框:
final border = OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(90.0)),
borderSide: BorderSide(
color: Colors.transparent,
)
);
并在focusedBorder
和border
属性中使用它,还添加一个主题以设置光标并提示颜色:
Theme(
data: Theme.of(context).copyWith(
cursorColor: Colors.red,
hintColor: Colors.transparent,
),
child: TextFormField(
decoration: InputDecoration(
focusedBorder: border,
border: border,
prefixIcon: Icon(
Icons.person,
color: Colors.white,
),
hintStyle: TextStyle(
color: Colors.white, fontFamily: "WorkSansLight"),
filled: true,
fillColor: Colors.white24,
hintText: 'Password'),
),
),
答案 1 :(得分:2)
设置:
borderSide: BorderSide.none,
如:
TextFormField(
decoration: InputDecoration(
prefixIcon: Icon(
Icons.person,
color: Colors.white,
),
border: OutlineInputBorder(
// width: 0.0 produces a thin "hairline" border
borderRadius: BorderRadius.all(Radius.circular(90.0)),
borderSide: BorderSide.none,
//borderSide: const BorderSide(),
),
hintStyle: TextStyle(color: Colors.white,fontFamily: "WorkSansLight"),
filled: true,
fillColor: Colors.white24,
hintText: 'Password'),
),