Question

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

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.，这使我尝试了另一种方法... 。并以相同的错误结束。

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

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'),
            ],
          ),
        ],
      ),
    );
  }
}

Answer 1

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

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

首先：使用-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

代码：

@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'),
            ],
          ),
        ],
      ),
    );
  }

Answer 2

Expanded小部件必须是Row或Column小部件的子级，但是您已经在body属性中直接使用了它。尝试删除第一个Expanded小部件。

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: [
              Flexible(
                flex: 1,
                child: Text('Set'),
                fit: FlexFit.tight,
              ),
              Flexible(
                flex: 1,
                child: Text('Reps'),
                fit: FlexFit.tight,
              ),
              Flexible(
                flex: 1,
                child: Text('lbs'),
                fit: FlexFit.tight,
              ),
              Flexible(
                flex: 1,
                child: Text('prev'),
                fit: FlexFit.tight,
              ),
              Flexible(
                flex: 1,
                child: Text('...'),
                fit: FlexFit.tight,
              ),
            ],
          ),
          // Column(
          //   crossAxisAlignment: CrossAxisAlignment.start,
          //   children: <Widget>[
          //     SizedBox(
          //       height: 24,
          //     ),
          //     TextField(
          //         controller: TextEditingController(text: routineName),
          //         keyboardType: TextInputType.text,
          //         decoration: kTextFieldDecoration.copyWith(hintText: 'Name of routine')),
          //     SizedBox(
          //       height: 24,
          //     ),
          //   ],
          // ),
        ],
      ),
    );

列表行内的颤振行

2 个答案: