Attach two suffix icon with background on textfield in flutter? - flutter

Question

I want the outcome to be like this,
but so far what I have achieved is
The 'From' tag is not an issue but the outline is.
here is code for my text field.
TextField(
enabled: false,
decoration: InputDecoration(
disabledBorder: OutlineInputBorder(
borderSide:
BorderSide(color: colorx.Colors.black, width: 0.7),
),
hintText: 'YYYY-MM-DD',
hintStyle: TextStyle(color: Colors.black12),
suffixIcon: Container(
height: 58,
width: 80,
decoration:
BoxDecoration(color: colorx.Colors.paleGreyTwo,),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
// added line
mainAxisSize: MainAxisSize.min,
// added line
children: [
Image.asset(
"graphics/calender.png",
),
Image.asset(
"graphics/refresh_date.png",
),
],
),
),
),
style: TextStyle(color: Colors.black),
),

Answer 1

Try below code hope its help to you. just change my icons to your Images
TextField(
enabled: false,
decoration: InputDecoration(
disabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 0.7,),
),
hintText: 'YYYY-MM-DD',
hintStyle: TextStyle(color: Colors.black12,),
suffixIcon: Container(
margin: EdgeInsets.all(1),
height: 58,
width: 100,
decoration: BoxDecoration(
color: Colors.grey,
border: Border(
left: BorderSide(
color: Colors.black,
width: 1.0,
),
),),
child: IntrinsicHeight(
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Icon(Icons.date_range,),
VerticalDivider(
color: Colors.black,
thickness: 1,
),
Icon(Icons.close,),
],
),
),
),
),
style: TextStyle(
color: Colors.black,
),
),
Your result screen->