How to Show native ads in listview.builder in flutter with pagination?

问题

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,                         );

              }),)
                        ),

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.

回答1:

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.

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

来源：https://stackoverflow.com/questions/63443172/how-to-show-native-ads-in-listview-builder-in-flutter-with-pagination

标签

firebase

Flutter

google-cloud-firestore

pagination

native-ads