使软键盘与其他小部件重叠 - Flutter

Question

如何制作软键盘 covers/overlaps 其他小部件而不是将它们向上推导致 UI 疯狂和像素溢出？

我试过有无 Stack()

我试过 resizeToAvoidBottomInset: false,

但是还是没有结果！

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Stack(
          children: <Widget>[
            ClipPath(
              clipper: CustomBackgroundClipper(),
              child: Container(
                height: 220.0,
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                    colors: [
                      gradientStart, 
                      gradientEnd
                    ],
                  ),
                ),
              ),
            ),
            Container(
              height: MediaQuery.of(context).size.height,
              child: HomeTopContainer(),
            ),
          ],
        ),
      ),
    );
  }
}

Answer 1

我不知道你的 HomeTopContainer 里面有什么，但像这样，它对我有用：

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Stack(
        children: <Widget>[
          ClipPath(
            child: Container(
              height: 220.0,
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  colors: [Colors.green, Colors.blue],
                ),
              ),
            ),
          ),
          Container(
            height: MediaQuery.of(context).size.height,
            child: Align(
              alignment: Alignment.bottomCenter,
              child: Column(
                children: <Widget>[
                  Spacer(),
                  Container(
                    height: 30,
                    color: Colors.red,
                  ),
                  TextField()
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Answer 2

我建议完全删除 Align 小部件并将 mainAxisAlignment 和 crossAxisAlignment 属性添加到您的 Column 小部件。

Answer 3

只需在脚手架中添加： resizeToAvoidBottomInset: false,

使软键盘与其他小部件重叠 - Flutter

Make soft keyboard overlaps other widgets - Flutter

soft-keyboard

dart

flutter