You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何使用Flet实现4行7列的复选框网格布局?

Flet实现4行7列复选框网格布局的解决方法

方案1:使用Flet的Grid组件(推荐)

直接利用Flet内置的Grid组件就能快速实现规整的网格布局,它支持指定行列数,自动帮你排列控件。

示例代码:

import flet as ft

def main(page: ft.Page):
    page.title = "4x7复选框网格"
    # 生成28个复选框
    checkboxes = [ft.Checkbox(label=f"选项{i+1}") for i in range(28)]
    # 配置Grid布局,指定7列4行
    grid_layout = ft.Grid(
        controls=checkboxes,
        columns=7,
        rows=4,
        spacing=10,  # 复选框之间的水平/垂直间距
        run_spacing=10
    )
    page.add(grid_layout)

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

当控件总数刚好等于columns*rows(7*4=28)时,Grid会自动将复选框分成4行7列的规整网格,无需手动拆分。

方案2:手动嵌套Row和Column

如果需要对某一行做特殊调整(比如单独设置对齐方式、添加背景色),可以手动拆分复选框,用Row+Column嵌套实现。

示例代码:

import flet as ft

def main(page: ft.Page):
    page.title = "4x7复选框网格"
    checkboxes = [ft.Checkbox(label=f"选项{i+1}") for i in range(28)]
    # 把28个复选框拆成4组,每组7个
    row_items = [checkboxes[i*7 : (i+1)*7] for i in range(4)]
    # 用Column装4个Row,每个Row放7个复选框
    grid_container = ft.Column(
        controls=[ft.Row(controls=row, spacing=10) for row in row_items],
        spacing=10
    )
    page.add(grid_container)

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

这种方式灵活性更高,你可以单独修改某一行的属性,满足个性化布局需求。

内容的提问来源于stack exchange,提问作者dwburger

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.28 11:32:07