Showing database in flutter

Question

I have a problem with showing a database in my app. Here's the code.

SingleChildScrollView(
  child: Center(
    child: Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          StreamBuilder(
              stream: myRef.orderByKey().limitToFirst(10).onValue,
              builder: ((context, snapshot) {
                if (snapshot.hasData) {
                  final itemInfo = Map<String, dynamic>.from(
                      (snapshot.data!).snapshot.value as Map);
                  itemInfo.forEach((key, value) {
                    final nextItem = Map<String, dynamic>.from(value);
                    for (int i = 0; i < itemInfo.length; i++) {
                      List<dynamic> item = List.empty(growable: true);
                      item.add(key.toString());
                      item.add(nextItem['Descripcion']);
                      item.add(nextItem['Cant']);
                      item.add(nextItem['Ubicacion']);
                      item.add(nextItem['Um']);
                      item.add(nextItem['X']);
                      itemsList.add(item);
                    }
                  });
                }
                return Text('${itemsList.toString()}\n');
              })),
        ],
      ),
    ),
  ),
),

Here's the app screen

database

The problem is that the StreamBuilder is showing the first 10 values from the database 10 times. I want to show only one time.

I don't immediately see where the duplication would come from in the code you shared. I recommend setting a breakpoint on `if (snapshot.hasData) {`, running in the debugger, and stepping through the code line by line to check where the duplicates come from. — Frank van Puffelen, Nov 29 '22 at 14:28
It's seem that `itemInfo.forEach` get the key from the `snapshot.data` and enters in the for loop and do the iterations 10 times, then changes to the next key and do it the same. I don't understand why the key doesn't change with each iteration — Juan Peralta Torres, Nov 30 '22 at 02:53
I don't know that either. Keep in mind that we can't see how `myRef` and what the JSON in the database is that it points to. The output in the screenshot may make sense to you, but it's pretty unreadable to me. — Frank van Puffelen, Nov 30 '22 at 04:48
The keys in my JSON are the 8-digit codes showed in the screenshot. But don't worry, I solved the problem, the `StreamBuilder` works like a loop too. So the for loop was needless here. Thank you for your help. — Juan Peralta Torres, Nov 30 '22 at 14:12
myRef.orderByKey().limitToFirst(10).onValue should be assigned to a variable in initState and then the variable used as the stream: parameter. Otherwise, every time the build runs, the database call is rerun. — GrahamD, Nov 30 '22 at 19:31

score 1 · Accepted Answer · answered Jan 11 '23 at 17:21

SOLVED

The StreamBuilder works like a loop, too. So the for loop was needless here.

So, the code changes to this:

if (snapshot.hasData) {
                  final itemInfo = Map<String, dynamic>.from(
                      (snapshot.data!).snapshot.value as Map);
                  itemInfo.forEach((key, value) {
                    final nextItem = Map<String, dynamic>.from(value);
                    List<dynamic> item = List.empty(growable: true);
                    item.add(key.toString());
                    item.add(nextItem['Descripcion']);
                    item.add(nextItem['Cant']);
                    item.add(nextItem['Ubicacion']);
                    item.add(nextItem['Um']);
                    item.add(nextItem['X']);
                    itemsList.add(item);
                  });
                }

Showing database in flutter

1 Answers1