Row elements should change their padding depending on which element is selected. I've tried different options with padding, changed it in every way, but it's always the same option - AnimatedContainer always jumps, changes position, and does not stay in one place. How can this be corrected?
`
Positioned( bottom: 100, left: 52, child: Row( // mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ for (int i = 0; i <= widget.planets.length - 1; i++) Builder( builder: (context) { final isSelected = selectedIndex == i; return GestureDetector( onTap: () { setState(() { selectedIndex = i; }); widget.getIndex(i); }, child: Padding( padding: EdgeInsets.only( left: i == 0 ? 0 : isSelected ? 16.0 : 26.0, ), child: SizedBox( height: 130, child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( child: AnimatedContainer( alignment: Alignment.center, curve: Curves.decelerate, duration: const Duration(milliseconds: 300), width: isSelected ? 80 : 40, height: isSelected ? 80 : 40, child: SvgPicture.asset( widget.planets[i].imageSvg, ), ), ), Column( children: [ Text( widget.planets[i].points, style: widget.planets[i].isAchieved ), const SizedBox(height: 4), Text( widget.planets[i].title, style: SRTypo.tabBarMediumWhite, ), ], ), ], ), ), ), ); }, ), ], ), );`
It is necessary that the indentation of the elements in the Row be the same, regardless of which element is selected