How to set different alignment for TextField hint and the actual text value?-CodePudding

I have this TextField:

As you see this is the hint of my TextField, aligned at right.

The problem is that when I type something inside the TextField, I want that value to be written from the left, but actually, it's written on the right also:

I want the hint to stay aligned, but when I type something, it goes to another side of TextField.

The code I'm trying:

TextField(
  textAlign: TextAlign.left,
);

Thank you!

CodePudding user response：

Try the following code:

TextField(
  textDirection: TextDirection.ltr,
  decoration: InputDecoration(
    …
  ),
),

CodePudding user response：

Create this variable to keep text aligned:

TextAlign textAlign = TextAlign.right;

In the onChange method add:

onChanged: (val) {
  if (val.isNotEmpty){
    setState(() {
      textAlign = TextAlign.left;
    });
  } else {
    setState(() {
      textAlign = TextAlign.right;
    });
  }
},

Finally, add this to your text field:

TextField(
  textAlign: textAlign,
);