RangeError (index): Invalid value: Valid value range is empty: 0 RangeError (index): Invalid value: Valid value range is empty: 0 dart dart

RangeError (index): Invalid value: Valid value range is empty: 0


Make sure specifying the length of the list of data. For example, if you're using ListView.builder give proper value to the attribute itemCount.

ListView.builder(            itemCount: snapshot.data.length,            itemBuilder: (ctx, index) {              return WidgetItem();            });


There are quick-and-dirty answer, and proper answer

Quick-and-dirty

Use list?.elementAt(<index>) ?? "" for safe access to element of a list

Widget build(context) {    try{      if (isFirst == true) {        fetchImage();        fetchCategories(context);        isFirst = false;      }    }catch(Exception){    }    return MaterialApp(      home: Scaffold(        backgroundColor: Colors.black,        appBar: AppBar(          title: Text('Lets see images!'),        ),        body: new Column(          children: <Widget>[            new Row(              mainAxisAlignment: MainAxisAlignment.center,              children: <Widget>[                new InkResponse(                    child: new Column(                      children: <Widget>[                        Padding(                          padding: EdgeInsets.all(10.0),                          child: new Image.asset(                            catimages?.elementAt(0) ?? "",                            width: 60.0,                            height: 60.0,                          ),                        ),                        new Text(                          categoriesText?.elementAt(0) ?? "",                          style: TextStyle(color: Colors.white),                        ),                      ],                    ),                    onTap: () {                      debugPrint("on tv clikced");                      widget.fetchApI.fetchSubCategories(context, 6);                    }),                new InkResponse(                  child: new Column(                    children: <Widget>[                      Padding(                        padding: EdgeInsets.all(10.0),                        child: new Image.asset(                          catimages?.elementAt(1) ?? "",                          width: 60.0,                          height: 60.0,                        ),                      ),                      new Text(                        categoriesText?.elementAt(1) ?? "",                        style: TextStyle(color: Colors.white),                      ),                    ],                  ),                  onTap: () {                    debugPrint("on moview clicked");                    widget. fetchApI.fetchSubCategories(context, 7);                  },                ),                new InkResponse(                  child: new Column(                    children: <Widget>[                      Padding(                        padding: EdgeInsets.all(10.0),                        child: new Image.asset(                          catimages?.elementAt(2) ?? "",                          width: 60.0,                          height: 60.0,                        ),                      ),                      new Text(                       categoriesText?.elementAt(2) ?? "",                        style: TextStyle(color: Colors.white),                      ),                    ],                  ),                  onTap: () {                    debugPrint("on news clicked");                    widget.fetchApI.fetchSubCategories(context, 10);                  },                ),                new InkResponse(                  child: new Column(                    children: <Widget>[                      Padding(                        padding: EdgeInsets.all(10.0),                        child: new Image.asset(catimages?.elementAt(3) ?? "",                            width: 60.0, height: 60.0),                      ),                      new Text(                        categoriesText?.elementAt(3) ?? "",                        style: TextStyle(color: Colors.white),                      ),                    ],                  ),                  onTap: () {                    debugPrint('on shows clicked');                    widget.fetchApI.fetchSubCategories(context, 8);                  },                ),                new InkResponse(                  child: new Column(                    children: <Widget>[                      Padding(                        padding: EdgeInsets.all(10.0),                        child: new Image.asset('assets/live_icon.png',                            width: 60.0, height: 60.0),                      ),                      new Text(                        'Live',                        style: TextStyle(color: Colors.white),                      ),                    ],                  ),                  onTap: () {                    debugPrint('on live clicked');                  },                ),              ],            ),            ImageList(images,widget.fetchApI),          ],        ),      ),    );  }}

Proper answer

Frankly, if I were to review this code, even if it works seamlessly, I would reject this change, because of the structure/pattern this code is using is quite bad.

Please use FutureBuilder, StreamBuilder or ValueListenableBuilder instead, but you need to provide more code (especially fetchImage and fetchCategories) for us to help.


The problem can be that you are trying to access a variable/array that is not ready yet (maybe because the future/api call is not finished)

A quick workaround could be to check the length of the array or check for null, example:

Text( (myArray?.length > 0 ? myArray[0] : '') );