如何在Pygame中实现滚动视图

时间:2020-07-16 17:18:27

标签: python pygame

我的目标是要有4个盒子。在任何给定点,只有3个框可见,而1个框将被隐藏。然后,如果向左或向右滚动,将显示第四个框/隐藏第一个框。基本上是一个简单的滚动视图。我正在计划在Pygame上实现此功能。 我知道这是一个相对空白的问题;我正在寻找实现这一目标的图书馆或总体思路。有什么建议吗?

1 个答案:

答案 0 :(得分:3)

我创建了代码,可在您移动鼠标(不单击按钮)时移动图像

我使用camera_rect保持offset用于移动图像。

我使用事件MOUSEMOTIONevent.rel来更改camera_rect中的值

它是为图像800x600和窗口400x300创建的,可以移动完整图像,但是对于不同的尺寸,可能需要进行不同的计算-或者可能需要将鼠标位置计算为百分比,然后使用该百分比来计算图像位置。

import pygame

# === CONSTANS === (UPPER_CASE names)

#BLACK = (  0,   0,   0)
#WHITE = (255, 255, 255)

#RED   = (255,   0,   0)
#GREEN = (  0, 255,   0)
#BLUE  = (  0,   0, 255)

SCREEN_WIDTH  = 400
SCREEN_HEIGHT = 300

# === CLASSES === (CamelCase names)

    # empty
    
# === FUNCTIONS === (lower_case names)

    # empty
    
# === MAIN === (lower_case names)

# --- (global) variables --- 

# --- init ---

pygame.init()

screen = pygame.display.set_mode((SCREEN_WIDTH, SCREEN_HEIGHT))
screen_rect = screen.get_rect()

# --- objects ---

image = pygame.image.load('image-800x600.jpg')
image_rect = image.get_rect()

# --- camera / offset ---

camera_rect = screen_rect.copy()

# --- mainloop ---

#button_pressed = False

clock = pygame.time.Clock()
is_running = True

while is_running:

    # --- events ---
    
    for event in pygame.event.get():

        # --- global events ---
        
        if event.type == pygame.QUIT:
            is_running = False
            
        elif event.type == pygame.KEYDOWN:
            if event.key == pygame.K_ESCAPE:
                is_running = False

        #elif event.type == pygame.MOUSEBUTTONDOWN:
        #    button_pressed = True
        #elif event.type == pygame.MOUSEBUTTONUP:
        #    button_pressed = False

        elif event.type == pygame.MOUSEMOTION:
            #if button_pressed:
    
                camera_rect.x += event.rel[0]
                # check left/right limit
                if camera_rect.left < image_rect.left:
                    camera_rect.left = image_rect.left
                if camera_rect.right > image_rect.right:
                    camera_rect.right = image_rect.right
    
                camera_rect.y += event.rel[1]
                # check up/down limit
                if camera_rect.top < image_rect.top:
                    camera_rect.top = image_rect.top
                if camera_rect.bottom > image_rect.bottom:
                    camera_rect.bottom = image_rect.bottom
                    
        # --- objects events ---

    # --- updates ---

        
    # --- draws ---
    
    #screen.fill(BLACK)

    # draw image
    screen.blit(image, (-camera_rect.x, -camera_rect.y))
    #screen.blit(image, camera_rect)

    pygame.display.update()

    # --- FPS ---

    clock.tick(25)

# --- the end ---
    
pygame.quit()

编辑:

更多通用版本,使用百分率计算位置。

import pygame

# === CONSTANS === (UPPER_CASE names)

#BLACK = (  0,   0,   0)
#WHITE = (255, 255, 255)

#RED   = (255,   0,   0)
#GREEN = (  0, 255,   0)
#BLUE  = (  0,   0, 255)

SCREEN_WIDTH  = 400
SCREEN_HEIGHT = 600

# === CLASSES === (CamelCase names)

# empty
    
# === FUNCTIONS === (lower_case names)

# empty
    
# === MAIN === (lower_case names)

# --- (global) variables --- 

# --- init ---

pygame.init()

screen = pygame.display.set_mode((SCREEN_WIDTH, SCREEN_HEIGHT))
screen_rect = screen.get_rect()

# --- objects ---

image = pygame.image.load('image-800x600.jpg')
image_rect = image.get_rect()

# --- camera / offset ---

camera_rect = screen_rect.copy()

percentage_x = 0
percentage_y = 0

# --- mainloop ---

#button_pressed = False

clock = pygame.time.Clock()
is_running = True

while is_running:

    # --- events ---
    
    for event in pygame.event.get():

        # --- global events ---
        
        if event.type == pygame.QUIT:
            is_running = False
            
        elif event.type == pygame.KEYDOWN:
            if event.key == pygame.K_ESCAPE:
                is_running = False

        elif event.type == pygame.MOUSEMOTION:
            percentage_x = event.pos[0] / screen_rect.width
            camera_rect.x = percentage_x * (image_rect.width - screen_rect.width)

            #percentage_y = event.pos[1] / screen_rect.height
            #camera_rect.y = percentage_y * (image_rect.height - screen_rect.height)
                    
        # --- objects events ---
        
        # empty
        
    # --- updates ---

    # empty
        
    # --- draws ---
    
    #screen.fill(BLACK)

    # draw image
    screen.blit(image, (-camera_rect.x, -camera_rect.y))
    #screen.blit(image, camera_rect)

    pygame.display.update()

    # --- FPS ---

    clock.tick(25)

# --- the end ---
    
pygame.quit()