Search code examples
flutterflutter-layoutalignmenttext-alignment

Align Text in Flutter


good morning/afternoon or evening to everyone. I have a doubt about how do I suppose to align the text in my app? Here is the image:

image

See the problem? I want to bring the second line onwards to where the word "Description" or "Descrição" are. I tried to replace the Row widget for Column but didn't work, nothing appeared on my screen. Also my code below:

Padding(

padding: const EdgeInsets.only(left: 15, right: 20),
child: Row(
   crossAxisAlignment: CrossAxisAlignment.start,
   children: <Widget>[
     Text(
       "Descrição :",
       style: TextStyle(
         fontSize: 16,
         height: 1.5,
         color: Colors.green.shade400),
       ),
     SizedBox(
       width: 5,
     ),
     Flexible(
       child: Text(
          widget.description,
          textAlign: TextAlign.justify,
          style: TextStyle(
            fontSize: 16,
            height: 1.5,
            color: Colors.green.shade600),
          ),
     ),
     SizedBox(
       height: 10,
     ),
   ],
 ),

Solution

  • Instead of Row, you should use RichText

    RichText(
      text: TextSpan(
        children: [
          TextSpan(
            text: 'Describe :',
            style: TextStyle(fontSize: 16, height: 1.5, color: Colors.green.shade400),
          ),
          TextSpan(
            text: widget.description,
            style: TextStyle(fontSize: 16, height: 1.5, color: Colors.green.shade600),
          )
        ],
      ),
    )