Flutter- SingleChildScrollview在键盘弹出窗口上不滚动

时间:2020-10-08 03:22:59

标签: flutter flutter-layout flutter-dependencies flutter-animation

我正在尝试集成注册页面。在键盘弹出窗口上,它覆盖了底部的一些输入字段。已经实现了Singlechildscrollview。键盘弹出时它不会调整。尝试使用resizeToAvoidBottomPadding和其他解决方案,但不走运。请先帮助谢谢您的帮助

class _EnterUserDetailsWidgetState extends State<EnterUserDetailsWidget> {
  @override
  Widget build(BuildContext context) {
    final String assetName = 'assets/images/app_logo.svg';
    final String pageBg = 'assets/images/user_auth_bg.png';
    final String app_logo = 'assets/images/fram_collection_logo.png';
    final String phoneIcon = 'assets/images/farm.png';
    final _nameController = TextEditingController();
    final _phoneController = TextEditingController();
    final _emailController = TextEditingController();
    final _formKey = GlobalKey<FormState>();

    final FocusNode _nameFocusNode = FocusNode();
    final FocusNode _emailFocusNode = FocusNode();
    final FocusNode _phoneNumberNode = FocusNode();
    final FocusNode _dummy = FocusNode();
    final itemSpacing = 15.0;

    return Scaffold(
      resizeToAvoidBottomPadding: false,
      body: Stack(
        children: [
          Image(
            image: AssetImage(pageBg),
            fit: BoxFit.fill,
            height: double.infinity,
            width: double.infinity,
          ),
          Container(
            height: double.maxFinite,
            padding: EdgeInsets.all(10),
            child: SingleChildScrollView(
              physics: AlwaysScrollableScrollPhysics(),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Padding(
                    padding: const EdgeInsets.only(top: 50, bottom: 50),
                    child: Image(
                      height: 170,
                      filterQuality: FilterQuality.high,
                      image: AssetImage(app_logo),
                      fit: BoxFit.fitWidth,
                    ),
                  ),
                  TextFormField(
                      autofocus: true,
                      decoration: inputDecorationFeild(
                          hintText: "Email",
                          labelText: "Enter Email",
                          textFeildIcon: FarmCollection.email)),
                  TextFormField(
                      autofocus: true,
                      decoration: inputDecorationFeild(
                          hintText: "Email",
                          labelText: "Enter Email",
                          textFeildIcon: FarmCollection.email)),
                  TextFormField(
                      autofocus: true,
                      decoration: inputDecorationFeild(
                          hintText: "Email",
                          labelText: "Enter Email",
                          textFeildIcon: FarmCollection.email)),
                  TextFormField(
                      autofocus: true,
                      decoration: inputDecorationFeild(
                          hintText: "Email",
                          labelText: "Enter Email",
                          textFeildIcon: FarmCollection.email)),
                  TextFormField(
                      autofocus: true,
                      decoration: inputDecorationFeild(
                          hintText: "Email",
                          labelText: "Enter Email",
                          textFeildIcon: FarmCollection.email)),
                  curvedButtonGreen(
                    buttonText: "Submit",
                    onClick: () async {
                      await Navigator.of(context).push(
                        MaterialPageRoute(
                          builder: (context) => OTPverificationWidget(),
                        ),
                      );
                    },
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  _fieldFocusChange(BuildContext context, FocusNode nextFocus) {
    // currentFocus.unfocus();
    FocusScope.of(context).requestFocus(nextFocus);
  }
}

1 个答案:

答案 0 :(得分:0)

我已修复并与您分享完整代码。
因为我没有资产文件和某些组件,所以我将其替换为Container或进行了更改。
主要更改点是'resizeToAvoidBottomPadding:true'或将其删除。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final String assetName = 'assets/images/app_logo.svg';
    final String pageBg = 'assets/images/user_auth_bg.png';
    final String app_logo = 'assets/images/fram_collection_logo.png';
    final String phoneIcon = 'assets/images/farm.png';
    final _nameController = TextEditingController();
    final _phoneController = TextEditingController();
    final _emailController = TextEditingController();
    final _formKey = GlobalKey<FormState>();

    final FocusNode _nameFocusNode = FocusNode();
    final FocusNode _emailFocusNode = FocusNode();
    final FocusNode _phoneNumberNode = FocusNode();
    final FocusNode _dummy = FocusNode();
    final itemSpacing = 15.0;

    return Scaffold(
      resizeToAvoidBottomPadding: true,
      body: Stack(
        children: [
          Container(height: 200),
          Container(
            height: double.maxFinite,
            padding: EdgeInsets.all(10),
            child: SingleChildScrollView(
              physics: AlwaysScrollableScrollPhysics(),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Padding(
                    padding: const EdgeInsets.only(top: 50, bottom: 50),
                    child: Container(height: 170),
                    // child: Image(
                    //   height: 170,
                    //   filterQuality: FilterQuality.high,
                    //   image: AssetImage(app_logo),
                    //   fit: BoxFit.fitWidth,
                    // ),
                  ),
                  TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      hintText: "Email",
                      labelText: "Enter Email",
                    ),
                  ),
                  TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      hintText: "Email",
                      labelText: "Enter Email",
                    ),
                  ),
                  TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      hintText: "Email",
                      labelText: "Enter Email",
                    ),
                  ),
                  TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      hintText: "Email",
                      labelText: "Enter Email",
                    ),
                  ),
                  TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      hintText: "Email",
                      labelText: "Enter Email",
                    ),
                  ),
                  // curvedButtonGreen(
                  //   buttonText: "Submit",
                  //   onClick: () async {
                  //     // await Navigator.of(context).push(
                  //     //   MaterialPageRoute(
                  //     //     builder: (context) => OTPverificationWidget(),
                  //     //   ),
                  //     // );
                  //   },
                  // ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  _fieldFocusChange(BuildContext context, FocusNode nextFocus) {
    // currentFocus.unfocus();
    FocusScope.of(context).requestFocus(nextFocus);
  }
}