按钮未显示,溢出错误为120

时间:2019-01-19 11:26:58

标签: flutter flutter-layout

按钮未显示在我的表单页面中,出现溢出错误

Widget build(BuildContext context) {
     return new Scaffold(
      appBar: new AppBar(
        centerTitle: true,
        backgroundColor: Colors.redAccent.shade200,
      ),
      body: new Container(
        alignment: Alignment.topCenter,
        child: new ListView(
          padding: const EdgeInsets.all(2.0),
          children: <Widget>[
            new Image.asset(
              'assets/images/odddd.png',
              height: 85.0,
              width: 75.0,
            ),
            new Container(
              margin: const EdgeInsets.all(3.0),
              height: 245.0,
              width: 290.0,
              color: Colors.grey.shade300,
              child: new Column(
                children: <Widget>[
                  new TextField(
                    controller: firstNameCtrlr,
                    keyboardType: TextInputType.text,
                    decoration: new InputDecoration(
                        labelText: 'Surname',
                        hintText: 'Paul',
                        icon: new Icon(Icons.person_add)),
                  ),

                  new TextField(
                      controller: lastNameCtrlr,
                      keyboardType: TextInputType.text,
                      decoration: new InputDecoration(
                          labelText: 'name',
                          hintText: 'Ebuka',
                          icon: new Icon(Icons.person_pin_circle))),
                  new TextField(
                      controller: stateController,
                      keyboardType: TextInputType.text,
                      decoration: new InputDecoration(
                          labelText: 'State of Recidence',
                          hintText: 'Osun, Chicago e.t.c',
                          icon: new Icon(Icons.location_city))),

                   new TextField(
                      controller: languageController,
                      keyboardType: TextInputType.text,
                      decoration: new InputDecoration(
                          labelText: 'Official Language',
                          hintText: 'English, French',
                          icon: new Icon(Icons.language))),

                     new TextField(
                      controller: ageController,
                      keyboardType: TextInputType.number,
                      decoration: new InputDecoration(
                          labelText: 'Age',
                          hintText: 'e.g 70, 60',
                          icon: new Icon(Icons.person))),

                  new Padding(padding: new EdgeInsets.all(5.2)),

                  //calculate button
                  new Container(
                    alignment: Alignment.center,
                    child: new RaisedButton(
                     onPressed: () {},
                      color: Colors.pinkAccent,
                      child: new Text('Calculate'),
                      textColor: Colors.white,
                    ),

2 个答案:

答案 0 :(得分:0)

使用ListView()代替Column()可能有效。

          ListView(
            children: <Widget>[
              new TextField(
                controller: firstNameCtrlr,
                keyboardType: TextInputType.text,
                decoration: new InputDecoration(
                    labelText: 'Surname',
                    hintText: 'Paul',
                    icon: new Icon(Icons.person_add)),
              ),

              new TextField(
                  controller: lastNameCtrlr,
                  keyboardType: TextInputType.text,
                  decoration: new InputDecoration(
                      labelText: 'name',
                      hintText: 'Ebuka',
                      icon: new Icon(Icons.person_pin_circle))),
              new TextField(
                  controller: stateController,
                  keyboardType: TextInputType.text,
                  decoration: new InputDecoration(
                      labelText: 'State of Recidence',
                      hintText: 'Osun, Chicago e.t.c',
                      icon: new Icon(Icons.location_city))),

               new TextField(
                  controller: languageController,
                  keyboardType: TextInputType.text,
                  decoration: new InputDecoration(
                      labelText: 'Official Language',
                      hintText: 'English, French',
                      icon: new Icon(Icons.language))),

                 new TextField(
                  controller: ageController,
                  keyboardType: TextInputType.number,
                  decoration: new InputDecoration(
                      labelText: 'Age',
                      hintText: 'e.g 70, 60',
                      icon: new Icon(Icons.person))),

              new Padding(padding: new EdgeInsets.all(5.2)),

              //calculate button
              new Container(
                alignment: Alignment.center,
                child: new RaisedButton(
                 onPressed: () {},
                  color: Colors.pinkAccent,
                  child: new Text('Calculate'),
                  textColor: Colors.white,
                ),

答案 1 :(得分:0)

尝试此代码。 我将“列”(姓Paul TextField上方)更改为ListView。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: new AppBar(
          centerTitle: true,
          backgroundColor: Colors.redAccent.shade200,
        ),
        body: new Container(
          alignment: Alignment.topCenter,
          child: new ListView(
            padding: const EdgeInsets.all(2.0),
            children: <Widget>[
              new Image.asset(
                'assets/images/odddd.png',
                height: 85.0,
                width: 75.0,
              ),
              new Container(
                margin: const EdgeInsets.all(3.0),
                height: 245.0,
                width: 290.0,
                color: Colors.grey.shade300,
                child: new ListView(
                  children: <Widget>[
                    new TextField(
                      keyboardType: TextInputType.text,
                      decoration: new InputDecoration(
                          labelText: 'Surname',
                          hintText: 'Paul',
                          icon: new Icon(Icons.person_add)),
                    ),
                    new TextField(
                        keyboardType: TextInputType.text,
                        decoration: new InputDecoration(
                            labelText: 'name',
                            hintText: 'Ebuka',
                            icon: new Icon(Icons.person_pin_circle))),
                    new TextField(
                        keyboardType: TextInputType.text,
                        decoration: new InputDecoration(
                            labelText: 'State of Recidence',
                            hintText: 'Osun, Chicago e.t.c',
                            icon: new Icon(Icons.location_city))),

                    new TextField(
                        keyboardType: TextInputType.text,
                        decoration: new InputDecoration(
                            labelText: 'Official Language',
                            hintText: 'English, French',
                            icon: new Icon(Icons.language))),

                    new TextField(
                        keyboardType: TextInputType.number,
                        decoration: new InputDecoration(
                            labelText: 'Age',
                            hintText: 'e.g 70, 60',
                            icon: new Icon(Icons.person))),

                    new Padding(padding: new EdgeInsets.all(5.2)),

                    //calculate button
                    new Container(
                      alignment: Alignment.center,
                      child: new RaisedButton(
                        onPressed: () {},
                        color: Colors.pinkAccent,
                        child: new Text('Calculate'),
                        textColor: Colors.white,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

enter image description here