Prezados, estou com dificuldades em fazer com que IconButtons se sobreponham dentre outros Widgets
Tentei utilizar Stacks mas não tive sucesso, as listas dos botões provem de uma api Rest, pensei em utilizar um stack na tela inteira e colocar em cima de tudo mas não sei se seria a melhor forma de fazer e mais otimizada
Outra tentativa foi com o Widget OverflowBox mas também não tive sucesso.
Objetivo:
Semelhante ao fim abaixo:
https://gph.is/g/4oWwzVJ
Segue Codigo:
Positioned(
bottom: 0,
child: Container(
color: Colors.transparent,
width: MediaQuery.of(context).size.width,
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
width: MediaQuery.of(context).size.width / 2 - 73,
child: Row(
children: [
Stack(
children: [
GestureDetector(
onTap: () {
setState(() {
minimizedOpen = !minimizedOpen;
});
},
child: Container(
height: 40,
width: 40,
decoration: BoxDecoration(
// color: minimizedOpen ? Colors.white : Theme.of(context).canvasColor,
color: Colors.transparent,
borderRadius: BorderRadius.circular(20),
),
child: minimizedOpen
? Icon(
FontAwesomeIcons.times,
color: Theme.of(context).primaryColor,
size: 18,
)
: Icon(
FontAwesomeIcons.ellipsisV,
color: Theme.of(context).primaryColor,
size: 18,
),
),
),
Padding( // defini este como exemplo para o builder
padding: const EdgeInsets.only(bottom: 50),
child: GestureDetector(
onTap: () {},
child: Container(
height: 40,
width: 40,
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: BorderRadius.circular(20),
),
child: Icon(
FontAwesomeIcons.ambulance,
color: Colors.red,
size: 18,
),
),
),
),
],
),
_listaMinimizedTasks(),
],
),
),
Container(
height: 50,
width: 56,
),
Container(
height: 50,
width: MediaQuery.of(context).size.width / 2 - 73,
child: Row(
textDirection: TextDirection.rtl,
mainAxisAlignment: MainAxisAlignment.start,
children: [],
),
),
],
),
),
),