Shrink container to smaller child rather than expanding to fill parent

Question

I'm creating a custom widget for a segment control.

return Padding(
  padding: const EdgeInsets.symmetric(vertical: 20.0),
  child: Container(
    decoration: BoxDecoration(border: Border.all(color: Colors.blue)),
    child: Row(
      mainAxisSize: MainAxisSize.min,
      children: buttons,
    ),
  ),
);

I want the container to shrink to the minimum size to contain its children. However when I include the widget in a parent, it expands to fill the parent. This is visible because the border from the decoration is larger than the buttons.

How do I force the container to shrink?

Answer 1

To get the container not to take up the entire parent, you need to tell it where it should be placed within the parent - by default, it doesn't know where to go so it fills the parent =D.

The simplest ways of doing this are to use an Align or a Center widget. I believe you want to put it around your Container in this case, but I'm not 100% sure.

Answer 2

wrapping a Container in a Row() widget makes the container shrinks to the Container's child size as mentioned here,, https://github.com/flutter/flutter/issues/4949

Row(
 mainAxisAlignment: MainAxisAlignment.center,
 crossAxisAlignment: CrossAxisAlignment.center,
   children: [
     Container(
       child:button()   
     ),
   ]
),

Answer 3

bit late to the party... I'm still new to flutter so go easy on me, but I think using Align or Center as the Parent and then set the Width and Height values for the Child then the parent should shrink to the child. =D