Home > Software engineering >  How to solve problem with nested ListView.builder?
How to solve problem with nested ListView.builder?

Time:06-28

I'm developing a Flutter app. I encountered an error placing a ListView.builder inside my widget tree.

I'm receiving a few errors depending different widgets. However, all of them state the same problem: Failed assertion: line 1979 pos 12: 'hasSize

The last error I have received:
======== Exception caught by rendering library =====================================================
The following assertion was thrown during paint():
RenderBox was not laid out: RenderRepaintBoundary#bc86b relayoutBoundary=up5 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1979 pos 12: 'hasSize'


Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
  https://github.com/flutter/flutter/issues/new?template=2_bug.md

The relevant error-causing widget was: 
  Column Column:file:///Users/julianmodlinski/StudioProjects/caralgo_mobile_app/lib/widgets/map_page.dart:137:22

The code structure is as following:

MainPage.dart
Scaffold(
      body: SafeArea(
        child: _pages.elementAt(_selectedIndex),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
              icon: ImageIcon(
                AssetImage('assets/images/informations_logo.png'),
                size: 40,
              ),
              label: 'Informations'
          ),
          BottomNavigationBarItem(
              icon: ImageIcon(
                AssetImage('assets/images/localisation_logo.png'),
                size: 40,
              ),
              label: 'Localisation'
          ),
          BottomNavigationBarItem(
              icon: ImageIcon(
                AssetImage('assets/images/new_button.png'),
                size: 70,
                color: Constants.colorOrange,
              ),
              label: 'Add new info card'
          ),
          BottomNavigationBarItem(
              icon: ImageIcon(
                AssetImage('assets/images/reservations_logo.png'),
                size: 40,
              ),
              label: 'Reservations'
          ),
          BottomNavigationBarItem(
              icon: ImageIcon(
                AssetImage('assets/images/profile_logo.png'),
                size: 40,
              ),
              label: 'Profile'
          ),
        ],
        currentIndex: _selectedIndex,
        onTap: _onItemTapped,
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          if(_bleDeviceProvider.bluetoothDeviceState == BluetoothDeviceState.connected){
            _bleDeviceProvider.getLoRaMessages(_user);
          }
        },
      ),
    );

MapPage.dart
Stack(
      alignment: Alignment.center,
      children: [
        buildColumn(context),
        Visibility(
          visible: _chosenVehiclePosition != null,
          child: Align(
            alignment: Alignment.bottomCenter,
            child: Padding(
                padding: const EdgeInsets.fromLTRB(0, 0, 0, 30),
                child: ElevatedButton(
                    child: Text(S.of(context).navigateToVehicle),
                    onPressed: () async {
                      String googleUrl = 'https://www.google.com/maps/search/?api=1&query=${_chosenVehiclePosition.latitude.toString()},${_chosenVehiclePosition.longitude.toString()}';
                      if (await canLaunch(googleUrl)) {
                        await launch(googleUrl);
                      } else {
                        throw 'Could not open the map.';
                      }
                    })
            ),
          ),
        )
      ],
    );

buildColumn()
Column(
        children: [
          const Text(
            "Localisations",
            style: TextStyle(
                fontSize: 36,
                fontWeight: FontWeight.w400,
                fontFamily: "Comfortaa"
            ),
          ),
          const SizedBox(height: 5),
          Flexible(
            child: FutureBuilder(
                future: getVehiclesPosition(),
                builder: (BuildContext context, AsyncSnapshot snapshot) {
                  if(snapshot.hasData){
                    return GoogleMap(
                      myLocationEnabled: true,
                      mapToolbarEnabled: false,
                      onMapCreated: _onMapCreated,
                      initialCameraPosition: CameraPosition(
                          target: _initialPosition,
                          zoom: 11.0
                      ),
                      markers: snapshot.data.values.toSet(),
                    );
                  } else {
                    return const Center(
                      child: SizedBox(
                        width: 60,
                        height: 60,
                        child: CircularProgressIndicator(),
                      ),
                    );
                  }
                }
            ),
          ),
          Flexible(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Padding(
                    padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 4),
                    child: Text(
                      S.of(context).vehicles,
                      style: const TextStyle(
                        fontSize: 17,
                        fontWeight: FontWeight.w400,
                        fontFamily: "Comfortaa"
                      ),
                    ),
                  ),
                  const Divider(),
                  ListView.builder(
                    shrinkWrap: true,
                    itemCount: _user.vehicles!.length,
                    itemBuilder: (BuildContext context, int index) {
                      return VehicleTab(vehicle: _user.vehicles![index]);
                    },
                  ),
                ],
              )
          )
        ],
      );

CodePudding user response:

Put the ListView.builder widget inside Expanded widget

  • Related