A list for displaying speeds

Question

I have a list that should change depending on the passed value, how do I move the pointer to the current value? Also, I need to understand how this list can be moved dynamically? Now this is a list that place in Stack

The data can change dramatically and jump from 0 to 10 at once, with no values in between, so I need a smooth value change, with some kind of animation

Positioned(
            left: 30,
            top: 34,
            child: Container(
              height: 164,
              width: 50,
              decoration: const BoxDecoration(
                color: Colors.transparent,
                border: Border(
                  top: BorderSide(color: Colors.white, width: 2),
                  right: BorderSide(color: Colors.white, width: 2),
                  bottom: BorderSide(color: Colors.white, width: 2),
                ),
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(4),
                  bottomLeft: Radius.circular(4),
                ),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.end,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  const SizedBox(height: 14),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      const Text(
                        '40',
                        style: TextStyle(
                            color: Color(0xFFEBEBEC),
                            fontSize: 12,
                            fontWeight: FontWeight.w400,
                            height: 0.01),
                      ),
                      Container(
                        height: 2,
                        width: 24,
                        margin: const EdgeInsets.only(left: 8),
                        alignment: Alignment.centerRight,
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(4),
                            bottomLeft: Radius.circular(4),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 14),
                  Container(
                    height: 2,
                    width: 16,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(4),
                        bottomLeft: Radius.circular(4),
                      ),
                    ),
                  ),
                  const SizedBox(height: 14),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      const Text(
                        '30',
                        style: TextStyle(
                            color: Color(0xFFEBEBEC),
                            fontSize: 12,
                            fontWeight: FontWeight.w400,
                            height: 0.01),
                      ),
                      Container(
                        height: 2,
                        width: 24,
                        margin: const EdgeInsets.only(left: 8),
                        alignment: Alignment.centerRight,
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(4),
                            bottomLeft: Radius.circular(4),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 14),
                  Container(
                    height: 2,
                    width: 16,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(4),
                        bottomLeft: Radius.circular(4),
                      ),
                    ),
                  ),
                  const SizedBox(height: 14),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      const Text(
                        '20',
                        style: TextStyle(
                            color: Color(0xFFEBEBEC),
                            fontSize: 12,
                            fontWeight: FontWeight.w400,
                            height: 0.01),
                      ),
                      Container(
                        height: 2,
                        width: 24,
                        margin: const EdgeInsets.only(left: 8),
                        alignment: Alignment.centerRight,
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(4),
                            bottomLeft: Radius.circular(4),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 14),
                  Container(
                    height: 2,
                    width: 16,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(4),
                        bottomLeft: Radius.circular(4),
                      ),
                    ),
                  ),
                  const SizedBox(height: 14),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      const Text(
                        '10',
                        style: TextStyle(
                            color: Color(0xFFEBEBEC),
                            fontSize: 12,
                            fontWeight: FontWeight.w400,
                            height: 0.01),
                      ),
                      Container(
                        height: 2,
                        width: 24,
                        margin: const EdgeInsets.only(left: 8),
                        alignment: Alignment.centerRight,
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(4),
                            bottomLeft: Radius.circular(4),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 14),
                  Container(
                    height: 2,
                    width: 16,
                    decoration: const BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(4),
                        bottomLeft: Radius.circular(4),
                      ),
                    ),
                  ),
                  const SizedBox(height: 14),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      const Text(
                        '0',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            color: Color(0xFFEBEBEC),
                            fontSize: 12,
                            fontWeight: FontWeight.w400,
                            height: 0.01),
                      ),
                      Container(
                        height: 2,
                        width: 24,
                        margin: const EdgeInsets.only(left: 8),
                        alignment: Alignment.centerRight,
                        decoration: const BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(4),
                            bottomLeft: Radius.circular(4),
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 14),
                ],
              ),
            ),
          ),