Question

我正在尝试制作带有轮播滑块的应用程序，但是当我启用自动播放功能时，自动播放功能无法实现

我的应用程序在主体顶部包含一个轮播滑块，在应用程序的其余部分包含另一个按钮

所以我将旋转木马滑块放入容器女巫中，它的孩子是一列

并插入我的轮播滑块和其余页面小部件

有什么办法可以使其自动播放？

class AdminContentState extends State<AdminContent> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          CarouselSlider(
            enlargeCenterPage: true,
            enableInfiniteScroll: true,
            autoPlayAnimationDuration: Duration(seconds: 1),
            autoPlayCurve: Curves.linear,
            height: MediaQuery.of(context).size.height * 0.35,
            autoPlay: true,
            reverse: false,
            autoPlayInterval: Duration(seconds: 3),
            pauseAutoPlayOnTouch: Duration(seconds: 10),
            // autoPlayInterval: Duration(seconds: 1),
            items: [
              'assets/news0.png',
              'assets/news1.png',
              'assets/news2.png',
            ].map((i) {
              return Builder(
                builder: (BuildContext context) {
                  return Container(
                    width: MediaQuery.of(context).size.width,
                    margin: EdgeInsets.symmetric(horizontal: 5.0),
                    decoration: BoxDecoration(color: Colors.white),
                    child: GestureDetector(
                      child: Image.asset(i, fit: BoxFit.fill),
                      onTap: () {
                        Navigator.pushReplacement(
                          context,
                          MaterialPageRoute(
                              builder: (BuildContext context) => NewsPage()),
                        );
                      },
                    ),
                  );
                },
              );
            }).toList(),
          ),
          Expanded(),

Answer 1

CarouselSlider已经是自动的，这是我的代码对我来说很好用，您添加了（项目）的子代

 static List<String> imgList;
  int _current = 0;

static List<T> map<T>(List list, Function handler) {
    List<T> result = [];
    for (var i = 0; i < list.length; i++) {
      result.add(handler(i, list[i]));
    }

    return result;
  }    

         static List child = imgList.length > 0 ?  map<Widget>(
            imgList,
            (index, i) {
              return Container(
                margin: EdgeInsets.all(5.0),
                child: ClipRRect(
                  borderRadius: BorderRadius.all(Radius.circular(5.0)),
                  child: Stack(children: <Widget>[
                    Image.network(i, fit: BoxFit.cover, width: 1000.0),
                    Positioned(
                      bottom: 0.0,
                      left: 0.0,
                      right: 0.0,
                      child: Container(
                        decoration: BoxDecoration(
                          gradient: LinearGradient(
                            colors: [
                              Color.fromARGB(200, 0, 0, 0),
                              Color.fromARGB(0, 0, 0, 0)
                            ],
                            begin: Alignment.bottomCenter,
                            end: Alignment.topCenter,
                          ),
                        ),
                        padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
                        child: Text(
                          'No. $index image',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 20.0,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                    ),
                  ]),
                ),
              );
            },
          ).toList():null;

        //then you build your slider

             CarouselSlider(
                items: child,
                autoPlay: true,
                enlargeCenterPage: true,
                aspectRatio: 2.0,
                onPageChanged: (index) {
                  setState(() {
                    _current = index;
                  });
                },
              ),

轮播滑块自动播放

1 个答案: