如何在分页显示的情况下在listview.builder中显示原生广告? [英] How to Show native ads in listview.builder in flutter with pagination?

问题描述

我正在使用下面的代码，通过使用以Firestore作为数据库的分页来检索flutter应用程序中的列表，效果很好.我指的是原生广告的 flutter_native_admob 依赖性.但是我不知道如何在 listview.builder 中实现它，同时需要实现分页.就像在instagram中一样，在一定数量的帖子之后，原生广告就会显示出来，我需要以类似的方式展示添加的内容.那怎么可能?

I am using below code to retrieve list in flutter application using pagination with firestore as database, which working fine. I am referring flutter_native_admob dependency for the native ads. but I am not able to get the idea how I can implement it in a listview.builder and at the same time I need to implement the pagination. Like in instagram, as after certain number of posts, the native ad shows up, I need to show the add in similar fashion. How is that possible?

  _getProducts() async {
    query = Firestore.instance.collection("users").document(uid).collection('my_favorites').orderBy("timestamp", descending: true).limit(5);
    setState(() {

      _loadingnotifications = true ;
    });

    QuerySnapshot _querySnapshot = await query.getDocuments();


    _lastDocument = _querySnapshot.documents[_querySnapshot.documents.length - 1];

    _notifications = _querySnapshot.documents;
    setState(() {
      _loadingnotifications = false;
    });

  }

  _getMoreNotifications() async {
    print("new docs loaded");
    if(_moreProductsAvailable == false ){
      return;
    }

    if(_loadingMore == true ){

      return;
    }

    _loadingMore = true;
  
    query = Firestore.instance.collection("users").document(uid).collection('my_favorites').orderBy("timestamp", descending: true).startAfter([_lastDocument.data['timestamp']]).limit(5);
    QuerySnapshot _querySnapshot = await query.getDocuments();

    if (_querySnapshot.documents.length <5){
      _moreProductsAvailable = false;
    }
    _lastDocument = _querySnapshot.documents[_querySnapshot.documents.length - 1];

    _notifications.addAll(_querySnapshot.documents);
  
    setState(() {
          _loadingnotifications = false;
    });

    _loadingMore = false;


  }

LISTVIEW.BUILDER

Flexible(
                          child:_loadingnotifications == true ? Container(child: Center(child: Text("Loading..."),),) :Container(child:  _notifications.length == 0? Center(
                          child: Text("No Marked Posts Yet!"),) :
             new ListView.builder(
              controller: _scrollController,
              itemCount: _notifications.length,
              itemBuilder: (BuildContext ctx, int index){


                String itemTitle = _notifications[index].data['itemTitle'];
               

                              return ItemCard(itemTitle: itemTitle,                         );

              }),)
                        ),

我知道如何创建admob帐户并在应用程序中初始化 flutter_native_admob ，但不知道如何像instagram和分页一样将其放入列表中.

I know how to create the admob account and initialize flutter_native_admob in application, but not getting any idea how to put it in list just like instagram alongwith pagination.

推荐答案

您可以在循环中添加计数器变量，在最终列表中添加小部件之前，您可以检查计数器变量是否为5的倍数添加广告小部件，否则添加一个普通小部件，这将在每5个普通小部件之后添加广告到您的列表中.

You can add a counter variable in the loop and before adding widgets in the final List you can check that whenever the counter variable is a multiple of 5 add a ad widget else add a normal widget, this will add ads in your List after every 5 normal widgets.

您可以检查以下内容以供参考: https://medium.com/@ vitopiegari/embedding-ads-into-flutters-widget-tree-with-admob-flutter-ae59c3a66492

You can check this for reference: https://medium.com/@vitopiegari/embedding-ads-into-flutters-widget-tree-with-admob-flutter-ae59c3a66492

这篇关于如何在分页显示的情况下在listview.builder中显示原生广告?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！