列表行内的颤振行 [英] Flutter Row Inside ListView

问题描述

我正在尝试在列表视图中添加Row并收到错误消息

I am trying to add a Row inside of a list view and am getting the error

I/flutter (13858): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (13858): The following assertion was thrown during performLayout():
I/flutter (13858): BoxConstraints forces an infinite height.
I/flutter (13858): These invalid constraints were provided to RenderParagraph's layout() function by the following
I/flutter (13858): function, which probably computed the invalid constraints in question:
I/flutter (13858):   RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:805:17)
I/flutter (13858): The offending constraints were:
I/flutter (13858):   BoxConstraints(w=72.0, h=Infinity)

按照针对该错误的指导，我尝试将ListView包装在Expanded中，但这只会导致Expanded widgets must be placed inside Flex widgets.，这导致我尝试另一种方法..并最终返回同样的错误.

Following the guidance found for that error, I have tried wrapping my ListView in an Expanded, but that only leads to Expanded widgets must be placed inside Flex widgets., which leads me to trying another approach.... and ending up back with this same error.

我的窗口小部件在下面.有没有办法让这个工作?我最终想要做的是显示多行，行之间有一些文本，允许用户上下滚动页面.

My widget is below. Is there a way to get this working? What I am ultimately trying to do is show multiple sets of rows with some text between between them, allowing for the user to scroll the page up and down.

class _RoutineEditState extends State<RoutineEdit> {
  String routineName;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Edit Routine'),
      ),
      body: ListView(
        //padding: EdgeInsets.fromLTRB(10, 15, 10, 5),
        children: <Widget>[
          Text('ddedede'),
          Row(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Set'),
            ],
          ),
        ],
      ),
    );
  }
}

推荐答案

由于我不知道您想要的布局.

As I am not aware of your desired layout.

只需解决该错误.我们有三个选择.

Just to fix the error. we have three options.

首先:使用-IntrinsicHeight小部件.

代码:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Edit Routine'),
      ),
      body: ListView(
        //shrinkWrap: true,
        //padding: EdgeInsets.fromLTRB(10, 15, 10, 5),
        children: <Widget>[
          Text('ddedede'),
          IntrinsicHeight(
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text('Set'),
                Text('Set'),
                Text('Set'),
              ],
            ),
          ),
        ],
      ),
    );
  }

第二:将您的行包装在LimitedBox中并保留-crossAxisAlignment: CrossAxisAlignment.stretch

Second: wrap your row in LimitedBox and keep - crossAxisAlignment: CrossAxisAlignment.stretch

代码:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Edit Routine'),
      ),
      body: ListView(
        shrinkWrap: true,
        //padding: EdgeInsets.fromLTRB(10, 15, 10, 5),
        children: <Widget>[
          Text('ddedede'),
          LimitedBox(
            maxHeight: 200.0,
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text('Set'),
                Text('Set'),
                Text('Set'),
              ],
            ),
          ),
        ],
      ),
    );
  }

第三:删除或评论-crossAxisAlignment: CrossAxisAlignment.stretch

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Edit Routine'),
      ),
      body: ListView(
        shrinkWrap: true,
        //padding: EdgeInsets.fromLTRB(10, 15, 10, 5),
        children: <Widget>[
          Text('ddedede'),
          Row(
           // crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Set'),
              Text('Set'),
              Text('Set'),
            ],
          ),
        ],
      ),
    );
  }

这篇关于列表行内的颤振行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！