Search code examples
fluttertext-alignment

Flutter text aligment


I'm using row to display this text. But when I use expanded widget to make multiline the second text (e.g. AMD Ryzen… / 30 days...) then the first text (e.g. Processor/OS) becomes vertical center, I want that vertical top. I tried few widgets like align, etc. but didn't worked.

Code:

Widget _specificationRow(String title, String description) {
  return new Row(children: [
    Padding(
      padding: const EdgeInsets.all(5.0),
      child: Align(
        alignment: Alignment.topRight,
        child: Text(
          '• $title :',
          style: TextStyle(
              color: Colors.deepOrange,
              fontSize: 15.0,
              fontFamily: "GoogleSans"),
        ),
      ),
    ),
    Expanded(
      child: Padding(
        padding: const EdgeInsets.all(5.0),
        child: Text(
          '$description',
          maxLines: 3,
          overflow: TextOverflow.clip,
          style: TextStyle(
              fontSize: 15.0,
              fontFamily: "GoogleSans"),
        ),
      ),
    ),
  ]);
}

Screenshot


Solution

  • Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '• title : ',
                    style: TextStyle(
                        color: Colors.deepOrange,
                        fontSize: 15.0,
                        fontFamily: "GoogleSans"),
                  ),
                  Expanded(
                    child: Text(
                      'sfdadfafdsfseriewhfkjsvk shfhskdfhs sdfsd fyesruwefkj\nsdfassdfsafdsafd',
                      maxLines: 3,
                      style: TextStyle(fontSize: 15.0, fontFamily: "GoogleSans"),
                    ),
                  ),
                ],
              ),
    

    please provide crossAxisAlignment: CrossAxisAlignment.start

    enter image description here