首页 > 解决方案 > 如何为 ListView 制作包装内容

问题描述

我需要使用表单输入字段进行对话框,当我使用列内容适合屏幕时,但是当我尝试键入值时,它会隐藏下面的输入字段并提交按钮。为了解决这个问题,我只知道一个替换列的解决方案使用 listview 和作品,它可以让我滚动,但内容不适合屏幕。
如何使列表视图中的内容适合屏幕?
这是我的完整代码

import 'package:devaayanam/Confi.dart';
import 'package:flutter/material.dart';

class BookPujaDialogContent extends StatefulWidget {
  BookPujaDialogContent({Key key}) : super(key: key);

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

class _BookPujaDialogContentState extends State<BookPujaDialogContent> {
  final _formKey =GlobalKey<FormState>();
  @override
  Widget build(BuildContext context) {
    return  Container(

      child: Form(
        key: _formKey,
        child: Column(
          mainAxisSize: MainAxisSize.min,

          children: <Widget>[
            TextFormField(
              decoration: InputDecoration(
                  labelText: Confi.TEMPLENAME
              ),
              validator: (value) {
                if (value.isEmpty) {
                  return 'Please enter '+Confi.TEMPLENAME;
                }
                return null;
              },
            ),
            TextFormField(
              decoration: InputDecoration(
                  labelText: Confi.DEITY
              ),
              validator: (value) {
                if (value.isEmpty) {
                  return 'Please enter '+Confi.DEITY;
                }
                return null;
              },
            ),
            TextFormField(
              decoration: InputDecoration(
                  labelText: Confi.BN
              ),
              validator: (value) {
                if (value.isEmpty) {
                  return 'Please enter '+Confi.BN;
                }
                return null;
              },
            ),
            TextFormField(
              decoration: InputDecoration(
                  labelText: Confi.STAR
              ),
              validator: (value) {
                if (value.isEmpty) {
                  return 'Please enter '+Confi.STAR;
                }
                return null;
              },
            ),
            Container(
              margin: EdgeInsets.only(top: 20),
              child: RaisedButton(

                onPressed: () {
                  // Validate returns true if the form is valid, or false
                  // otherwise.
                  if (_formKey.currentState.validate()) {
                    // If the form is valid, display a Snackbar.
                    Scaffold.of(context)
                        .showSnackBar(SnackBar(content: Text('Processing Data')));
                  }
                },
                textColor: Colors.white,
                padding: const EdgeInsets.all(0.0),
                shape:RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
                child: Container(
                  decoration: const BoxDecoration(
                      gradient: LinearGradient(
                      colors: <Color>[
                        Color(0xFF0D47A1),
                        Color(0xFF1976D2),
                        Color(0xFF42A5F5),

      ],
      ),
                      borderRadius: BorderRadius.all(Radius.circular(10.0))
                  ),
                 width: MediaQuery.of(context).size.width,
                 height: 40,
                 // padding: const EdgeInsets.fromLTRB(45, 10, 45, 10),
                  child:  Center(
                    child: Text(
                        Confi.BOOKNOW,
                        style: TextStyle(fontSize: 16)
                    ),
                  ),
                ),
              ),
            )



          ],
        ),
      ),
    );
  }
}

标签: flutterflutter-layout

解决方案


设置shirinkWrap: trueListView.

Dialog(
  child: Form(
    key: _formKey,
    child: ListView(
      shrinkWrap: true, //TODO: Use this
      children: <Widget>[
        TextFormField(
          decoration: InputDecoration(labelText: Confi.TEMPLENAME),
          validator: (value) {
            if (value.isEmpty) {
              return 'Please enter ' + Confi.TEMPLENAME;
            }
            return null;
          },
        ),
        ....
        ....

推荐阅读