Flutter: How to crop text depending on available space?

Question

How to crop text depending on available space?

There's a similar question here, but there's no working answer.

Currently, this code

            return new GridTile(
              child: new Card(
                elevation: 3.0,
                child: new Container(
                  padding: new EdgeInsets.all(10.0),
                  child: new Column(
                    children: <Widget>[
                      Text(
                        document['title'],
                        style: new TextStyle(fontWeight: FontWeight.bold),
                      ),
                      Text(
                        document['text'],
                      ),
                    ],
                  ),
                ),
              )
            );

Gives this result:

I tried using overflow: TextOverflow.ellipsis, but the text becomes 1 line long. Specifying the text line length is a bad idea, because on different screen sizes results will vary.

How to make so that the text crops, fits or wraps itself into available space?

Answer 1

Setting overflow behavior should do

  new Text(
    widget.text,
    // softWrap: true,
    overflow: TextOverflow.fade,
  )

See also Flutter: How to hide or show more text within certain length