textfieldsearch-boxtextformfield

How to remove TextFormField Blue borders Flutter


I want to make a search box like this, I design this with TextForm Field

But when I click on this My search box design look like this, a blue line comes in, I want just cursor in center without change of my box shape

here is my code in which I take a TextFormField I want search box like the first picture, but when i click on it a blue line come in and box shape destroy. Is there anyone who could help me to fix this issue.

               TextFormField(
                    decoration: InputDecoration(
                    suffixIcon: Container(
                      height: 22,
                      width: 22,
                      padding: EdgeInsets.only(top: 2,bottom: 0,right: 7),
                      child: Image.asset("images/search.png"),
                       ),
                        hintText: 'search',
                        fillColor: Colors.white,
                        filled: true,
                        enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(15),
                        borderSide: const BorderSide(
                          color: kViveLaCarLightGrey, width: 2.0),
                      )),
                    ),

Solution

  • add properties border.none

    TextFormField(
       decoration: InputDecoration(
          border: InputBorder.none,
       ......