web-dev-qa-db-ja.com

キーボードで非表示のFlutter TextFormField

注：ImはNavigator.of（context）.Push to Push ModalRouteを使用しています

こんにちは、本文にModalRouteがTextFormFieldであるページがありますが、キーボードが表示されたときに、入力がキーボードで非表示になっています。これを修正するにはどうすればよいですか？

enter image description here

return Container(
      child: ListView(
          children: <Widget>[
            //other widget
            SizedBox(height: _qtyAnimation.value),
            Row(
              children: <Widget>[
                Expanded(
                  child: Text(
                    "Jumlah",
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                ),
                SizedBox(
                  width: 145.0,
                  child: TextFormField(
                    focusNode: _qtyFocusNode,
                    controller: qty,
                    keyboardType: TextInputType.number,
                    textAlign: TextAlign.center,
                    decoration: InputDecoration(
                      contentPadding: EdgeInsets.all(0.0),
                      prefixIcon: IconButton(
                        icon: Icon(Icons.remove),
                        onPressed: () {},
                      ),
                      border: OutlineInputBorder(
                        borderSide:
                            BorderSide(color: Colors.grey, width: 0.1),
                      ),
                      suffixIcon: IconButton(
                        icon: Icon(Icons.add),
                        onPressed: () {},
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
    );

それは私のコードです、私はfocusnodeなどで試します、それでも同じ結果が私を助けてください

dartflutterflutter-layout
14
RIFAL

テキストフィールドの下部にあるこのパディングで問題を解決してくれてありがとう

Padding(
              padding: EdgeInsets.only(
                  bottom: MediaQuery.of(context).viewInsets.bottom)

と馬の逆リスト

1
RIFAL

resizeToAvoidBottomInsetウィジェット内でfalseをScaffoldに設定します。

resizeToAvoidBottomPaddingは廃止されることに注意してください。

Scaffold( resizeToAvoidBottomInset: false, ...)
1
JunSik CHOI

これには（現在）いくつかの方法があります：

あなたはより良い解決策のためにこれを読むことができます： テキストフィールドを選択すると、キーボードがそれに移動します

内部Scafold() add： _resizeToAvoidBottomPadding: false,_

また、あなたがすることができます、

TextWidgetを SingleChildScrollView() でラップします。これにより、キーボードが表示されたときにスクロールする柔軟性が得られます。

0
Blasanka

私にとってうまくいったのは、ドキュメントとここにあるヒントを組み合わせることでした。それは、LayoutBuilder、SingleChildScrollView、Padding（ボトムハックあり）、最後にConstrainedBox（Expandedを使用）を使用します。これらを組み合わせることにより、列内の拡張ウィジェットで動作します。

ドキュメント（LayoutBuilderの提供元）： https://api.flutter.dev/flutter/widgets/SingleChildScrollView-class.html

構造

 return Scaffold(
      resizeToAvoidBottomInset: false,
      resizeToAvoidBottomPadding: false,`

body: SafeArea(
        child: Container(
          child: LayoutBuilder(builder:
              (BuildContext context, BoxConstraints viewportConstraints) {
            return SingleChildScrollView(
              reverse: true,
              child: Padding(
                padding: EdgeInsets.only(bottom: bottom),
                child: ConstrainedBox(
                  constraints: BoxConstraints(
                      minHeight: viewportConstraints.maxHeight,
                      maxHeight: viewportConstraints.maxHeight),
                  child: Column(
0
jacvalle