PySimpleGUI列动态添加内容及无滚动条滚动实现问询

一、点击按钮新增帖子的实现代码 #

下面是完整的示例代码，初始加载10条测试帖子，点击底部的"加载更多"按钮后，会在现有帖子末尾、按钮之前新增10条帖子，帖子宽度固定、高度自适应：

import PySimpleGUI as sg

# 生成单条帖子的布局
def create_post(post_num):
    return [
        sg.Frame(
            f"帖子 {post_num}",
            layout=[
                sg.Text(f"这是第 {post_num} 条测试帖子的内容", pad=(10,5)),
                sg.Image(data=sg.DEFAULT_BASE64_ICON, pad=(10,5))  # 用默认图标代替帖子图片
            ],
            size=(300, None),  # 固定宽度，高度自适应
            pad=(5,5)
        )
    ]

# 初始生成10条帖子
post_layout = []
for i in range(1, 11):
    post_layout.extend(create_post(i))

# 主布局
layout = [
    [sg.Column(post_layout, key="-POST_COLUMN-", size=(320, 600), scrollable=True)],
    [sg.Button("加载更多", key="-LOAD_MORE-", pad=(0,10))]
]

window = sg.Window("简易Instagram", layout, size=(340, 700))

current_post_count = 10

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED:
        break
    if event == "-LOAD_MORE-":
        # 新增10条帖子
        new_posts = []
        for i in range(current_post_count+1, current_post_count+11):
            new_posts.extend(create_post(i))
        # 更新Column的内容，将新帖子追加到原有内容后面
        window.extend_layout(window["-POST_COLUMN-"], new_posts)
        current_post_count += 10

window.close()

代码说明：

• create_post函数负责生成单条帖子的布局，用Frame包裹保证宽度固定，高度随内容自适应
• 初始通过循环生成10条帖子，放入Column组件
• 点击"加载更多"按钮时，生成新的10条帖子，用window.extend_layout方法将新内容追加到指定Column中，这个方法会自动保留原有内容并添加新元素

二、实现无滚动条的可滚动Column #

PySimpleGUI原生的scrollable=True会显示滚动条，要隐藏滚动条可以通过两种方式实现：

方法1：修改tkinter底层组件隐藏滚动条 #

利用PySimpleGUI可以直接访问tkinter组件的特性，找到Column对应的滚动条组件并隐藏：

import PySimpleGUI as sg
import tkinter as tk

def create_post(post_num):
    return [
        sg.Frame(
            f"帖子 {post_num}",
            layout=[sg.Text(f"帖子内容 {post_num}", pad=(10,5))],
            size=(300, None),
            pad=(5,5)
        )
    ]

post_layout = []
for i in range(1, 11):
    post_layout.extend(create_post(i))

layout = [
    [sg.Column(post_layout, key="-POST_COLUMN-", size=(320, 600), scrollable=True, vertical_scroll_only=True)],
    [sg.Button("加载更多", key="-LOAD_MORE-")]
]

window = sg.Window("无滚动条滚动示例", layout, size=(340, 700))

# 获取Column对应的tkinter组件，隐藏滚动条
column_widget = window["-POST_COLUMN-"].Widget
for child in column_widget.winfo_children():
    if isinstance(child, tk.Scrollbar):
        child.pack_forget()

current_post_count = 10

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED:
        break
    if event == "-LOAD_MORE-":
        new_posts = []
        for i in range(current_post_count+1, current_post_count+11):
            new_posts.extend(create_post(i))
        window.extend_layout(window["-POST_COLUMN-"], new_posts)
        current_post_count += 10

window.close()

方法2：绑定鼠标滚轮事件手动控制滚动 #

如果不想依赖tkinter底层操作，可以绑定鼠标滚轮事件，通过调整Column的滚动位置实现无滚动条滚动：

import PySimpleGUI as sg

def create_post(post_num):
    return [
        sg.Frame(
            f"帖子 {post_num}",
            layout=[sg.Text(f"帖子内容 {post_num}", pad=(10,5))],
            size=(300, None),
            pad=(5,5),
            key=f"-POST_{post_num}-"
        )
    ]

post_layout = []
for i in range(1, 21):
    post_layout.extend(create_post(i))

layout = [
    [sg.Column(post_layout, key="-POST_COLUMN-", size=(320, 600), scrollable=True, vertical_scroll_only=True, key="-COL-")],
    [sg.Button("加载更多", key="-LOAD_MORE-")]
]

window = sg.Window("滚轮控制滚动示例", layout, size=(340, 700))

# 隐藏滚动条
col_widget = window["-COL-"].Widget
for child in col_widget.winfo_children():
    if hasattr(child, 'set'):  # 判断是否是滚动条
        child.pack_forget()

# 绑定鼠标滚轮事件
def on_mouse_wheel(event):
    col = window["-COL-"].Widget
    # 向上滚动是正，向下是负，调整滚动速度
    delta = -1 * event.delta // 120
    yview = col.yview()
    new_pos = yview[0] + delta * 0.1
    if new_pos < 0:
        new_pos = 0
    elif new_pos > 1:
        new_pos = 1
    col.yview_moveto(new_pos)

window["-COL-"].Widget.bind("<MouseWheel>", on_mouse_wheel)
# 针对Mac系统的滚轮事件
window["-COL-"].Widget.bind("<Button-4>", lambda e: on_mouse_wheel(type('obj', (object,), {'delta': 120})()))
window["-COL-"].Widget.bind("<Button-5>", lambda e: on_mouse_wheel(type('obj', (object,), {'delta': -120})()))

current_post_count = 20

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED:
        break
    if event == "-LOAD_MORE-":
        new_posts = []
        for i in range(current_post_count+1, current_post_count+11):
            new_posts.extend(create_post(i))
        window.extend_layout(window["-COL-"], new_posts)
        current_post_count += 10

window.close()

说明：

• 两种方法本质都是隐藏原生滚动条，第一种更简单，第二种通过绑定滚轮事件让用户可以用鼠标滚轮控制滚动，体验更接近原生无滚动条的滚动效果
• 注意不同系统的鼠标滚轮事件可能有差异，代码中已经兼容了Windows和Mac系统的滚轮事件

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