Use `TextEditingController` for check icon:
Try:
Row(
children: [
Expanded(
child: Container(
padding: EdgeInsets.only(left: 20, right: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Expanded(
child: Container(
margin: const EdgeInsets.only(bottom: 6),
child: TextFormField(
focusNode: _focusNode,
style: const TextStyle(
fontSize: 16,
color: Colors.black,
height: 1,
fontWeight: FontWeight.w100),
decoration: const InputDecoration(
hintStyle: TextStyle(
color: Colors.black,
fontSize: 16,
height: 1,
fontWeight: FontWeight.w100),
border: InputBorder.none,
hintText: "Search"),
onChanged: (text) {
setState(() {
// loadData();
});
},
controller: search),
),
),
search.text.isNotEmpty
? GestureDetector(
onTap: () {
search.clear();
FocusScope.of(context).requestFocus(
new FocusNode()); //remove focus
// _focusNode.hasFocus = false;
(context as Element).markNeedsBuild();
},
child: Icon(CupertinoIcons.clear),
)
: Icon(CupertinoIcons.search)
],
),
),
),
],
),
[![enter image description here][1]][1]
child: Row(
children: <Widget>[
IconButton(
icon: Icon(
Icons.menu,
color: Colors.black,
),
onPressed: () {
print("your menu action here");
_scaffoldKey.currentState.openDrawer();
},
),
Expanded(
child: Container(
margin: EdgeInsets.only(right: 5.0),
child: TextFormField(
cursorColor: Colors.black,
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
gapPadding: 0.0,
borderRadius: BorderRadius.circular(30.0),
borderSide: BorderSide(
color: Colors.black87,
width: 1.0,
),
),
hintText: 'Search',
fillColor: Colors.white,
border: OutlineInputBorder(
gapPadding: 0.0,
borderRadius: BorderRadius.circular(30.0),
borderSide: BorderSide(
color: Colors.black87,
width: 1.0,
),
),
suffixIcon: Container(
decoration: BoxDecoration(
color: Colors.black,
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: Colors.black38,
offset: Offset(-5.0, 0.0),
blurRadius: 10,
)
]),
child: IconButton(
icon: Icon(
Icons.search,
color: Colors.white,
),
onPressed: () {},
),
/* child: FloatingActionButton(
onPressed: () {},
mini: true,
elevation: 5.0,
backgroundColor: Colors.black,
child: Icon(
Icons.search,
),
),*/
),
filled: true,
contentPadding: EdgeInsets.only(
left: 15.0,
top: 0.0,
bottom: 0.0,
),
),
),
),
),
],
),
[1]: https://i.stack.imgur.com/UIAIC.png
