web-dev-qa-db-ja.com

Flutter：HintTextを使用して下線を付けずにTextFieldを作成する方法

これは私が作ろうとしているものです：

enter image description here

テキストフィールドのFlutterドキュメント（ https://flutter.io/text-input/ ）では、nullを装飾に渡すことで下線を削除できると書かれています。ただし、これによりヒントテキストも削除されます。

テキストフィールドがフォーカスされているかどうかに関係なく、下線は必要ありません。

UPDATE：明らかにこれは

new InputDecoration.collapsed(...),

境界線を描画せずにヒントを保持します。

flutter
48
TeabaggingSanta

次のようにします：

TextField(
  decoration: new InputDecoration.collapsed(
    hintText: 'Username'
  ),
),

または、アイコンなど他のものが必要な場合は、InputBorder.noneで境界線を設定します

InputDecoration(
    border: InputBorder.none,
    hintText: 'Username',
  ),
),
129
Made Baruna

フォーカスされたボーダーをなしに変更します

TextField(
      decoration: new InputDecoration(
          border: InputBorder.none,
          focusedBorder: InputBorder.none,
          contentPadding: EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
          hintText: 'Subject'
      ),
    ),
0
Sarthak Singhal