pygame入门教程-图像篇

1. 加载图片

load(filename) -> Surface
load(fileobj, namehint=“”) -> Surface

asurf = pygame.image.load(os.path.join('data', 'bla.png'))

可以看到返回的是一个surface。我们在创建一个窗口的时候返回的也是surface对象，所有想要显示的图像都需要加载到主窗口也就是screen上。pygame提供了一个blit函数可以将一个画布贴到另一个画布上

blit(source, dest, area=None, special_flags=0) -> Rect

source就是另一个surface，dest则是绘制在screen的坐标位置(x,y)，area则是想要绘制图片的区域大小。

import pygame
import os
import itertools
pygame.init()
WIDTH,HEIGHT=600,600
screen = pygame.display.set_mode((WIDTH,HEIGHT))
pygame.display.set_caption("这是一个给我们画画用的窗口")

image = pygame.image.load(os.path.join('./', 'hero.png')) # 1.创建一个surface并加载图片
clock = pygame.time.Clock()

going = True
while going:
    for event in pygame.event.get():  # 遍历事件
        if event.type == pygame.QUIT:  # 退出事件
            going = False

    screen.blit(image, (0, 0)) # 2.将图片加载到主窗口
    pygame.draw.circle(screen,(255,0,0),(200,300),20) # 直接在主窗口画画
    pygame.display.update()
    clock.tick(10)
pygame.quit()

2. 让素材动起来

可以看到素材的每一行其实是一个人物动作，我们这回先只加载图片的一部分，例如左上角那个人物，所以需要在blit中传入图片的area区域。首先获取图片的大小，surface都是矩形，所以可一个通过get_rect来获取矩形的基础数据

x,y
center, centerx, centery
w,h

img_rect = image.get_rect()
img_w,img_h = img_rect.w,img_rect.h

整个图片有64个小图片，横8个，竖8个，每个宽度就是

dw = img_w // 8
dh = img_h // 8

我们想要获取第三行的人物动作，所以ay=3*dh，如果我们想获取

• 第三行第一个人物ax=0
• 第三行第二个人物ax=1*dw
• 第三行第三个人物ax=2*dw
• 第三行第四个人物ax=3*dw

import pygame
import os

pygame.init()
WIDTH,HEIGHT=600,600
screen = pygame.display.set_mode((WIDTH,HEIGHT))
pygame.display.set_caption("这是一个给我们画画用的窗口")

image = pygame.image.load(os.path.join('./', 'hero.png'))
img_rect = image.get_rect()
clock = pygame.time.Clock()

dw = img_rect.width // 8
dh = img_rect.height // 8

dx = 1
action_row = 2
action_col = 0

going = True
while going:
    for event in pygame.event.get():  # 遍历事件
        if event.type == pygame.QUIT:  # 退出事件
            going=False

    screen.blit(image, (dx,300),(action_col*dw,dh*action_row,dw,dh))
    dx += 1
    action_col += 1
    action_col = action_col % 8
    j += 1
    j = j%600
    i += 1
    i = i % 8
    pygame.display.flip()
    clock.tick(10)
pygame.quit()

发现的确是动起来了，但是却出现了残影，这是因为我们并没有对screen进行清屏，所以之前所有的图片都会被保留下来。可以直接通过fill进行清屏

going = True
while going:
    for event in pygame.event.get():  # 遍历事件
        if event.type == pygame.QUIT:  # 退出事件
            going=False
    screen.fill((0,0,0)) # 清除之前所有的显示的图片
    screen.blit(image, (dx,300),(action_col*dw, dh*action_row,dw,dh))
    dx += 1
    action_col += 1
    action_col = action_col % 8
    pygame.display.flip()
    clock.tick(10)

3. 旋转和缩放

缩放函数非常简单哈

pygame.transform.scale(surface, size, dest_surface=None) -> Surface

我们获得新图片的rect属性，rect本质就是一个四元组

rect —> (x,y,width,heigh)

scale_img = pygame.transform.scale(image, (100, 100))
img_rect = scale_img.get_rect() # 获取图片的位置和大小
img_rect.center = (WIDTH//2, HEIGHT//2) # rect的中心移动到窗口中心

然后绘制缩放后的图片，有一点需要注意，pygame绘制的内容是会相互覆盖的，如果有位置重叠，后绘制的会覆盖掉之前绘制的

screen.fill((255,255,255)) # 清屏，白色
screen.blit(scale_img, img_rect) # 加载图片到中心
pygame.draw.rect(screen, (255,0,0), img_rect, width=2) # 绘制一个矩形

然后再看一下如何旋转图片

pygame.transform.rotate(surface, angle) -> Surface

import pygame
import os

pygame.init()
WIDTH,HEIGHT=600,600
screen = pygame.display.set_mode((WIDTH,HEIGHT))
pygame.display.set_caption("这是一个给我们画画用的窗口")

image = pygame.image.load(os.path.join('./', 'wen.png'))

clock = pygame.time.Clock()

scale_img = pygame.transform.scale(image, (100, 100))

img_rect = scale_img.get_rect() # 获取图片的位置和大小
img_rect.center = (WIDTH//2, HEIGHT//2) # rect的中心移动到窗口中心
angle = 0
going = True
while going:
    for event in pygame.event.get():  # 遍历事件
        if event.type == pygame.QUIT:  # 退出事件
            going=False

    screen.fill((255,255,255))
    rot_img = pygame.transform.rotate(scale_img, angle)
    angle += 1
    angle = angle % 360
    screen.blit(rot_img, img_rect)
    pygame.draw.rect(screen, (255,0,0), rot_img.get_rect(), width=2)

    pygame.display.flip()
    clock.tick(10)
pygame.quit()

尴尬的是发现绘制的矩形变到了顶端，这是因为suface默认x=0,y=0，我们需要修改一下rect的中心，让其为窗口的中心

import pygame
import os

pygame.init()
WIDTH,HEIGHT=600,600
screen = pygame.display.set_mode((WIDTH,HEIGHT))
pygame.display.set_caption("这是一个给我们画画用的窗口")

image = pygame.image.load(os.path.join('./', 'wen.png'))

clock = pygame.time.Clock()

scale_img = pygame.transform.scale(image, (100, 100))

img_rect = scale_img.get_rect() # 获取图片的位置和大小
img_rect.center = (WIDTH//2, HEIGHT//2) # rect的中心移动到窗口中心
angle = 0
going = True
while going:
    for event in pygame.event.get():  # 遍历事件
        if event.type == pygame.QUIT:  # 退出事件
            going=False

    screen.fill((255,255,255))
    rot_img = pygame.transform.rotate(scale_img, angle)
    angle += 1
    angle = angle % 360
    screen.blit(rot_img, img_rect)
    rot_rect = rot_img.get_rect()
    rot_rect.center = (WIDTH//2, HEIGHT//2)
    pygame.draw.rect(screen, (255,0,0), rot_rect, width=2)

    pygame.display.flip()
    clock.tick(30)
pygame.quit()