CODEWITHSUNDEEP
flutterdart
user3180690
user3180690

Reputation: 243

How to remove label of textfield?

Would like to ask if it is possible to remove the label "Label" on top left of the text field in Flutter.

enter image description here

Upvotes: 9

Views: 11647

Answers (7)

Artik03
Artik03

Reputation: 1

I think it would be better to use HintText instead of label in this case.

Like this:

TextField(
  decoration: InputDecoration(
    border: OutlineInputBorder(),
    hintText: 'Enter a search term',
  ),
),

Upvotes: 0

Arya
Arya

Reputation: 1

Add floatingLabelBehaviour.never inside InputDecoration of the TextField :

TextField(

     decoration: InputDecoration(                                          
            contentPadding:const EdgeInsets.symmetric(horizontal:10),
            label: animatedText(),
            floatingLabelBehavior: FloatingLabelBehavior.never,
                  ),
                ),

Upvotes: 0

Roland Dumitrascu
Roland Dumitrascu

Reputation: 101

Add the floatingLabelBehaviour option as follows:

inputDecorationTheme: const InputDecorationTheme(
    border: OutlineInputBorder(),
    floatingLabelBehavior: FloatingLabelBehavior.never,
),

Upvotes: 1

Usman Ali
Usman Ali

Reputation: 1

The following code removes the LabelText when you write anything in the TextField and shows LabelText when you do not write anything in the TextField.

    TextEditingController Controller = TextEditingController();
    
    bool  ForBool = true;
    
    TextField(
            onChanged: (value) {
              if (value.length <= 0) {
                setState(() {
                  ForBool = false;
                });
              } else {
                setState(() {
                  ForBool = true;
                });
              }
              Controller.text = value;
              print(value);
              Controller.selection = TextSelection.fromPosition(
                  TextPosition(offset: Controller.text.length));
            },
            controller: Controller,
            decoration: InputDecoration(
              hintText: ForBool ? null : "Search...",
            ),
          ),

Upvotes: 0

Subhangi Pawar
Subhangi Pawar

Reputation: 499

Yes, set the floatingLabelBehavior to never in InputDecoration. It worked for me.

decoration: InputDecoration(
    floatingLabelBehavior: FloatingLabelBehavior.never,
),

Upvotes: 37

John Joe
John Joe

Reputation: 12803

Yes, is it possible. Just remove the hintText and labelText in InputDecoration.

     decoration: InputDecoration(
         border: OutlineInputBorder(
          borderRadius: const BorderRadius.all(
           const Radius.circular(5.0),
      )),
      // hintText: Localization.of(context).accessLevel,
      // labelText: Localization.of(context).accessLevel,
   ),

Upvotes: 4

Coder_Manuel
Coder_Manuel

Reputation: 22

Simply Remove the labelText property in the InputDecoration.

Upvotes: -3

Related Questions