majidfathi69
majidfathi69

Reputation: 1799

Right to left TextFormField

How to use TextFormField widget while the icon and text are placed at the right side?

I'm currently using the following code:

new TextFormField(
    obscureText: obscure,
    style: const TextStyle(
        color: Colors.white,
    ),
    decoration: new InputDecoration(
        icon: new Icon(
            icon,
            color: Colors.white,
        ),
        border: InputBorder.none,
        hintText: hint,
        hintStyle: const TextStyle(color: Colors.white, fontSize: 15.0),
        contentPadding: const EdgeInsets.only(
        top: 30.0, right: 30.0, bottom: 30.0, left: 5.0),
    ),
)

Upvotes: 3

Views: 5239

Answers (2)

DolDurma
DolDurma

Reputation: 17303

You can use both of direction and align:

TextFormField(
  textAlign: TextAlign.right,
  textDirection: TextDirection.rtl,

Upvotes: 0

kevinbrink
kevinbrink

Reputation: 1309

add textAligin: TextAlign.end and use suffixIcon

 new TextFormField(
    textAlign: TextAlign.end,
    obscureText: obscure,
    style: const TextStyle(
        color: Colors.white,
    ),
    decoration: new InputDecoration(
        suffixIcon: new Icon(
            icon,
            color: Colors.white,
        ),
        border: InputBorder.none,
        hintText: hint,
        hintStyle: const TextStyle(color: Colors.white, fontSize: 15.0),
        contentPadding: const EdgeInsets.only(
        top: 30.0, right: 30.0, bottom: 30.0, left: 5.0),
    ),
)

Upvotes: 7

Related Questions