I'm kind of new to Flutter, been studying it for a month now. I decided to implement a color picker in my app the way Samsung did it in their calendar app, but I want it to be vertical(the GIF is below). I tried doing it via PopupMenuButton, but it turned out that popupmenu has a width restriction or smth, so I can make it wider, but I can't make it narrower than a certain fixed width. Does anyone how should I implement this kind of widget?
class ColorSelectorButton extends StatefulWidget {
const ColorSelectorButton({ Key? key }) : super(key: key);
@override
_ColorSelectorButtonState createState() => _ColorSelectorButtonState();
}
class _ColorSelectorButtonState extends State<ColorSelectorButton> {
@override
Widget build(BuildContext context) {
return Container(
height: 25,
width: 25,
decoration: BoxDecoration(
color: Theme.of(context).secondaryHeaderColor,
shape: BoxShape.circle
),
child: TextButton(
child: Container(height: 25, width: 25, color: Theme.of(context).secondaryHeaderColor),
onPressed: () {
showMenu(
context: context,
position: RelativeRect.fromLTRB(0, 200, 0, 0),
items: [
PopupMenuItem(child: Container(
width: 40,
child: TextButton(
onPressed: () {},
child: Container(
height: 25, width: 25,
decoration: BoxDecoration(
color: Theme.of(context).secondaryHeaderColor,
shape: BoxShape.circle
)
)
),
)),
PopupMenuItem(child: Container(
width: 40,
child: TextButton(
onPressed: () {},
child: Container(
height: 25, width: 25,
decoration: BoxDecoration(
color: Theme.of(context).highlightColor,
shape: BoxShape.circle
)
)
),
)),
]
);
},
)
);
}
}
