Like the title, you can see my Button is not take up full height of the Row.The Blue background color is the Container wrap my button to visualize the container size. You can see the Image without some background color below.
I have no idea what causes this, can’t find any answer on internet so i post this here. Below is my code and the image. Thank you for any help.
@override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: SafeArea( child: Center( child: Container( padding: EdgeInsets.all(16), // color: Colors.redAccent, child: Container( // color: Colors.indigo, child: Column( children: [ Row( children: [ Expanded( child: TextField( decoration: InputDecoration( contentPadding: EdgeInsets.symmetric( horizontal: 8, vertical: 0), border: OutlineInputBorder( borderRadius: BorderRadius.circular(10), ), hintText: 'Enter Match ID', ), ), ), Container( // color: Colors.blue, padding: EdgeInsets.all(0), margin: EdgeInsets.all(0), child: ElevatedButton( style: ElevatedButton.styleFrom( // backgroundColor: Colors.greenAccent, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10)), ), onPressed: () => {}, child: Text("Scan Code")), ), ], ), ], ), ), ), ), ), ), ); }
I paint the background in order to research the problem
Original one
- I have try Expand, SizedBox, SizedBox.expand,… but nothing works. I think the problem is the button it self or maybe I’m not understand the button, yet.
Bùi Thế Anh is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.