Flutter：下線のないHintTextでTextFieldを作成する方法は？

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

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

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

更新： 2020年4月のFlutter SDKの変更を反映するために承認された回答を更新しました。

上記の回答のいずれも、新しいフラッターSDKで機能します。Webとデスクトップのサポートを統合した後、このように個別に指定する必要があるためです。

TextFormField(
    cursorColor: Colors.black,
    keyboardType: inputType,
    decoration: new InputDecoration(
        border: InputBorder.none,
        focusedBorder: InputBorder.none,
        enabledBorder: InputBorder.none,
        errorBorder: InputBorder.none,
        disabledBorder: InputBorder.none,
        contentPadding:
            EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
        hintText: sLabel),
  )

このようにしてください：

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

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

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

フォーカスされた境界線をなしに変更する

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

以下は、より完全なコードを示す補足的な回答です。

  Container(
    decoration: BoxDecoration(
      color: Colors.tealAccent,
      borderRadius:  BorderRadius.circular(32),
    ),
    child: TextField(
      decoration: InputDecoration(
        hintStyle: TextStyle(fontSize: 17),
        hintText: 'Search your trips',
        suffixIcon: Icon(Icons.search),
        border: InputBorder.none,
        contentPadding: EdgeInsets.all(20),
      ),
    ),
  ),

ノート：

• 暗い背景（コードは表示されていません）はColors.tealです。
• InputDecorationfilledとfillColorプロパティも持っていますが、コーナー半径を設定することができなかったため、代わりにコンテナを使用しました。

私は境界線の半径を与える他の答えは見つからなかった、あなたは単にこのようにそれを行うことができ、ネストされていません Container

  TextField(
    decoration: InputDecoration(
      border: OutlineInputBorder(
        borderSide: BorderSide.none,
        borderRadius: BorderRadius.circular(20),
      ),
    ),
  );

TextFieldフラッターコントロールを使用していました。以下のメソッドを使用してユーザーが入力した入力を取得しました。

onChanged:(value){
}

decoration: InputDecoration(
 border:OutLineInputBorder(
 borderSide:BorderSide.none
 bordeRadius: BordeRadius.circular(20.0)
 )
)