CODEWITHSUNDEEP
flutter
Dmitry Bubnenkov
Dmitry Bubnenkov

Reputation: 9869

Word-wrapping do not working with long text

Here is my widget:

  return Card(
      child: Container(
    height: 150,
    child: Row(
      children: <Widget>[
        Placeholder(
          fallbackHeight: 100,
          fallbackWidth: 100,
        ),
        Container(
          width: _deviceHeight,
          color: Colors.red,
          child: Column(
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              Flexible(
                  child: Text(
                "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaasssssaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
                overflow: TextOverflow.ellipsis,
                maxLines: 4,
              )),

              // Expanded(flex: 8, child: Text("bbb")),
              Flexible(child: Text("bbb")),
              // Flexible(child: Text("aaa")),
            ],
          ),
        )
      ],
    ),
  ));

I expected that text will be placed on new line, but I am getting overflow:

enter image description here

Upvotes: 0

Views: 45

Answers (2)

Pablo Barrera
Pablo Barrera

Reputation: 10963

You could wrap the second element of the Row with Flexible, like this:

Row(
  children: <Widget>[
    Placeholder(..),
    Flexible(
      child: Container(
        color: Colors.red,
        child: Column(...

Inside the Row you need Placeholder to keep its width and Container width to be flexible.

Edit: And you should remove the width of the Container, since it would be flexible and it should take as much as possible to fit the screen.

Upvotes: 0

Miguel Ruivo
Miguel Ruivo

Reputation: 17756

Wrap your inner Container with an Expanded to provide it with the available parent constraints, otherwise the Container has infinite height and will result in an overflow (because you are on landscape).

 Expanded(
     child: Container(
          width: _deviceHeight,
          color: Colors.red,
          child: Column(
  ...

Upvotes: 1

Related Questions