首页 > 解决方案 > 颤振在 sliver 列表上每 x 次添加一个项目

问题描述

我需要在我的条子列表的第 6 个帖子之后展示一个广告,现在我正在执行以下方法并且它正在工作,但它正在替换广告中的一个帖子,而不是实际添加它。

SliverList(
   delegate: SliverChildBuilderDelegate((context, i) {
      if ( i != 0 && i % 6 == 0 ) { // this replacing each 6th on the list not adding new
         // return ad widget
      }
      // return list item
   },
   childCount: dynamicListLength
)

标签: androidiosflutterdartflutter-layout

解决方案


以下是您可以使用的方法ListView.builder(很容易适应SliverList):

import 'package:flutter/material.dart';

// Represents the default item
class ItemWidget extends StatelessWidget {
  final String text;
  
  const ItemWidget(this.text);
  
  @override
  Widget build(BuildContext context) {
    return Container(color: Colors.green, child: Text(text));    
  }
}

// Represents the ad widget
class AdWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(color: Colors.red, child: Text("Ad"));    
  }
}

class Screen extends StatelessWidget {
  final List<Widget> children;
  
  const Screen({this.children});
  
  @override
  Widget build(BuildContext context) {
    const int every = 6;
    
    final int size = children.length + children.length ~/ every;
    final List<Widget> items = List.generate(size, (i) {
      if (i != 0 && i % every == 0) return AdWidget();
      return children[i - i ~/ every];
    });
    
    return ListView.builder(
      itemBuilder: (_, i) => items[i],
      itemCount: items.length,
    );  
  }
}

然后你可以像这样使用它:

Screen(children: [for (int i = 0; i < 30; i++) ItemWidget("$i")]);

推荐阅读