Flutter Form Field 浮动在顶部

问题描述

我遇到了颤振形式的问题。

基本上我有 3 个简单的行添加到堆栈中。最后一个包含一个表单。在其下方有 Adob​​e XD 的“固定”元素，但包含表单的行浮动在屏幕顶部......我希望它排列在前两行下方。

您可以在下面的屏幕截图中看到问题。表单位于图像的顶部，但我希望它位于我想用功能表单字段替换的 2 条白线之上。

我哪里出错了？我已将表单放在单独的小部件中。

LoginPage.dart

Widget build(BuildContext context) {
    return Container(
      decoration: Boxdecoration(
          gradient: LinearGradient(
              begin: Alignment.topRight,end: Alignment.bottomLeft,stops: [
            0.4,1
          ],colors: [
            Colors.black,Color(0xff7d060b),])),child: Scaffold(
        resizetoAvoidBottomInset: false,backgroundColor: Colors.transparent,body: SafeArea(
          child: Stack(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.center,children: [
                  /* Image.asset(
                  'assets/images/logo.png',height: 100,width: 250,),*/
                  Image.asset(
                    'assets/images/fewturelogo.png',height: 50,Container(
                      padding: const EdgeInsets.only(left: 30.0),child: IconButton(
                        color: Colors.white,icon: const Icon(Icons.not_listed_location_rounded),onpressed: () {
                          print('Hello');
                          showDialog(
                              context: context,barrierdismissible: false,// user must tap button!
                              builder: (BuildContext context) {
                                return AlertDialog(
                                  title: Text('Was ist Rentalsplanet?'),content: new SingleChildScrollView(
                                    child: new ListBody(children: [
                                      new Text(
                                          'Hier erscheinen @R_72_4045@ionen über Rentalsplanet')
                                    ]),actions: [
                                    new ElevatedButton(
                                        child: Text('Alles klar!'),onpressed: () {
                                          Navigator.of(context).pop();
                                        })
                                  ],);
                              });
                        },)),],Row(
                mainAxisAlignment: MainAxisAlignment.center,children: [
                  Container(
                    margin: const EdgeInsets.only(top: 70.0),child: Image.asset(
                      'assets/images/SplashImageLogin.png',scale: 1.1,Row(children: [
                Container(
                  margin: const EdgeInsets.only(top: 70.0),child: SizedBox(width: 100,child: LoginForm()),)
              ]),);

LoginForm.dart

Widget build(BuildContext context) {
    // Build a Form widget using the _formKey created above.
    return Form(
      key: _formKey,child: Column(
        children: <Widget>[
          new Flexible(
            child: TextFormField(
              // The validator receives the text that the user has entered.
              validator: (value) {
                if (value == null || value.isEmpty) {
                  return 'Please enter some text';
                }
                return null;
              },ElevatedButton(
            onpressed: () {
              // Validate returns true if the form is valid,or false otherwise.
              if (_formKey.currentState.validate()) {
                // If the form is valid,display a snackbar. In the real world,// you'd often call a server or save the @R_72_4045@ion in a database.
                ScaffoldMessenger.of(context)
                    .showSnackBar(SnackBar(content: Text('Processing Data')));
              }
            },child: Text('Submit'),// Add TextFormFields and ElevatedButton here.
        ],);
  }

解决方法

因为您正在使用堆栈...堆栈不是一件容易使用的事情，在您的情况下，如果您不必使用它，请将其替换为 Column 并且您的问题将得到解决。 如果在 Stack 或fractionaloffset 或 Transform.translate 中没有对齐会帮助你 Transform.translate 将解决您的问题，但可能会导致一些响应问题