在颤振列表视图中右溢出 23 像素答案

【问题标题】：Right overflowed by 23 pixels in flutter listview在颤振列表视图中右溢出 23 像素
【发布时间】：2020-03-03 23:44:30
【问题描述】：

我创建了一个列表视图，但它显示 OVERFLOWED BYELS ERROR

这是给你的列表视图

return ListView.builder(

      itemCount: titles.length,
      itemBuilder: (context, index) {
        return Card(
            elevation: 50,
            child: InkWell(


              splashColor: Colors.green,
              highlightColor: Colors.red,
              child: Row(
                children: <Widget>[


              Container(


                height: 100.0,
                  width:50.0,

                decoration: BoxDecoration(
                    gradient:LinearGradientStyle.linearGradient(
                        orientation:LinearGradientStyle.ORIENTATION_HORIZONTAL,
                        gradientType: LinearGradientStyle.GRADIENT_TYPE_AMIN
                    )
                ),),

                  Container(
                      margin: EdgeInsets.all(10),
                      child: Text(
                        numbers[index],
                      )),


                  Container(
                    margin: EdgeInsets.all(10),
                    child: GradientText((titles[index]),
                      gradient:gradient,

                      style:TextStyle(fontSize:20.0,fontWeight:FontWeight.bold, ),
                    ),
                    //Text(titles[index]),
                  )
                ],
              ),
              onTap: () => onTaps[index](),
            ));
      });

如果您需要更多代码，请发表评论 ...

而不是溢出错误它应该出现在列表的第二行。如果您有任何解决方案，请帮助我....

【问题讨论】：

你可以试试wrap widget
在这种情况下，我强烈建议您使用 ListTile：youtube.com/watch?v=l8dj0yPBvgQ 它将使您的代码看起来更干净并避免此问题。
@tinus jackson 你知道在这种情况下使用 wrap 小部件的任何方法吗？我尝试使用但屏幕上出现错误

标签： flutter dart

【解决方案1】：

ListView.builder(

      itemCount: 1,
      itemBuilder: (context, index) {
        return Card(
            elevation: 50,
            child: InkWell(


              splashColor: Colors.green,
              highlightColor: Colors.red,
              child: Row(
                children: <Widget>[


              Container(


                height: 100.0,
                  width:50.0,

                ),

                  Container(
                      margin: EdgeInsets.all(10),
                      child: Text(
                        "numbers[index]",
                      )),


                  Flexible(
                                      child: Container(
                      margin: EdgeInsets.all(10),
                      child: Text("GradientText"*30,

                        style:TextStyle(fontSize:20.0,fontWeight:FontWeight.bold, ),
                      ),
                      //Text(titles[index]),
                    ),
                  )
                ],
              ),
              onTap: () {},
            ));
      }),

使用灵活的小部件，比如有溢出的父部件

【讨论】：

谢谢它帮助了我。我怎样才能用 WRAP 小部件包装它而不是使用灵活的父级
Wrap 小部件具有子属性而不是子属性。这就是为什么灵活更适合您的情况。
我使用儿童包装但出现错误。然后我使用您的解决方案解决了这个问题
您可以在 Row 和 Column 小部件中使用扩展的灵活小部件。检查这个：stackoverflow.com/questions/52645944/… 它可以教给你一些东西来学习如何在 Flutter 中进行设计

【解决方案2】：

DropdownButton 也有类似的问题。我试图为问题和答案创建一个下拉列表，因为我必须为自定义模型创建 DropdownButton。

isExpanded: true,

救了我的命

List<Question> questions;

   Widget buildDropDown() {
    return DropdownButton<Question>(
      isExpanded: true,
      value: _selectedQuestion,
      style: TextStyle(color: Colors.white),
      items: questions.map<DropdownMenuItem<Question>>((Question question) {
        return DropdownMenuItem(
          child: Text(
            question.title,
          ),
          value: question,
        );
      }).toList(),
      onChanged: (Question question) {
        setState(() {
          _selectedQuestion = question;
        });
      },
    );
  }

class Question {
  String title;
  String answer;
  int id;

  Question({this.id, this.title});

  void setAnswer(String answer) {
    this.answer = answer;
  }
}

【讨论】：