1

Here is my code which has a list view and I am getting data from api in count 10. When I scroll and when the list empty I want to show empty list widget but in my case as soon as I get empty result it shows the empty widget but whole list become diappear. Or Emplty list widget replace the listview. Please help me to fix it.

class ReportVideoVerification extends StatefulWidget {
  final AdminUserDetails userDetails;
  final String title;

  const ReportVideoVerification({Key key, this.title, this.userDetails}) : super(key: key);

  @override
  _ReportVideoVerificationState createState() => _ReportVideoVerificationState();
}

class _ReportVideoVerificationState extends State<ReportVideoVerification> {
  TextEditingController fromDateController = TextEditingController();
  TextEditingController toDateController = TextEditingController();
  TextEditingController textController = TextEditingController();

  String fromDate = "",
      toDate = "";
  int limit = Consts.limit;
  static int page = 0; //offset
  ScrollController _sc = new ScrollController();
  bool isLoading = false;

  List<VideoVerificationReportResult> _vvList = new List();
  List<VideoVerificationReportResult> _filteredVvList;
  Future<VideoVerificationReport> _videoVerificationReportResponse;

  @override
  void initState() {
    print('init');
    
    resetFilter();
    super.initState();
    _sc.addListener(() {
      if (_sc.position.pixels == _sc.position.maxScrollExtent) {
        getVideoReportData(page);
      }
    });
  }
  @override
  void dispose() {
    print('disposes');
    page = 0;
    _sc.dispose();
    super.dispose();
  }
  


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBarWidget(
        title: (widget.title != null && widget.title.isNotEmpty)
            ? widget.title
            : "Video Verification Reports",
        actions: [
          AppBarLogo(),
        ],
      ),
      body: Column(children: [
        _searchWidget(),
        VerticalSpacing(5.0),
        Expanded(
            child: FutureBuilder<VideoVerificationReport>(
                future: _videoVerificationReportResponse,
                builder: (BuildContext context,
                    AsyncSnapshot<VideoVerificationReport> snapshot) {
                  if (snapshot.hasData) {
                    if (snapshot.data.result != null &&
                        snapshot.data.result.length != 0) {
                      return _buildList();
                    }
                    else
                       { return EmptyListWidget() ; }
                  } else {
                    return Center(child: LoadingIndicatorWidget());
                  }
                }))
      ]),
      resizeToAvoidBottomInset: false,
    );
  }
  Widget _buildProgressIndicator() {
    return new Padding(
      padding: const EdgeInsets.all(8.0),
      child: new Center(
        child: new Opacity(
          opacity: isLoading ? 1.0 : 00,
          child: new CircularProgressIndicator(),
        ),
      ),
    );
  }

  Widget _buildList() {
    int itemCount = _filteredVvList != null
        ? _filteredVvList.length
        : _vvList.length + 1;
    return
      ListView.builder(
        itemCount: itemCount, // Add one more item for progress indicator
        padding: EdgeInsets.symmetric(vertical: 8.0),
        itemBuilder: (BuildContext context, int index) {
          if (index == _vvList.length) {
            return _buildProgressIndicator();
          } else {
            return Column(
              children: <Widget>[
                Card(
               //list data
                ),
                if (index == _vvList.length - 1 && isLoading == false)
                  WidgetHelper.getLoaderEndText(context)
              ],
            );
          }
        },
        controller: _sc,
      );
  }

 


  Future<VideoVerificationReport> getProjectDetails() async {
    var result = await  videoVerificationReportRequest(
        context,
        widget.userDetails.result.raLoginId,
        limit.toString(),
        page.toString(),
        fromDate,
        toDate);
    return result;
  }

  getVideoReportData(int index) async {
    if (!isLoading) {
      if (this.mounted) {
        setState(() {
          isLoading = true;
        });
      }
      print('value of page:' + page.toString());
      try {
        _videoVerificationReportResponse = getProjectDetails();
        _videoVerificationReportResponse.then((response) {
          if (response != null) {
            List<VideoVerificationReportResult> result = new List();
            if (response.result != null) {
              print(response.success.toString());
              if (response.success == true) {
                result = response.result;
              } else {
                raisedToast(context, Consts.API_Msg_no_record, true, null);
              }
            }
            if (this.mounted) {
              setState(() {
                isLoading = false;
                if (response.result != null && response.result.length > 0) {
                  _vvList.addAll(result);
                }
                page = page + limit;
              });
            }
          }
        });
      } on Error catch (e) {
        print('error::: connectTimeout' + e.toString());
      }
    }
  }

}

My empty Widget :

 Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 30),
      child: Card(
        child: ListTile(
          title: Column(
            children: <Widget>[
              Icon(
                Icons.tag_faces,
                color: Theme.of(context).primaryColor,
                size: 35.0,
              ),
              SizedBox(
                height: 5.0,
              ),
              Text(
                "No Record Found",
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 18.0, color: Colors.black87),
              ),
            ],
          ),
        ),
      ),
    );
  }

1 Answer 1

2

You can remove the length != 0 condition from this part like so

if (snapshot.data.result != null) {
  return _buildList();
} else { 
  return EmptyListWidget();
}

And instead handle it in _buildList() like so

int itemCount = _filteredVvList != null
        ? _filteredVvList.length
        : _vvList.length != 0 ? _vvList.length + 1 : 0;

To say so when there is no more data, you can have a bool like so

bool noMoreData = false;

and change it to true here

if (response.result != null) {
  if (response.result.length > 0)
    _vvList.addAll(result);
  else
    noMoreData = true;
}

and use it in buildList() like so

if (index == _vvList.length) {
  return noMoreData ? EmptyListWidget() : _buildProgressIndicator();
}
Sign up to request clarification or add additional context in comments.

8 Comments

it never shows the empty widget even when I get "result":[]
It is supposed to show an empty list only when there are no items in the list, right? Like even the first 10 items are not there. The change I suggested is intended to do that.
yes it works but the problem is when i ask for more data from api and when the no more data available api sends me empty array and this time my whole list is replaced by empty array. I am not getting a way to show empty list widget with pagination
With these changes, it should not replace the whole list which was already there. Do you mean it is still replacing the existing list with an empty list after the suggested changes?
the change you have suggested is not showing empty widget it shows a blank screen when result array is empty but yes it is not replacing the list when there is data. now how to show empty widget when result empty ?
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.