Flutter 使用PageView 自定义无限轮播

import 'package:flutter/material.dart';

int _getRealIndex(int index, int length) {
  return index >= length ? index % length : index;
}

class InfinitySlider extends StatefulWidget {
  final int initialPage;
  final List<Widget> items;
  final double height;
  final PageController pageController;

  InfinitySlider({
    Key? key,
    required this.items,
    this.height = 10,
    this.initialPage = 0,
  })  : pageController =
            PageController(initialPage: items.length + initialPage),
        assert(items.isNotEmpty),
        super(key: key);

  @override
  State<InfinitySlider> createState() => _InfinitySliderState();
}

class _InfinitySliderState extends State<InfinitySlider> {
  int length = 0;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    setState(() {
      length = widget.items.length;
    });
    widget.pageController.addListener(pageListener);
  }

  void pageListener() {
    double mediaWidth = MediaQuery.of(context).size.width;
    double page = widget.pageController.page as double;
    if (page == 0 || page >= (length * 2)) {
      double pixels = mediaWidth * (length + page % length);
      widget.pageController.position.setPixels(pixels);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(
          height: widget.height,
          child: PageView.builder(
            itemBuilder: (BuildContext context, int i) {
              final int index = _getRealIndex(i, length);
              return widget.items[index];
            },
            controller: widget.pageController,
          ),
        ),
      ],
    );
  }
}

posted @   angelwgh  阅读(220)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库
· SQL Server 2025 AI相关能力初探
· 为什么 退出登录 或 修改密码 无法使 token 失效
点击右上角即可分享
微信分享提示