Question

我想在主屏幕上显示一个可滚动的列表。我尝试将名为Cardslist（）的Listviewbuilder实现到主屏幕中，但始终会引发以下异常： RenderFlex子级具有非零柔性，传入的高度约束是无界的。这是主页的代码屏幕：

import 'package:biminda_app/Components/cards_list.dart';
import 'package:biminda_app/Components/real_new_finished_card.dart';
import 'package:flutter/material.dart';
import 'package:biminda_app/Components/custom_Buttons.dart';
import 'package:biminda_app/Components/constants.dart';
import 'package:flutter/rendering.dart';
import 'package:biminda_app/Screens/new_card_screen1.dart';
import 'package:biminda_app/Screens/settings.dart';
import 'package:biminda_app/Components/card_data.dart';
import 'package:biminda_app/Components/cards_list.dart';

class HomeScreen extends StatefulWidget {
  static const String id = 'home_screen';
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String individualsName;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Container(
            padding: EdgeInsets.fromLTRB(
              20,
              40,
              20,
              0,
            ),
            child: TextField(
              style: TextStyle(
                color: Colors.black,
              ),
              decoration: kTextFieldInputDecoration,
              onChanged: (value) {
                individualsName = value;
                // TODO: Der Input muss das Individum in der Liste
                // TODO: erkennen und anzeigen
              },
            ),
          ),
          //TODO HIER
          Expanded(
              child: Column(
            children: <Widget>[
              CardsList(),
            ],
          )),

          Center(
            child: Container(
              child: MainButton(
                  functionality: 'New',
                  onPressed: () {
                    Navigator.pushNamed(context, NewCard.id);
                  }),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                SideButton(
                    functionality: 'Settings',
                    onPressed: () {
                      Navigator.pushNamed(context, Settings.id);
                    }),
                SideButton(
                    functionality: 'Calendar',
                    onPressed: () {
                      Navigator.pushNamed(context, Settings.id);
                    }),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

这是Cardslist（）的代码：

class CardsList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Consumer<CardData>(builder: (context, cardData, child) {
      return ListView.builder(
          scrollDirection: Axis.vertical,
          shrinkWrap: true,
          itemBuilder: (context, index) {
            final card = cardData.cards[index];
            return FinalCardCreation(
              finalname: card.cname,
              finalbirthday: card.cbirthday,
            );
          });
    });
  }
}

创建的卡FinalCardCreation（）的代码：

class CardFinish extends StatefulWidget {
  @override
  CardFinishState createState() => CardFinishState();
}

class CardFinishState extends State<CardFinish> {
  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height:
          MediaQuery.of(context).size.height * 0.5, //<-- set height of the card
      child: FinalCardCreation(),
    );
  }
}

class FinalCardCreation extends StatelessWidget {
  String finalname;
  String finalbirthday;

  FinalCardCreation({
    Key key,
    @required this.finalname,
    @required this.finalbirthday,
  }) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Card(
      color: Color(0xFFef9a9a),
      margin: EdgeInsets.all(2),
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(22)),
      child: Column(
        children: <Widget>[
          SizedBox(height: 8),
          Expanded(
            child: FinalCardContent(
              name: finalname,
              birthday: finalbirthday,
            ),
          )
        ],
      ),
    );
  }
}

class FinalCardContent extends StatelessWidget {
  String name;
  String birthday;
  FinalCardContent({Key key, @required this.name, @required this.birthday})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(
              '$name',
              textAlign: TextAlign.center,
              style: TextStyle(
                fontSize: 50.0,
                color: Colors.black,
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(
              '$birthday',
              textAlign: TextAlign.center,
              style: TextStyle(
                fontSize: 50.0,
                color: Colors.black,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

我试图用多种方式包装Cardslist（），但总是遇到此异常。谢谢您的时间和答复。

Answer 1

Column是一个小部件，其高度可以无限增大。它没有对其子代施加任何高度限制。 Expanded是在ListView中包含Column的明智方法，因为它们适合Column屏幕上的所有可能空间，但要对孩子的约束。

您可以删除Column包装CardList的包装，或者，如果以后确实需要Column用于其他包装，请尝试将CardList包装在另一个{{1} }。

Column内的Listviewbuilder实现不起作用

1 个答案: