A animação é controlada por uma variável booleana (selected), quando o estado dela é alterado o animatedContainer recebe mundaças na cor e no tamanho, isso faz com que a animação se inicie.
lineAnimation() {
selected = !selected;
}
ativatedIcon(IconData icon) {
return Column(
children: [
Icon(
icon,
size: 38,
color: const Color.fromARGB(255, 221, 199, 248),
),
const SizedBox(height: 6),
AnimatedContainer(
onEnd: () => setState(() {
selected = true;
}),
curve: Curves.elasticOut,
duration: const Duration(milliseconds: 300),
width: selected ? 38 : 10,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
width: 1.0,
color: selected
? const Color.fromARGB(255, 221, 199, 248)
: Colors.transparent,
))),
),
],
);
BottomNavigationBarItem(
tooltip: 'Comunicados',
icon: Icon(widgetIcons[0]),
activeIcon: ativatedIcon(widgetIcons[0]),
label: '',
),
onTap: (index) => setState(() {
indexOf = index;
selected = !selected;
}),
O problema é que quando eu mudo de tela, essa booleana recebe uma alternância de true para false e quando está em false a "linha" não é exibida.