CODEWITHSUNDEEP
flutter
thinker
thinker

Reputation: 422

How to hide the bottom edge on TextField?

How to hide the bottom edge on TextField?

 TextField(
     decoration: InputDecoration(
     hintText: '(201) 555-0123',
 ),

enter image description here

Upvotes: 0

Views: 91

Answers (2)

enzo
enzo

Reputation: 11531

You can use the *border parameters of TextField:

TextField(
  decoration: InputDecoration(
    hintText: '(201) 555-0123',
    // Hides the border when the TextField is enabled
    enabledBorder: OutlineInputBorder(
      borderSide: const BorderSide(color: Colors.transparent),
    ),
    // Hides the border when you click the TextField
    focusedBorder: OutlineInputBorder(
      borderSide: const BorderSide(color: Colors.transparent),
    ),
    // Hides the border when the TextField is disabled
    disabledBorder: OutlineInputBorder(
      borderSide: const BorderSide(color: Colors.transparent),
    ),
  ),
)

Upvotes: 1

ModernSoft
ModernSoft

Reputation: 16

How are you? You can set the border of InputDecoration to InputBorder.none.

child: TextField(
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: S.of(context).textHere,
                hintStyle: TextStyle(fontSize: 12),
              ),
              minLines: 5,
              maxLines: null,
              controller: _content,
              keyboardType: TextInputType.multiline,
              textCapitalization: TextCapitalization.sentences,
            ),

https://i.sstatic.net/trK69.png

Upvotes: 0

Related Questions