Search code examples
fluttertextfieldplaceholder

How to show placeholder on left side of TextField with centered HintText/Text Flutter


Im trying to make a TextField with placeholder starting on the left of it, and still have the text and hint text centered.

Here's my code to get the placeholder on the left of my textField :

      Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          TextField(
            decoration: InputDecoration(
                hintText: "hint text",),
            textAlign: TextAlign.left,
          )
        ],
      ),

And I know that, if I wan't the text and HintText centered I've to change the value of textAlign to TextAlign.center.

So my question is :

Is there any way to add both parameters ?

EDIT :

So what I want is the placeholder at the left of the hint text like this picture :

Left placeholder

But with a centered textField like this :

TextField centered


Solution

  • Try this:

    TextField(
      controller: _textController,
      textAlign: (_textController?.text ?? '').isEmpty ? TextAlign.start : TextAlign.center,
      decoration: InputDecoration(
      hintText: "hint text",),
      onChanged: (value){
        setState(() {});
      }
    )