AnimatedContainer animates only for one of two elements - flutter

Question

I have an animatedContainer within a Widget, which includes a Container showing a number ("indicator"):
These indicators can increase/decrease or hide and show, but only exlusively. When negative, you see the red one, when positive, you see the green one. When 0, neither is shown.
The issue: The green one animates. The red one unintentionally does not. I have no idea why. It is basically the same widget, only with having empty spacing either on the right or left side, showing a positive or negative value and having either a green or red background color.
Here you see the class handling these "indicators". Keep in mind that in the image above you see two instances of the Widget.
import 'package:flutter/material.dart';
import 'package:progression_flutter/assets/colors.dart';
// TODO: Fix negative indicator unintended disabled animation.
class ProgressIndicators extends StatefulWidget {
const ProgressIndicators(this.valueStream,
{required this.showDigits, Key? key})
: super(key: key);
final Stream<num> valueStream;
final bool showDigits;
#override
State<ProgressIndicators> createState() => _ProgressIndicatorsState();
}
class _ProgressIndicatorsState extends State<ProgressIndicators> {
#override
Widget build(BuildContext context) {
return StreamBuilder<num>(
stream: widget.valueStream,
builder: (BuildContext context, AsyncSnapshot<num> snapshot) {
if (snapshot.hasData) {
final value = snapshot.data;
if (value != null) {
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 20),
_positionedIndicator(context, value: value),
],
);
}
}
return Container();
},
);
}
Widget _positionedIndicator(BuildContext context, {required num value}) {
final children = [
_animatedIndicator(context, value: value),
];
const spacer = SizedBox(
width: 60,
);
if (value.isNegative) {
children.add(spacer);
} else {
children.insert(0, spacer);
}
return Flexible(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: children,
),
);
}
Widget _animatedIndicator(BuildContext context, {required num value}) {
return AnimatedContainer(
transformAlignment: Alignment.topCenter,
curve: Curves.easeInOut,
height: value == 0 ? 0 : 20,
duration: const Duration(milliseconds: 250),
child: DownHangingProgressIndicator(
value: value,
showDigits: widget.showDigits,
),
);
}
}
class DownHangingProgressIndicator extends StatelessWidget {
const DownHangingProgressIndicator(
{Key? key, required this.value, required this.showDigits})
: super(key: key);
final num value;
final bool showDigits;
#override
Widget build(BuildContext context) {
final isNegative = value.isNegative;
final prefix = value.isNegative ? '' : '+';
final textValue = value.toStringAsFixed(showDigits ? 2 : 0);
return Stack(
alignment: Alignment.center,
children: [
Container(
height: 20,
width: 34,
decoration: BoxDecoration(
color: isNegative
? ProgressionColors.progressionRed
: ProgressionColors.progressionGreen,
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(5),
bottomRight: Radius.circular(5),
),
),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 2),
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
'$prefix$textValue',
style: const TextStyle(color: Colors.white, fontSize: 14),
textHeightBehavior:
const TextHeightBehavior(applyHeightToFirstAscent: false),
),
),
),
),
],
);
}
}
What causes the issue?
Running on iOS, flutter 3.3.4.