• Jogos
  • 03. Desenhando na tela

Desenhando na Tela

Desenhando imagens

Continuamos na temática de bandeiras, mas desta vez usaremos uma um pouquinho mais complexa: a bandeira da Argentina. Agora, além de desenhar polígonos também precisaremos desenhar aquele solzinho no meio da bandeira:

Mostrar imagens na tela exige um pouquinho mais de preparação da nossa parte. Precisamos

  1. carregar o arquivo com a imagem do sol no pygame
  2. pintar a imagem na tela durante a etapa de desenho

Exercício 1

O carregamento da imagem deverá ser feito em qual função da nossa estrutura básica do jogo?

Resposta

O carregamento de todos os recursos do jogo sempre é feito na função inicializa. Isso não quer dizer que não seria possível realizar esse carregamento em outro lugar, mas para mantermos o código organizado, procuramos respeitar as responsabilidades de cada função.

O carregamento de imagens no Pygame é feito usando a função pygame.image.load.

Exercício 2

Quais argumentos são recebidos por pygame.image.load? Consulte a documentação de pygame.image.load para responder essa pergunta.

Resposta

Documentação da função pygame.image.load

pygame.image.load recebe o caminho do arquivo a ser carregado. Essa chamada também pode receber um arquivo aberto usando open, mas o mais comum é passar o caminho do arquivo.

Especificamos caminho e não nome pois podemos carregar arquivos em outras pastas. Por exemplo, podemos colocar todas as nossas imagens em uma pasta img e passar o caminho completo ao carregá-las. Se existe um arquivo com nome heart.png dentro de img, podemos carregá-lo passando o caminho img/heart.png como argumento: pygame.image.load('img/heart.png').

A função pygame.image.load devolve a imagem carregada na memória. Esta chamada só precisa ser feita uma vez na função inicializa. A partir desse ponto podemos usar a função window.blit(img, (x, y)) para desenhar a imagem1.

Exercício 3

Abra a documentação da classe window.blit(img, (x, y)). Escreva abaixo, em uma frase, o que essa chamada específica faz.

Resposta

A chamada da função acima desenha a imagem img, já carregada por pygame.image.load em window na posição (x, y).

Já sabemos como desenhar as listras da bandeira, então falta somente desenhar o solzinho. Ele deverá ser desenhado exatamente no centro da nossa janela. As listras deverão ter altura igual a 50 pixels.

Dica PRO 1

Nestes primeiros exemplos teremos uma quantidade pequena de imagens para carregar. Nós poderíamos armazenar cada recurso carregável (asset) em uma variável, mas quantas imagens, sons e outros arquivos existem em um jogo de verdade? Nós precisaríamos de muitas variáveis! Para organizar melhor o nosso código, todos os assets que forem carregados serão guardados em um dicionário chamado assets. Esse dicionário será criado e preenchido na função inicializa e passado como argumento para a função desenha.

Exercício 4

Este exercício tem três passos:

  1. Modifique a função inicializa para devolver uma tupla2 window, assets. A variável window é a janela criada e assets é o dicionário de recursos do jogo.
  2. Modifique game_loop para receber o argumento assets e repasá-lo para a função desenha.
  3. Modifique a função desenha para desenhar a bandeira da Argentina. Além de usar os testes, rode o programa no arquivo jogo.py para conferir visualmente o resultado.

Acessar exercício

CHECK 2

Agora você já pode fazer o check 2. Depois de concluir, faça um commit (não se esqueça de sincronizar/dar push) com a mensagem "Check 2".

Não se esqueça de mostrar para algum professor para ganhar o check!


  1. O tipo pygame.Surface

    O valor armazenado na variável window foi devolvido pela função pygame.display.set_mode((500, 400)). Vimos anteriormente que essa função devolvia uma pygame.Surface. Assim como a função pygame.image.load também devolve uma pygame.Surface.

    Ao consultar a documentação dessa classe, vemos que ela é um "pygame object for representing images". Ou seja, tanto a janela quanto imagens carregadas de arquivos são pygame.Surfaces. O que estamos fazendo na função desenha é "colar" (função blit) imagens em uma imagem principal (a janela), que posteriormente será mostrada para o usuário. 

  2. Sim, nós podemos devolver mais do que um valor em uma função usando tuplas (note a vírgula). Exemplo:

    def soma_e_produto(a, b):
        return a + b, a * b
    
    soma, produto = soma_e_produto(2, 3)
    # Imprime 5
    print(soma)
    # Imprime 6
    print(produto)