On Get data(SubChild key) from firebase realtime database using Streambuilder,data is not in order as it was saved

Viewed 934

Stream Builder Widget shows items not in order as it's in the Firebase database. I have already gone through the solutions such as:

link1 link2 link3 link4

but it did not help as in the link above StreamBuilder with Firebase Realtime database not used.

In firebase It is saved as:

In firebase It is saved as:

The result on emulator:

The result on emulator

List not showing the SubChild Key i.e Date not in the manner as it is saved in the Firebase database.

The StreamBuilder Widget Code is

new StreamBuilder(
      stream: databaseReference.onValue,
      builder: (context, snap) {
        if (snap.connectionState == ConnectionState.active) {
          if (snap.hasData &&
              !snap.hasError &&
              snap.data.snapshot.value != null) {
            Map<dynamic, dynamic> data = snap.data.snapshot.value;
            print("data is $data");
            List item = [];
            data.forEach((index, data)=>item.add({
              "key":index, ...data
            }));
            //data.forEach((index, data) => item.add({"key": index, ...data}));
            return item.length == 0
                ? Container(
              alignment: FractionalOffset.center,
              child: new Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Icon(
                    Icons.error,
                    size: 24.0,
                  ),
                  new Text('No Data Found')
                ],
              ),
            )
                : Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: GridView.builder(
                  physics: ClampingScrollPhysics(),
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        itemCount: item.length,
        gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        childAspectRatio: 1.0,
        mainAxisSpacing: 2.0,
        crossAxisSpacing: 2.0,
        ),
        itemBuilder: (BuildContext context, int index) =>new GestureDetector(
        child: GestureDetector(
          onTap: (){
            Navigator.push(context,MaterialPageRoute(builder:(context)=>NavigationBarScreen(item[index]['key'].toString())));
          },
          child: new Card(
            elevation: 4.0,
            color: ConstantColors.PrimaryAssentColor,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Icon(Icons.date_range,color: Colors.white,),
                new Text(item[index]['key'],style: new TextStyle(color: Colors.white,fontFamily: 'BlacksOps',)),
              ],
            ),
          ),
        ),
        )),
                );
          }
0 Answers
Related