Menu
CoddyTech

Animar con el tiempo

Parte de la sección Sprites e imágenes del Journey de Pygame de Coddy. Lección 27 de 36.

Un contador de fotogramas vincula la animación a la velocidad de fotogramas. En una computadora que solo puede gestionar 30 fotogramas por segundo, las alas del insecto aletean a la mitad de velocidad. Vincúlala al tiempo en su lugar.

pygame.time.get_ticks() es el número de milisegundos desde pygame.init(). Divide ese valor por cuánto tiempo debe durar cada imagen y obtendrás cuántas imágenes han pasado; % lo convierte en un índice:

frame_index = pygame.time.get_ticks() // 120 % len(frames)

De 0 a 119 ms, es la imagen 0; de 120 a 239 ms, la imagen 1; después, la 2 y luego vuelve a la 0. No hay ningún contador que mantener y reiniciar: una línea, calculada de nuevo en cada fotograma. Si el juego se ralentiza, la animación se salta una imagen en lugar de ralentizarse con él.

// divide y descarta el resto: 250 // 120 es 2. La tercera fila de esta hoja contiene un insecto volador en tres poses, en las columnas 6 a 8, ya recortadas en frames.

challenge icon

Desafío

Intermedio
  1. Elimina timer y el contador.
  2. En cada fotograma, establece frame_index a partir de pygame.time.get_ticks() para que cada una de las tres imágenes se muestre durante 120 milisegundos, en orden.

Pruébalo tú mismo

import pygame

pygame.init()
screen = pygame.display.set_mode((640, 480))
pygame.display.set_caption("Flying Bug")
clock = pygame.time.Clock()

sheet = pygame.image.load("assets/sheets/platformer_characters.png").convert_alpha()
frames = []
for col in (6, 7, 8):
    frame = sheet.subsurface((col * 24, 48, 24, 24))
    frames.append(pygame.transform.scale_by(frame, 3))
frame_index = 0
timer = 0

running = True
while running:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False

    timer += 1
    if timer == 10:
        timer = 0
        frame_index = (frame_index + 1) % len(frames)

    screen.fill((20, 22, 40))
    image = frames[frame_index]
    screen.blit(image, image.get_rect(center=(320, 240)))
    pygame.display.flip()
    clock.tick(60)

pygame.quit()

Todas las lecciones de Sprites e imágenes

Practica por tu cuenta: Playground de Pygame