Daryll David Dagondon
Daryll David Dagondon

Reputation: 373

How to align the TextFormField at left

Very new to Flutter. I want the MI TextFormField to left-align like the lastname and firstname fields.

enter image description here

Below code for MI:

                    new Container(
                        width: 50.0,
                        child: new TextFormField(
                            controller: miController,
                            obscureText: true,
                            decoration: new InputDecoration(labelText: 'MI'),
                            inputFormatters: [new LengthLimitingTextInputFormatter(1)],
                        ),
                    ),

Stackoverflow did not let me have more code than the description. So see here: https://pastebin.com/VaqUGH9g

Upvotes: 2

Views: 1308

Answers (3)

anmol.majhail
anmol.majhail

Reputation: 51326

As Mentioned by @sreeramu in your Code Simple Add crossAxisAlignment: CrossAxisAlignment.start : Rest of the Code is Good.

body: Container(
                padding: const EdgeInsets.all(20.0),
                child: new Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                        new TextFormField(.....//Code Cont.

Upvotes: 1

Viren V Varasadiya
Viren V Varasadiya

Reputation: 27207

you can wrap your Container of Mi TextFormField With Align To Achieve Your desire layout.

Align(
      alignment: Alignment.topLeft,
      child: Container(
      width: 50.0,
      alignment: Alignment.topLeft,
      child: new TextFormField(
          controller: miController,
          decoration: new InputDecoration(labelText: 'MI'),
          inputFormatters: [new LengthLimitingTextInputFormatter(1)],
         ),
     ),
),

Upvotes: 1

Durdu
Durdu

Reputation: 4859

For all TextFormFields to be algined you need to add them in a column.

new Column(
       mainAxisAlignment: MainAxisAlignment.start,
       children: new TextFormField(), // <- username
                 new TextFormField(), // <- password
                 new TextFormField()  // <- MI
          )

Your MI TextFormField is aligned already aligned left.

Upvotes: 0

Related Questions