Многострочный текстовый виджет не работает и выдает ошибку

Question

Я пытаюсь сделать виджет многострочного текста. Вот код, который у меня есть:

return Card(
      child: Row(
        children: <Widget>[
          Image(
            image: AssetImage('assets/images/myImage.jpg'),
            width: 150,
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[Text(
                    'some loooooong Text hereeeeeeeeeeee some loooooong Text hereeeeeeeeeeee',
                    overflow: TextOverflow.ellipsis,
                    maxLines: 5,
                  ),
            ],
          ),
        ],
      ),
    );

По какой-то причине он не работает, т.е. он не многострочный, и выдает ошибку:

RenderFlex переполнен 9,0 пикселей справа.

Я попытался обернуть виджет Text вокруг виджета Expanded и Flexible, но затем я получил следующую ошибку:

Дочерние элементы RenderFlex имеют ненулевой изгиб, но входящие ограничения по высоте не ограничены

Answer 1

Вы должны заключить в Expanded весь Column, а не только текстовый виджет. По большей части вы хотите, чтобы текст расширялся по горизонтали. Цель Expanded - просто предоставить ограничения для текста, чтобы он знал, куда переносить, при этом оставляя для него как можно больше места. Вы также можете заключить его в Container или SizedBox с ограничениями.

return Card(
      child: Row(
        children: <Widget>[
          Image(
            image: AssetImage('assets/images/myImage.jpg'),
            width: 150,
          ),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[Text(
                      'some loooooong Text hereeeeeeeeeeee some loooooong Text hereeeeeeeeeeee',
                      overflow: TextOverflow.ellipsis,
                      maxLines: 5,
                    ),
              ],
            ),
          ),
        ],
      ),
    );