如何在 itemBuilder flutter 中使用 for 循环

Question

我正在尝试在 itemBuilder 中使用 for 循环来显示内嵌广告，我有两个 ListView.separated 一个是来自数据 api 的列表，第二个来自 admob 广告，我的代码工作正常并显示广告，但它只显示一次，因为我使用了这行代码，我想将其转换为 for 循环，但我不知道如何更改这行代码

if (index == 10) { return _getAdWidget();}

我想将其转换为 for 循环并每 10 个索引执行一次，请帮助

这是我的代码

Widget build(BuildContext context) {
return MaterialApp(
    debugShowCheckedModeBanner: false,
    home: Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: true,
        backgroundColor: Colors.black,
        title: Text("طرائف عن الحيوانات"),
        centerTitle: true,
      ),
      backgroundColor: Colors.grey[900],
      body: FutureBuilder(
          future: getData(),
          builder: (BuildContext context, AsyncSnapshot snapshot) {
            List snap = snapshot.data;

            if (snapshot.connectionState == ConnectionState.waiting) {
              return Center(child: CircularProgressIndicator());
            }
            if (snapshot.hasError) {
              return Center(
                child: Text("error"),
              );
            }
            return ListView.separated(
              itemCount: snap.length,
              separatorBuilder: (context, index) {
                final data = snap[index];
                final dataJoke = data["joke"];
                final dataAnswer = data["answer"];

                return Card(
                  elevation: 6,
                  margin: EdgeInsets.all(10),
                  child: Container(
                    decoration: BoxDecoration(
                      image: DecorationImage(
                        image: AssetImage("images/110.png"),
                        fit: BoxFit.cover,
                      ),
                    ),
                    child: ListTile(
                      title: Text(
                        " ${snap[index]['joke']}",
                        textDirection: TextDirection.rtl,
                        style: TextStyle(
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      subtitle: Text(
                        " ${snap[index]['answer']}",
                        textDirection: TextDirection.rtl,
                        style: TextStyle(
                            fontSize: 18, fontWeight: FontWeight.w600),
                      ),
                      trailing: ElevatedButton(
                        style: ElevatedButton.styleFrom(
                            minimumSize: Size(1, 30),
                            primary: Colors.grey[900], // background
                            onPrimary: Colors.yellow,
                            elevation: 0),
                        onPressed: () async {
                          const urlPreview =
                              "https://www.youtube.com/watch?v=CNUBhb_cM6E";
                          await Share.share(
                              "$dataJoke \n $dataAnswer \n للمزيد من الطرائف\n$urlPreview");
                        },
                        child: Icon(Icons.share_outlined),
                      ),
                    ),
                  ),
                );
              },
              itemBuilder: (BuildContext context, int index) {
                if (index == 10) {
                  return _getAdWidget();
                }

Answer 1

试试这个：

return ListView.builder(
   itemCount: snap.length + (snap.length ~/ 10),
   itemBuilder: (BuildContext context, int index) {
     if (index % 10 == 0) {
        return _getAdWidget();
     }
     final data = snap[index];
     final dataJoke = data["joke"];
     final dataAnswer = data["answer"];

     return Card(
        elevation: 6,
        margin: EdgeInsets.all(10),
        child: Container(
            decoration: BoxDecoration(
            image: DecorationImage(
                 image: AssetImage("images/110.png"),
                 fit: BoxFit.cover,
             ),
         ),
         child: ListTile(
                      title: Text(
                        " ${snap[index]['joke']}",
                        textDirection: TextDirection.rtl,
                        style: TextStyle(
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      subtitle: Text(
                        " ${snap[index]['answer']}",
                        textDirection: TextDirection.rtl,
                        style: TextStyle(
                            fontSize: 18, fontWeight: FontWeight.w600),
                      ),
                      trailing: ElevatedButton(
                        style: ElevatedButton.styleFrom(
                            minimumSize: Size(1, 30),
                            primary: Colors.grey[900], // background
                            onPrimary: Colors.yellow,
                            elevation: 0),
                        onPressed: () async {
                          const urlPreview =
                              "https://www.youtube.com/watch?v=CNUBhb_cM6E";
                          await Share.share(
                              "$dataJoke \n $dataAnswer \n للمزيد من الطرائف\n$urlPreview");
                        },
                        child: Icon(Icons.share_outlined),
                      ),
                    ),
                  ),
                );

Answer 2

很简单，改一下这行代码试试

if (index == 10) {
                  return _getAdWidget();
                }

至

if (index % 10 == 5) {
                  return _getAdWidget();
                }

如何在 itemBuilder flutter 中使用 for 循环

how to use for loop inside itemBuilder flutter

dart

flutter

flutter-layout