如何在Pygame中为不同矩形显示对应文本并修复显示异常

问题根源 #

• 所有矩形绘制坐标固定为(20, 20)，25个矩形完全重叠，后绘制的内容会覆盖之前的内容，因此只会显示最后一个矩形的文本
• 循环内未对count变量执行自增操作，代码进入死循环，不会按预期完成25组数据的绘制
• 文本绘制坐标固定，没有和对应矩形的位置做绑定，无法匹配每个矩形的中心位置
• 缺少屏幕刷新逻辑，绘制的内容无法正确更新到显示窗口，会出现字体显示模糊、内容残缺的问题

修复代码示例 #

假设采用5行5列的布局排列25个矩形，你可以根据需求调整布局参数：

import pygame

# 提前初始化字体，不要放在绘制函数里重复创建，提升性能
font = pygame.font.SysFont(None, 20)

def draw_point(text, rect):
    # rect参数为对应矩形的pygame.Rect对象，直接获取中心坐标
    # 第四个参数传入矩形同色背景，大幅提升文字清晰度
    img = font.render(text, True, (0,0,0), (255,255,255))
    # 自动计算文本居中位置，避免手动计算坐标出现偏移
    text_rect = img.get_rect(center=rect.center)
    window.blit(img, text_rect)

def loop_func():
    # 布局参数可自定义修改：列数、行数、矩形间距
    col_count = 5
    row_count = 5
    margin = 10
    count = 0
    # 绘制前先清屏，避免残留上一帧的内容
    window.fill((0,0,0))
    while count < total_length:
        data = data_pass[count]
        # 计算当前矩形的行列位置
        col = count % col_count
        row = count // col_count
        # 计算当前矩形的左上角坐标
        x = 20 + col * (width + margin)
        y = 20 + row * (height + margin)
        current_rect = pygame.Rect(x, y, width, height)
        # 绘制矩形
        pygame.draw.rect(window, (255,255,255), current_rect)
        # 绘制对应文本
        draw_point(data, current_rect)
        # count自增，避免死循环
        count += 1
    # 所有内容绘制完成后统一刷新屏幕
    pygame.display.update()

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