CODEWITHSUNDEEP
flutter
CoderZeng
CoderZeng

Reputation: 97

Flutter : How to align TextField with other widgets in row

I have a row with a Text () and a TextField () But they don't seem to align I'm an Android Developer and my past experience seems to have no effect. Do you have any suggestions for Android developers in terms of alignment skills?

screenshot

  SizedBox(
                          height:44,
                          child:
                          Row(crossAxisAlignment: CrossAxisAlignment.center,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                            Text("+60",
                              textAlign: TextAlign.start,
                              style: TextStyle(fontSize: 15,
                            color: Colors.white
                            ),),
                            Container(margin:EdgeInsets.fromLTRB(15,0,15,0)
                            ,width: 1,height: 12,color: Color(0x33FFFFFF),),
                              Expanded(//TextField
                                child: TextField(
                                  textAlign: TextAlign.start,
                                  keyboardType: TextInputType.number,
                                  cursorColor: Color(0x66FFFFFF),
                                  style: TextStyle(
                                      color: Colors.white,
                                      fontSize:15
                                  ),
                                  inputFormatters: [
                                    WhitelistingTextInputFormatter
                                        .digitsOnly,
                                    LengthLimitingTextInputFormatter(10)
                                  ],
                                  decoration: InputDecoration(
                                      hintText: 'Phone number',
                                      hintStyle: TextStyle(
                                          color: Color(0x66FFFFFF),
                                          fontSize: 15
                                      ),
                                      border: InputBorder.none
                                  ),
                                ),
                              )
                                ,
                          ],)
                        )

Upvotes: 1

Views: 471

Answers (1)

hewa jalal
hewa jalal

Reputation: 963

the SizedBox height property is controlling the Row constraint thus it's not allowing it to align it's childern freely, just remove the SizedBox widget and everything will work fine.

Upvotes: 2

Related Questions