Flet框架父组件设expand后，如何让子Card组件自适应内容而非扩展？

问题场景 #

使用Flet构建GUI时，现有代码生成左右分栏窗口：左侧是Card组件，右侧是带两个标签页的Tabs组件（其中一个标签页内包含Card）。Tabs组件需要依赖expand属性才能正常工作，但希望子组件中的Card不自动扩展，而是宽高根据内部内容自适应变化。

修改后的代码 #

import flet as ft

MAIN_GUI = ft.Container(
    margin=ft.margin.only(bottom=40),
    expand=True,
    content=ft.Row([
        # 左侧：带expand的容器占4份空间，Card自适应内容
        ft.Container(
            expand=4,
            alignment=ft.alignment.center_left,
            content=ft.Card(
                elevation=30,
                content=ft.Container(
                    content=ft.Column([
                        ft.Text("LEFT SIDE, 1st row", size=30, weight=ft.FontWeight.BOLD),
                        ft.Text("LEFT SIDE 2nd row", size=30, weight=ft.FontWeight.NORMAL)
                    ]),
                    border_radius=ft.border_radius.all(20),
                    bgcolor=ft.colors.WHITE24,
                    padding=45,
                )
            )
        ),
        ft.Tabs(
            selected_index=0,
            animation_duration=300,
            expand=3,
            tabs=[
                ft.Tab(
                    text="Tab 1",
                    icon=ft.icons.SEARCH,
                    content=ft.Container(
                        alignment=ft.alignment.center,
                        content=ft.Card(
                            elevation=30,
                            content=ft.Container(
                                content=ft.Text("Amazing TAB 1 content", size=50, weight=ft.FontWeight.BOLD),
                                border_radius=ft.border_radius.all(20),
                                bgcolor=ft.colors.WHITE24,
                                padding=45,
                            )
                        )
                    ),
                ),
                ft.Tab(
                    text="Tab 2",
                    icon=ft.icons.SETTINGS,
                    content=ft.Text("Amazing TAB 2 content"),
                ),
            ],
        )
    ])
)

def main(page: ft.Page):
    page.padding = 50
    page.add(MAIN_GUI)
    page.update()

if __name__ == '__main__':
    ft.app(target=main)

关键修改说明 #

• 左侧Card处理：移除Card自身的expand=4，改用一个设置了expand=4的Container包裹Card。容器会占据Row分配的4份宽度，Card则根据内部文本和padding自动调整大小，通过Container的alignment属性可控制Card在容器内的位置（如左对齐、居中）。
• Tab内Card处理：给包裹Card的Container添加alignment属性（示例中为居中），且不设置expand=True（默认不扩展），这样Container不会强制占满Tab的全部空间，Card就能自适应内容尺寸。
• Tabs组件保留expand=3：维持原布局比例，确保Tabs占据Row分配的3份空间，保证整体布局结构不变。

内容的提问来源于stack exchange，提问作者Programer Beginner