Flutter的TextField在設(shè)置高度后，如果布局高度小于它的默認(rèn)高度择葡，那么它的文本在垂直居中上就會有問題穷遂。
網(wǎng)上的解決方案很多（最簡單的解決方案在最下面晾虑，耐心看）：
有設(shè)置 contentPadding的：
decoration: InputDecoration(
contentPadding: EdgeInsets.all(0),
),
//或者
decoration: InputDecoration(
contentPadding: EdgeInsets.symmetric(vertical: 0),
),
設(shè)置對其方式textBaseline的：
TextField(
style: TextStyle(textBaseline: TextBaseline.alphabetic),
)
///如果需要全局配置 可以使用下面方式
ThemeData(
textTheme: TextTheme(
subhead: TextStyle(
textBaseline: TextBaseline.alphabetic,
),
),
),
設(shè)置 TextField 里面的 decoration 對應(yīng)的 InputDecoration 中的 boder 參數(shù)的：
decoration: InputDecoration(
// textfield 內(nèi)文字居中設(shè)置 -------------- start
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(width: 0, color: Colors.transparent)),
disabledBorder: OutlineInputBorder(
borderSide: BorderSide(width: 0, color: Colors.transparent)),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(width: 0, color: Colors.transparent)),
border: OutlineInputBorder(
borderSide:
BorderSide(width: 0, color: Colors.transparent)), // 不需要輸入框下劃線
contentPadding:
EdgeInsets.only(left: ScreenTool.dp(24)), // 輸入里面輸入文字內(nèi)邊距設(shè)置
// textfield 內(nèi)文字居中設(shè)置 -------------- end
我個人推薦的方式是使用isCollapsed: true來修正：
TextField(
decoration: InputDecoration(
isCollapsed: true,
...
)
)
搞定辛臊。
