web-dev-qa-db-ja.com

フラッターTextFieldの高さと幅を更新する方法は？

FlutterでTextFieldレイアウトの高さと幅をどのようにカスタマイズしますか？

flutterflutter-layout
20
Aravinth thiyagarajan

幅を調整するには、次のようにTextFieldウィジェットでContainerウィジェットをラップします。

new Container(              
  width: 100.0,
  child: new TextField()
)

TextFieldの高さになると、あなたが何を求めているのか本当にわかりませんが、TextStyleおよび/またはfontSizeを操作できるheightウィジェットを確実に見ることができます

new Container(              
  width: 100.0,
  child: new TextField(                                 
    style: new TextStyle(
      fontSize: 40.0,
      height: 2.0,
      color: Colors.black                  
    )
  )
)

heightのTextStyleは、プロパティ自体のコメントに従って、フォントサイズの乗数であることに注意してください。

フォントサイズの倍数としてのこのテキストスパンの高さ。

ルート[TextSpan]に適用される場合、この値は行の高さ、つまり後続のテキストベースライン間の最小距離をフォントサイズの倍数として設定します。

最後になりましたが、あなたはdecorationプロパティのTextFieldを見てみたいと思うかもしれません。

EDIT：TextFieldの内側のパディング/マージンを変更する方法

InputDecorationのdecorationおよびTextFieldプロパティをいじってみることができます。たとえば、次のようなことができます。

new TextField(                                
    decoration: const InputDecoration(
        contentPadding: const EdgeInsets.symmetric(vertical: 40.0),
    )
)
29
Mikolaj Kieres

コンテナでmarginプロパティを試すことができます。テキストフィールドをコンテナ内にラップし、マージンプロパティを調整します。

                      new Container(
                      margin: const EdgeInsets.only(right: 10, left: 10),
                      child: new TextField(

                        decoration: new InputDecoration(
                            hintText: 'username',
                            icon: new Icon(Icons.person)),
                      )),
1
shahana kareen