android - Flutter Swiper，带有小部件列表

Question

我正在创建一个应用程序，其中使用Flutter_Swiper构成了滚动 View 。
问题是我不知道如何在Swiper中放置小部件列表。
让我用一个例子来解释:

  Widget build(BuildContext context) {
  return new Container(
     child: new Swiper(
       itemBuilder: (BuildContext context, int index) {
          return MyWidget(id: 1, text: "hello");

       },
     itemCount: 10,
     viewportFraction: 0.8,
     scale: 0.85,
     )
  );
  }

这是官方Wiki提供给我的代码，虽然可以使用，但显然每次都向我显示相同的小部件。
因此，为此，我创建了一个如下结构:

class MyStructure{
   final int id;
   final String text;
   MyStructure({this.id, this.text});
}

然后，我创建了一个像这样的小部件:

class MyWidget extends StatelessWidget{
   final MyStructure widgetStructure;
   MyWidget(this.widgetStructure);

   @override
   Widget build(BuildContext context) {
      return Container(
         child: Text(widgetStructure.id, widgetStructure.text);
         ...
      )
   }
}

然后，我创建了这样的结构列表:

  List<MyStructure> widgetList;
  widgetList= [MyStructure(
     id = 1;
     text = "a text"
  )];

因此，现在我可以创建一个小部件列表，只需执行以下操作即可:

return new Row(children: widgetList.map((item) => new MyWidget(item)).toList());

而且，从理论上讲，它是可行的，但我不知道如何将其与滑动器一起使用。

Answer 1

在演示中，widgetList的长度为10。您可以在下面看到完整的代码

完整的代码

import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new InnerSwiper(),
    );
  }
}

class MyStructure {
  final int id;
  final String text;
  MyStructure({this.id, this.text});
}

class MyWidget extends StatelessWidget {
  final MyStructure widgetStructure;
  MyWidget(this.widgetStructure);

  @override
  Widget build(BuildContext context) {
    return Container(
        color: Colors.green,
        child: Text('${widgetStructure.id} ${widgetStructure.text}')
    );
  }
}

class InnerSwiper extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new _InnerSwiperState();
  }
}

class _InnerSwiperState extends State<InnerSwiper> {
  SwiperController controller;

  List<bool> autoplayes;

  List<SwiperController> controllers;
  List<MyStructure> widgetList = [];

  @override
  void initState() {
    controller = new SwiperController();
    autoplayes = new List()
      ..length = 10
      ..fillRange(0, 10, false);
    controllers = new List()
      ..length = 10
      ..fillRange(0, 10, new SwiperController());

    for(int i=0;i < 10; i++) {
      widgetList.add(MyStructure(id:i,text: ' this is index ${i}'));
    }

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: new Scaffold(
        body: new Swiper(
          loop: false,
          itemCount: widgetList.length,
          controller: controller,
          pagination: new SwiperPagination(),
          itemBuilder: (BuildContext context, int index) {
            return new Column(
              children: <Widget>[
                new SizedBox(
                  child: new Swiper(
                    controller: controllers[index],
                    pagination: new SwiperPagination(),
                    itemCount: widgetList.length,
                    itemBuilder: (BuildContext context, int index) {
                      return MyWidget(widgetList[index]);
                    },
                    autoplay: autoplayes[index],
                  ),
                  height: 300.0,
                ),
                new RaisedButton(
                  onPressed: () {
                    setState(() {
                      autoplayes[index] = true;
                    });
                  },
                  child: new Text("Start autoplay"),
                ),
                new RaisedButton(
                  onPressed: () {
                    setState(() {
                      autoplayes[index] = false;
                    });
                  },
                  child: new Text("End autoplay"),
                ),
                new Text("is autoplay: ${autoplayes[index]}")
              ],
            );
          },
        ),
      ),
    );
  }
}