list - 实现页面轮播指示器小部件

Question

所以，我制作了一个滑动点小部件，它可以正常工作。假设我们将有 20 个菜单。显示 20 个点不是一个好的选择。我怎样才能只显示五个并每 4 页切换到下一个？

class SlideDots extends StatelessWidget {
  final int currentIndex;
  final int length;

  const SlideDots({Key? key, required this.currentIndex, required this.length})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: List.generate(length, (index) => buildDot(index, context)),
    );
  }

  Container buildDot(int index, BuildContext context) {
    return Container(
      height: 10,
      width: 10,
      margin: EdgeInsets.only(right: 5),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(20),
        color: currentIndex == index
            ? Colors.white
            : Colors.white.withOpacity(0.5),
      ),
    );
  }
}

标签： listflutterviewslidercarousel