文本字段打开键盘颤动

Question

正如您从the video I posted 看到的，我对下面的文本字段有一个约束问题。一旦我按下，键盘就会打开，但它会重叠并破坏整个视图。我该如何解决和管理问题？

问题可能是 qrima 的尺寸设置不当。

他们建议我管理 Scaffold 中的所有内容，然后设置 resizeToAvoidBottomInset: false 但我没有注意到任何改进

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    _buttonHeight = size.height * .05;

    double splitPoint = size.height / 7;

    return Scaffold(
        resizeToAvoidBottomInset: false,
        body: Stack(
            children: [FutureBuilder<UserData>(
          future: contentManager.getUserData(),
          builder: (context, AsyncSnapshot<UserData> snapUserData) {
            if (snapUserData.hasError)
              return Container(
                child: Center(
                  child: Text("There was some error"),
                ),
              );
            if (snapUserData.connectionState != ConnectionState.done)
              return Container(
                child: Center(
                  child: CircularProgressIndicator(valueColor: new AlwaysStoppedAnimation<Color>(appColors.yellow)),
                ),
              );
            return Stack(
              alignment: AlignmentDirectional.center,
              children: [
                // SFONDO
                Positioned(
                  bottom: 0,
                  child: Container(
                    height: size.height,
                    width: size.width,
                    color: appColors.primaryColor,
                  ),
                ),
                // TITOLO
                Positioned(
                  top: size.height * .05,
                  child: Text(
                    localization.showQR,
                    style: Theme.of(context).primaryTextTheme.headline5.copyWith(
                      color: appColors.green,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Positioned(
                  top: size.height * .10,
                  width: size.width * .8,
                  child: qrCodeHolder,
                ),
                Positioned(
                  bottom: size.height * .18,
                  width: size.width * .8,
                  child: AutoSizeText(
                    localization.home_subLabel,
                    textAlign: TextAlign.center,
                    maxLines: 1,
                    style: Theme.of(context).primaryTextTheme.headline5.copyWith(
                      color: appColors.green,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Positioned(
                  bottom: size.height * .08,
                  width: size.width * .7,
                  height: size.height * .05,
                  child: TextField(
                    inputFormatters: [
                      new LengthLimitingTextInputFormatter(11),
                    ],
                    decoration: InputDecoration(
                      filled: true,
                      fillColor: Colors.white,
                      focusedBorder: OutlineInputBorder(
                        borderSide: BorderSide(color: Colors.white),
                      ),
                      enabledBorder: UnderlineInputBorder(
                        borderSide: BorderSide(color: Colors.white),
                      ),
                    ),
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontSize: 18.0,
                      //height: 2.0,
                      color: Colors.black,
                    ),
                  ),
                ),
              ],
            );
          }),
    ]),
    );
  }
}

Answer 1

使用 SingleChildScrollView() 小部件包装整个内容，如下所示：

Scaffold(
  body: SingleChildScrollView( 
    child: Stack( 

    )
  )
)