Bug with Column and Tabs

[advance-ing3]

Question

Good afternoon. In this moment, I test the new features in flet 0.85.3, and I discover a problem with the columns and the Tabs. When I use the example of tabs, with a column, works fine, but if I add the scroll property in the column, the tabs get a infinite scroll. this problem is not generated with a container or other element. I attach the test code. Thanks

Code sample

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.Column(
            expand=True,
            scroll="HIDDEN",   ##Comment this line to see the change
            controls=[
                ft.Tabs(
                    selected_index=1,
                    length=3,
                    expand=True,
                    content=ft.Column(
                        expand=True,
                        controls=[
                            ft.TabBar(
                                tabs=[
                                    ft.Tab(label="Tab 1", icon=ft.Icons.SETTINGS_PHONE),
                                    ft.Tab(label="Tab 2", icon=ft.Icons.SETTINGS),
                                    ft.Tab(
                                        label=ft.CircleAvatar(
                                            foreground_image_src="https://avatars.githubusercontent.com/u/102273996?s=200&v=4",
                                        ),
                                    ),
                                ]
                            ),
                            ft.TabBarView(
                                expand=True,
                                controls=[
                                    ft.Container(
                                        alignment=ft.Alignment.CENTER,
                                        content=ft.Text("This is Tab 1"),
                                    ),
                                    ft.Container(
                                        alignment=ft.Alignment.CENTER,
                                        content=ft.Text("This is Tab 2"),
                                    ),
                                    ft.Container(
                                        alignment=ft.Alignment.CENTER,
                                        content=ft.Text("This is Tab 3"),
                                    ),
                                ],
                            ),
                        ],
                    ),
                ),
            ]
        )
    )


if __name__ == "__main__":
    ft.run(main)

Error message

No response

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[kokoc30]

For this layout, keep the tab shell at a bounded height and put vertical scrolling inside each tab, rather than on the outer Column.

ScrollMode.HIDDEN still enables scrolling; it only hides the scrollbar (documentation). A vertical scroll view gives its content unbounded height, while the expanded tab viewport needs a finite height to fill. Flutter describes this scroll-view/Column constraint conflict. Flet 0.85.3's Column implementation wraps a scrolling Column in that scrollable path.

Using the Tabs API from your 0.85.3 example, the structure can be:

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.Tabs(
            length=2,
            expand=True,
            content=ft.Column(
                expand=True,
                controls=[
                    ft.TabBar(tabs=[
                        ft.Tab(label="Tab 1"),
                        ft.Tab(label="Tab 2"),
                    ]),
                    ft.TabBarView(
                        expand=True,
                        controls=[
                            ft.Column(
                                scroll=ft.ScrollMode.AUTO,
                                controls=[ft.Text(f"Row {i}") for i in range(100)],
                            ),
                            ft.Column(
                                scroll=ft.ScrollMode.AUTO,
                                controls=[ft.Text(f"Other {i}") for i in range(100)],
                            ),
                        ],
                    ),
                ],
            ),
        )
    )


ft.run(main)

You can retain your outer Column(expand=True, ...) if needed, but leave its scroll unset. This keeps the tab bar fixed while each tab's content scrolls.

If the entire tab control must sit inside a larger scrolling page, give the Tabs a finite height and remove its outer expand=True instead. expand fills the remaining space supplied by a parent; it cannot establish a finite viewport inside an unbounded scroll axis. This is a layout workaround based on the documented constraints, not a claim that the reported 0.85.3 behavior has been fixed upstream.