CODEWITHSUNDEEP
fluttertextfield
Anonk
Anonk

Reputation: 1653

How to wrap the hint text in a text field in Flutter?

The hintStyle property doesn't seem to contain anything that would let me denote that the hint text should wrap. The actual text in my text field wraps automatically. How can I wrap the hinttext?

Upvotes: 9

Views: 5405

Answers (4)

oxq
oxq

Reputation: 364

The hintMaxLines attribute of InputDecoration does the intended thing. Just set it to the maximum number of lines the hint should be able to reach.

TextField(
  decoration: InputDecoration(
    hintText: 'Imagine a very long hint here word word ...',
    hintMaxLines: 10,
  ),
),

It looks like this:

A screenshot of the multiline hint textfield with the shown code

Upvotes: 4

abbur
abbur

Reputation: 111

I think this is a flutter web bug - reproducable on chrome mac, safari mac and chrome android, seems to be ok on safari ipad, at least in simulator. We messed around with all the settings but nothing worked. Someone should probably log it as an issue in Flutter github repo.

And yes \n works like a charm so a big thank you Stephane!

Upvotes: 0

Stephane Gallet
Stephane Gallet

Reputation: 21

Using maxlines didn't work for me (for Flutter Web), but until the text automatically wraps I'm adding \n where I want it to break. 

TextFormField(
    maxLines: 5, 
    decoration: InputDecoration(
    hintMaxLines: 5,
    hintText: 'Make it a descriptive message that allows your client to \n understand what you are working on, what challenges you are \n facing, and if anything is unclear. \n Try to be clear but positive!',
    labelText: 'Today\'s message to your client, \n what is the team working on?',
    labelStyle: TextStyle(fontSize: 14,),
    hintStyle: TextStyle(fontSize: 14,),
    ),
    ),

Upvotes: 2

Sameh.K
Sameh.K

Reputation: 1143

I fix it by using maxLines on my TextField

  TextField(  textAlign: TextAlign.center,
              maxLines: 2,
              decoration: InputDecoration(hintText: "Your Hint Your Hint Your Hint Your Hint Your Hint Your Hint")),

Upvotes: 0

Related Questions