flet-dev / flet-dev/flet

ListView loses scroll in ResponsiveRow column view.

Open
#2,831 17 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Python
Stars
17k
Forks
694
Avg merge
1d 14h
Merged PRs (30d)
33

Description

Description
I am testing ResposiveRow with a container on the left and container of ListView on the right. The listview is scrollable when the screen is wide. Once I shrink the screen the ResponsiveRow changes to column mode. Everything works ok except that the ListView loses its ability to scroll. I have been trying to put the listview in ft.Row, column, another container, and changing the value of "expand". But I still can't scroll the listView in narrow screen.

Code example to reproduce the issue:


def main(page: ft.Page):
    page.title = "scrolling ListView"

    lv = ft.ListView(expand=True, spacing=10, padding=20,)

    count = 1

    for i in range(0, 60):
        lv.controls.append(ft.Text(f"Line {count}"))
        count += 1

    page.add(ft.ResponsiveRow(
        [ft.Container(ft.Text("Title bar"),
                      col={"sm": 12, "md": 9}),

            ft.Container(content=lv,
                         padding=5,
                         bgcolor=ft.colors.GREEN,
                         col={"sm": 12, "md": 3},
                         border_radius=10,
                         expand=True,
                         )
         ],
        expand=True,

    ))

ft.app(target=main)

Describe the results you received:

Describe the results you expected:

Additional information you deem important (e.g. issue happens only occasionally):

Flet version (pip show flet):

0.21.1

Give your requirements.txt file (don't pip freeze, instead give direct packages):

(The requirements)

Operating system:
Windows 11
Python 3.12.1

Additional environment details:

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the provided main(page) reproduction using Flet 0.21.1 and inspect how ResponsiveRow switches to column mode around the ListView. Confirm the behavior at narrow and wide window sizes; done means the ListView remains scrollable after the responsive layout changes.

Written by the indexing model from the issue text.

Assessment

Tech stack
python
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.