I have one "row" and two "text" widgets inside. I want to align the starting place of two texts. ie "m. name" and "m105" should line up.

Container(
                child: Row(
                  children: [
                    Container(
                      child: Align(
                        alignment: Alignment.topLeft,
                        child: Text(
                          "M. Adı: ",
                          style: TextStyle(fontWeight: FontWeight.bold),
                        ),
                      ),
                    ),
                    // SizedBox(
                    //   width: 20,
                    // ),
                    Expanded(
                      child: Text(
                        "$productName",
                        overflow: TextOverflow.ellipsis,
                        maxLines: 3,
                        softWrap: true,
                      ),
                    ),
                  ],
                ),
              ),

CodePudding user response：

Try

Row() widget attribute

crossAxisAlignment: CrossAxisAlignment.start 

Text() widget attribute

textAlign: TextAlign.start, 

CodePudding user response：

/// Try something like that

 Row(
     crossAxisAlignment: CrossAxisAlignment.start,
     children: <Widget>[
          Text(
              "M. Adı: ",
              style: TextStyle(fontWeight: FontWeight.bold),
              ),
          ),
          SizedBox(width: 5),
          Flexible(
              child: Text( 
                        "$productName",
                        textAlign: TextAlign.start,    
                    ),
         ),
     ],
 ),

CodePudding user response：

Add crossAxisAlignment: CrossAxisAlignment.center, to your Row widget it should be aligned as you desired or still if it doesnt works just try changing center with other values check which one works for you...

and even after adding above property to your Row widget then you would have to remove alignment of topleft in your text of m.name