将用户详细信息显示在屏幕的相等部分

Question

我正在将我的用户数据传递到下一个屏幕，我想将数据显示到相同的屏幕，我尝试了不同的方法但能够找到解决方案。容器（ child：列（ mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment：CrossAxisAlignment.start，

       children: [ Row(
           
            children: [

              commonTitle(context, "Username : ", 20, Colors.black),
              Text('${username}', textAlign: TextAlign.left, style:

TextStyle(fontSize:20),),]),

              Row(
                children:[

              Text("Email : ",style: TextStyle(fontSize: 20,fontWeight: FontWeight.bold)),
              Text('${email}',style: TextStyle(fontSize:20),),]),

              Row(
                  children:[

              commonTitle(context, "Contact : ", 20, Colors.black),
              Text('${contact}',style: TextStyle(fontSize:20),),]),

              Row(
                  children:[


              commonTitle(context, "D.O.B : ", 20, Colors.black),
              Text('${dateController}',style: TextStyle(fontSize:20),),]),

              Row(
                  children:[

              commonTitle(context, "Department : ", 20, Colors.black),
              Text('${selectedValue}',style: TextStyle(fontSize:20),),]),

    Row(
        children:[
                commonTitle(context, "Hobbie : ", 20, Colors.black),
                Text('${selectedHobbies.join(",")}',style: TextStyle(fontSize:20),),]),

    Row(
        children:[

                commonTitle(context, "Age : ", 20, Colors.black),
                Text('${range.start.toInt()}-${range.end.toInt()}',style: TextStyle(fontSize:20),),]),
    Row(
        children:[


                commonTitle(context, "Gender : ", 20, Colors.black),
                Text('${selectedGender}',style: TextStyle(fontSize:20),),]),

    Row(
        children:[


                commonTitle(context, "Address : ", 20, Colors.black),
                Container(
                  width: MediaQuery.of(context).size.width/2,
                  child: Text('${add}',style: TextStyle(fontSize:20)),
                ),]),






     ]),
    )[here is the image of my output ][1]

Answer 1

在您的新页面脚手架中使用此格式

 Padding(
      padding: const EdgeInsets.all(8.0),
      child:   Container(
        height: MediaQuery.of(context).size.height, //height of 
        width: MediaQuery.of(context).size.width,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Text('Your Text'),  
            Text('Your Text'),
            Text('Your Text'),
          ],
        ),
      ),
    ),

Answer 2

您的图片未显示。我假设您可以通过将小部件包装在 Flex 中并指定它们必须占据容器的哪个部分来实现相等的部分。但是，如果您添加一个可执行代码片段或您想要实现的演示，我会处理它并通过添加代码来编辑这个答案。

将用户详细信息显示在屏幕的相等部分

Show the user details in to equal parts to the screen

user-input

flutter

flutter-test

flutter-dependencies

flutter-layout