Home > Mobile >  Can't scroll ListView when child expands height
Can't scroll ListView when child expands height

Time:01-26

I have a ListView.builder that renders a list of Containers who can expand in height when the user clicks on it ( I'm using AnimatedSize to wrap the Containers), however I noticed that when the Container is expanded I can't scroll the ListView by pressing and dragging around the expanded area, only in the area that Container occupied originally.

 ListView.builder(
                        physics: AlwaysScrollableScrollPhysics(),
                        itemCount: profilesList.profilesCount,
                        shrinkWrap: true,
                        scrollDirection: Axis.vertical,
                        itemBuilder: (context, index) {
                          return ProfileBar(
                              id: profilesList.profiles[index].id!,
                              index: index,
                              name: profilesList.profiles[index].name,
                              emoji: profilesList.profiles[index].emoji,
                              gender: profilesList.profiles[index].gender,
                              color: profilesList.profiles[index].color,
                              height: profilesList.profiles[index].height,
                              birthday: profilesList.profiles[index].birthday,
                              isSelected: profilesList.selectedProfileID ==
                                  profilesList.profiles[index].id,
                              onSelect: (_) async {
                                profilesList.selectProfile(
                                    profilesList.profiles[index].id!);
                                    Provider.of<GoalModel>(context, listen: false).getGoal(profilesList.profiles[index].id!);
                                await UserSettings.setProfile(
                                    profilesList.profiles[index].id!);
                                _getRecords(context);
                              });
                        },
                      ),

Is there a way to fix this?

CodePudding user response:

Wrap that Listview with SingleChildScrollView and add physics : NeverScrollableScrollPhysics() to Listview and check.

CodePudding user response:

Try to wrap your ListView.builder in a ConstrainedBox.

            ConstrainedBox(
                constraints: BoxConstraints(minHeight: constraint.maxHeight),
                child: ListView.builder(
                    physics: AlwaysScrollableScrollPhysics(),
                    itemCount: profilesList.profilesCount,
                    shrinkWrap: true,
                    scrollDirection: Axis.vertical,
                    itemBuilder: (context, index) {
                      return ProfileBar(
                          id: profilesList.profiles[index].id!,
                          index: index,
                          name: profilesList.profiles[index].name,
                          emoji: profilesList.profiles[index].emoji,
                          gender: profilesList.profiles[index].gender,
                          color: profilesList.profiles[index].color,
                          height: profilesList.profiles[index].height,
                          birthday: profilesList.profiles[index].birthday,
                          isSelected: profilesList.selectedProfileID ==
                              profilesList.profiles[index].id,
                          onSelect: (_) async {
                            profilesList.selectProfile(
                                profilesList.profiles[index].id!);
                                Provider.of<GoalModel>(context, listen: false).getGoal(profilesList.profiles[index].id!);
                            await UserSettings.setProfile(
                                profilesList.profiles[index].id!);
                            _getRecords(context);
                          });
                    },
                ),
            ),
  •  Tags:  
  • Related