Question

我想创建一个彩色输入文本框，用户可以在其中输入一些文本。

这是我正在尝试的代码：

import pygame


class InputBox:
    def __init__(self, x, y, w, h, color_active, color_inactive, font, text=''):
        self.rect = pygame.Rect(x, y, w, h)
        self.inner_rect = pygame.Rect(x+2, y+2, w-4, h-4)
        self.color_active = color_active
        self.color_inactive = color_inactive
        self.color = self.color_inactive
        self.text = text
        self.font = font
        self.txt_surface = font.render(text, True, self.color)
        self.active = False

    def handle_event(self, event):
        if event.type == pygame.MOUSEBUTTONDOWN:
            # If the user clicked on the input_box rect.
            if self.rect.collidepoint(event.pos):
                # Toggle the active variable.
                self.active = not self.active
            else:
                self.active = False
            # Change the current color of the input box.
            self.color = self.color_active if self.active else self.color_inactive
        if event.type == pygame.KEYDOWN:
            if self.active:
                if event.key == pygame.K_RETURN:
                    print(self.text)
                    self.text = ''
                elif event.key == pygame.K_BACKSPACE:
                    self.text = self.text[:-1]
                else:
                    self.text += event.unicode
                # Re-render the text.
                self.txt_surface = font.render(self.text, True, self.color)

    def update(self):
        # Resize the box if the text is too long.
        width = max(200, self.txt_surface.get_width()+10)
        self.rect.w = width

    def draw(self, screen):
        # Blit the text.
        screen.blit(self.txt_surface, (self.rect.x+5, self.rect.y+5))
        # Blit the rect.
        pygame.draw.rect(screen, self.color, self.rect, 2)
        pygame.draw.rect(screen, (255, 255, 255), self.inner_rect)


if __name__ == '__main__':
    pygame.init()
    screen = pygame.display.set_mode((640, 480))
    color_inactive = pygame.Color('lightskyblue3')
    color_active = pygame.Color('dodgerblue2')
    font = pygame.font.Font(None, 32)
    input_box1 = InputBox(100, 100, 140, 32, color_active, color_inactive, font)
    input_box2 = InputBox(100, 300, 140, 32, color_active, color_inactive, font)
    input_boxes = [input_box1, input_box2]
    done = False
    
    while not done:
        for event in pygame.event.get():
            if event.type == pygame.QUIT:
                done = True
            for box in input_boxes:
                box.handle_event(event)
        for box in input_boxes:
            box.update()

        screen.fill((30, 30, 30))
        for box in input_boxes:
            box.draw(screen)

        pygame.display.flip()

我得到的结果是文本在输入文本框背景后面（查看屏幕截图）

我希望文本位于前景中。
我试图改变循环开始和结束处 screen.fill((30, 30, 30)) 的位置，但没有奏效。
有谁知道如何解决这个问题？
提前致谢。

Answer 1

<块引用>

我得到的结果是文本在输入后面

因此，您必须在文本之前绘制背景：

class InputBox:
    # [...]

    def draw(self, screen):
        # Draw the background of the text box 
        pygame.draw.rect(screen, (255, 255, 255), self.inner_rect)
        # Blit the text.
        screen.blit(self.txt_surface, (self.rect.x+5, self.rect.y+5))
        # Blit the rect.
        pygame.draw.rect(screen, self.color, self.rect, 2)

将文本添加到彩色输入文本框 pygame

1 个答案: