Question

我有4个标签，我想在其中添加延迟加载或无限滚动选项。之前我尝试过使用Scroll Controller，但是当它到达终点时。事件触发不止一次。因此，有多个对API的Future http请求。

我在SO上阅读了一些问题，发现我可能需要使用NotificationListener。我不确定是否需要一次或为所有选项卡定义它。我不知道如何使用NotificationListener。

class _Searchstate extends State<Search> with SingleTickerProviderStateMixin{
  ScrollController _scrollController = new ScrollController();

  final _scaffoldKey = GlobalKey<ScaffoldState>();
   TabController _controller;



TabBarView(
          controller: _controller,
          children: [
           // Text("TAB ONE CONTENT"),
           RefreshIndicator(
            onRefresh: refreshData, 
           child:Container(
                decoration: BoxDecoration(
                  color: Colors.black87,
                ),
                padding: EdgeInsets.only(top: 10, bottom: 5),
                height: MediaQuery.of(context).size.height,
                width: double.infinity,
                child: ListView.builder(
                    controller: _scrollcontroller,
                    itemCount: (recommended) ? lists.length : searchlists.length,
                    itemBuilder: (BuildContext context, int index) {
                      return buildList1(context, index);
                    }),
              ),
           ),
            //Text("TAB TWO CONTENT"),
            RefreshIndicator(
            onRefresh: refreshData1, 
            child:Container(
                decoration: BoxDecoration(
                  color: Colors.black54,
                ),
                padding: EdgeInsets.only(top: 10, bottom: 5),
                height: MediaQuery.of(context).size.height,
                width: double.infinity,
                child: ListView.builder(
                    controller: _scrollcontroller,
                    itemCount: (nearme) ? lists1.length : searchlists1.length, 
                    itemBuilder: (BuildContext context, int index) {
                      return buildList2(context, index);
                    }),
              ),
            ),

下面是buildList，其中我正在使用Listview.Builder来显示来自数据库的数据。我也尝试像下面这样使用ScrollController。

Widget buildList1(BuildContext context, int index) {
     
              _scrollController.addListener((){
          print(_scrollController.position.pixels);
          print(_scrollController.position.maxScrollExtent);
          if(_scrollController.position.pixels == _scrollController.position.maxScrollExtent){
            print(recommended);
             if(recommended){
               //getData();
               print('getData()1;');
             }
          //   getData();

          }  
        });

我仅在此问题中添加了一些相关代码，因为完整代码非常长。让我知道您是否需要更多代码。

编辑：

我尝试使用Notification侦听器，如果我在SCaffold周围对其进行一次定义，则它至少可以正常工作，但我可以看到滚动事件，但是我有4个选项卡，我不确定如何为所有人实现它。因为要为这4个标签设置条件非常困难。

  @override
  Widget build(BuildContext context) {
       return NotificationListener<ScrollNotification>(
       child:Scaffold(

---- -- - - - - - More Codes -----
 onNotification: (notificationInfo) {
          if (notificationInfo is ScrollEndNotification) {
            print("scroll");
            print("detail:"+notificationInfo.dragDetails.toString());
            /// your code
          }
          return true;
        },
      );

我尝试在选项卡中放入相同的代码，但未检测到滚动事件。

Answer 1

我设法使其正常工作，但不确定这是否有效。也许其他可能遇到过类似问题的人也会如此。

下面的代码将有助于识别活动标签。

void initState(){ 
        _controller = TabController(vsync: this, length: 4);
        currentTab = (_controller.index);
        _controller.addListener(() {
        if(_controller.indexIsChanging) {
          print("tab is animating. from active (getting the index) to inactive(getting the index) ");
        }else {
          //tab is finished animating you get the current index
          print(_controller.index);
          currentTab = (_controller.index);
          _handleTabSelection();
        }
      });

以及下面的代码我已添加到NotificationListner中。

  onNotification: (notificationInfo) {
          if (notificationInfo is ScrollEndNotification && notificationInfo.metrics.pixels == notificationInfo.metrics.maxScrollExtent) {
            print("scroll");
              if(currentTab == 0){
                if(recommended == true && tab0 == 'Suggested' ){
                  // getData();
                 print('fire the 1 event');
                }else{
                  print('Name()1;');
                }
              }
             if(currentTab == 1){
                if(nearme == true && tab1 == 'Near Me'){
                  //getData();
                  print('fire the 2nd event ');
                }else{

                }
             }
             if(currentTab == 2){
                if(byRating == true && tab2 == 'By Rating'){
                  //getData();
                  print('fire the 3rd event');
                }else{
                  
                }
             }

             if(currentTab == 3){
                if(byprice == true && tab3 == 'Active'){
                  //getData();
                  print('fire the 4 event');
                }else{

                }
             }
            /// your code
          }
          return true;
        },
      );

编辑：由于我多次点击，因此上述代码也在左右滚动时触发。为防止这种情况，我将代码更改为如下。

if (notificationInfo is ScrollEndNotification && notificationInfo.metrics.axisDirection == AxisDirection.down  && notificationInfo.metrics.pixels == notificationInfo.metrics.maxScrollExtent) {

颤动：TabController中的NotificationListener用于无限滚动

1 个答案: