Pygames: Criando animações

Animações são uma parte essencial do repertório de quem pretende construir um game e nisso está embutido uma série de quesitos, que você pode conferir no vídeo a seguir feito pela RIOT (desenvolvedora do League of Legends):

O vídeo acima tem diversos cuidados a se ter com a construção de uma animação que devem ser levadas em conta, mas vamos nos focar em um pequeno recorte desse mundo vasto da animação. No post de hoje vamos tratar de como inserir um conjunto de imagens para formar uma animação em Python (biblioteca Pygames).

A primeira ação é obter uma sequência de imagens (de preferência em PNG para poder sobrepor o cenário de fundo), que quando organizadas em um loop (repetição) possam dar a sensação de movimento (animação). Veja o exemplo abaixo, no qual temos a disposição um personagem em diversas posições, cuja animação irá resultar em uma caminhada:

O produto final você pode encontrar no seguinte link: https://drive.google.com/drive/folders/18SZCn-IYdvgMIRLNZDHc-SaSdFCfMts7?usp=sharing. Ao observar a programação, percebemos que além das programações que já costumam ser usadas, tivemos o acréscimo de novas, a começar pela responsável pelo carregamento das imagens, que é a "images.append(pygame.image.load("nomedoarquivo.extensão"))" (destacada em verde abaixo). Ela aparece várias vezes para cada imagem a ser carregada e na ordem que deve aparecer. Além disso, é necessário ter uma iteração baseada no contador "itera" que irá permitir o loop das imagens uma após a outra (destacado em vermelho) para gerar o movimento. E por fim, o comando "blit (nomedoarquivogenérico, (posiçãoX, posiçãoY))" para mostrar na tela a animação (destacado em azul).

Você pode usar esse layout de programação para sua animação, bastando apenas adaptar a quantidade de imagens carregadas e o valor na fórmula de iteração (substituir o %8 pelo valor correspondente a quantidade de imagens) para a nova situação. Bora testar isso? Conte nos comentários abaixo quais foram sua dificuldades e como conseguiu resolver. Até a próxima!

Pygames: Construindo um game PVP com timer.

Em primeiro lugar, caso você não saiba o que é PVP, a sigla significa Player versus Player e se refere a uma modalidade de jogos eletrônicos multijogador na qual jogadores enfrentam-se mutuamente (em português Jogador contra Jogador JxJ). Vamos construir um game em Python usando o modelo construído no post anterior (http://vemfazermatematicaegames.blogspot.com/2020/05/pygames-construindo-inimigos-com.html) e o tornando um game PVP acrescentando dois elementos: teclas de entrada extras pro segundo jogador e um game over com contador de tempo. O objetivo do game será de que dois jogadores, cada um com seu personagem e por turnos, possam "caçar" o outro. Vence quem ficar mais tempo sem ser caçado (colisão no game).

Vamos ao primeiro elemento, para acrescentar teclas do teclado para um segundo personagem basta replicar os códigos já construídos modificando a entrada final dos comandos, como por exemplo "pygame.K_LEFT para pygame.K_a" (destacado em azul abaixo), onde setamos a tecla a para executar alguma ação. Outro detalhe é acrescentar os pontos X e Y iniciais diferentes do outro personagem (destacado em verde abaixo) pois se eles começarem sobrepostos teremos game over automático (esse valor de coordenada devem ser inserido na definição dos X e Y dos personagens). Além disso, vai ser necessário replicar alguns códigos referentes ao movimento e a colisão, conforme imagem abaixo:

Agora a novidade, vamos implementar um contador de tempo de modo que ele apareça na tela quando houver um Game Over (ele acontece quando um dos personagens colide contra o outro). O código responsável por isso, você confere abaixo:

while not fgExit: segundos = (pygame.time.get_ticks()-cronometro)/1000 for event in pygame.event.get(): if colidiu(): tela.fill((0,0,0)) tela.blit(textoperdeu, (150,300)) tela.blit(textoperdeu2, (150,350)) rsegundos = fonte.render(str(segundos), True, (255,0,0)) tela.blit(rsegundos, (150,400)) pygame.display.update() time.sleep(4) pygame.quit()

Como vemos acima, temos uma definição do segundos logo após o "while" que será o contador por meio da fórmula que vai gerando os valores do cronômetro (os valores vão sendo mostrados no shell do Python por meio do comando "print"). Na parte do código responsável pela colisão, existe o código "fonte.render" responsável por tornar esses valores numéricos como texto, para em seguida ser expresso pelo comando "tela.blit". Caso não faça essa renderização, o Python não consegue expressar na tela o valor numérico do contador. 

Com isso finalizamos o post de hoje, no qual você pode encontrar o código-fonte em: https://drive.google.com/drive/folders/1IzRBVFoil3PL1GMbhwj2Yh3L10Cbz48K?usp=sharing. Existe diversas possibilidades de ir melhorando essa versão de um game PVP, a citar exibir em tempo real o cronômetro e inserir a possibilidade dos turnos entre jogadores automaticamente sem que o jogo feche e que ao final mostre automaticamente quem venceu, dentre outras possibilidades. Agora é com você, construa seu game com a modalidade PVP incluída e compartilhe entre seus amigos. Até a próxima!

Pygames: Construindo inimigos com deslocamentos randômicos e com Game Over

Em post anteriores usando a biblioteca Pygames, construímos diversos elementos que devem estar presentes em um game, tais como:

-Criando um cenário e a movimentação de um personagem (https://vemfazermatematicaegames.blogspot.com/2019/04/pygames-criando-um-cenario-e.html).

-Como inserir sons no seu game (https://vemfazermatematicaegames.blogspot.com/2020/05/pygames-como-inserir-sons-no-seu-game.html).

-Usando cliques do mouse para criar diálogos (https://vemfazermatematicaegames.blogspot.com/2020/05/pygames-usando-cliques-do-mouse-para.html).

-Colisão entre objetos (https://vemfazermatematicaegames.blogspot.com/2019/04/pygame-colisao-entre-objetos-parte-01.html e https://vemfazermatematicaegames.blogspot.com/2019/04/pygame-colisao-entre-objetos-parte-02.html).

Agora iremos juntar todos eles com a inserção do último elemento restante: um "inimigo" que se desloca pela tela guiado por uma fórmula matemática:

Para iniciar, é importante importar bibliotecas "math", "random" e "time" que serão necessárias para alguns comandos, além da já usada Pygames (isso é feito no começo da programação com o uso do "import"). O principal incremento é a fórmula de deslocamento do "inimigo" (que no nosso modelo é o cogumelo), que deve ser colocada dentro do loop "while not fgExit" com o uso de uma variável de contagem que definimos como "t=0". Observe abaixo:

while not fgExit: t = t + 1.5 xcogumelo = 400+ 300 * math.cos( 0.01*t)+ 40 * math.cos( 0.09*t +0.3) ycogumelo = 200 + 128 * math.sin( 0.01* t)-40 * math.sin( 0.06*t)

Você pode fazer alterações na velocidade aumentando ou diminuindo o incremento (o valor 1.5) e modificar os deslocamentos diretamente na fórmula. Ainda é possível construir uma fórmula totalmente do zero e ir testando seu desempenho. Que tal?
Uma importante alteração feita, foi no comando "tela.blit(personagem2Img, ( xcogumelo -128 , ycogumelo -128 ))", no qual foi inserido o valor -128 para X e Y e isso foi necessário devido ao posicionamento do bitmap que não considerou o centro da imagem, por isso esse deslocamento de -128, se tornou necessário. Caso você troque de imagem, precisa modificar essa valor de raio do círculo da imagem.
Obviamente, agora temos a disposição um game que necessita que você desloque seu personagem pela tela para não colidir com o inimigo. E se colidir, o que acontece? Uma possibilidade é ser o game over do jogo e para isso foi acrescentado os comandos abaixo:

if colidiu(): tela.fill((0,0,0)) tela.blit(textoperdeu, (150,300)) pygame.display.update() time.sleep(4) pygame.quit()

Como você pode ver, quando existe a colisão, a tela é limpa (fill), é escrito na tela o texto do "game over" (blit) e em seguida, temos um pausa de 4 segundos (sleep(4)) e por fim o jogo fecha (pygame.quit ()). Para customizar isso, existe a possibilidade de escrever novos textos, inserir novas telas ou até mesmo modificar o tempo de espera ou reiniciar o game automaticamente.

Você pode encontrar o modelo do game aqui descrito em: https://drive.google.com/drive/folders/1kT6_sVDmej9-zu-q9ERSrN12nnnx0qCS?usp=sharing. Espero que tenha gostado e que isso o incentive a desbravar o mundo dos games em Python. Recomendo o site do Pygames (https://www.pygame.org/tags/all) onde existem diversos exemplos de games já produzidos que você pode baixar, executar e modificar para ter novas ideias. Até a próxima!

Pygames: Usando cliques do mouse para criar diálogos

O post de hoje é uma continuação da série Pygames, e é aconselhável você ver o post anterior (https://vemfazermatematicaegames.blogspot.com/2020/05/pygames-como-inserir-sons-no-seu-game.html) que já possui uma série de opções já construídas para caso você não consiga entender tudo sobre o código aqui apresentado. Iremos hoje usar a função de cliques do mouse para mostrar um enredo que pode estar embutido no seu game. O layout usado está disponível em: https://drive.google.com/drive/folders/1HLSHOZClAs26ATXSQVRTnh3k69SSoYoG?usp=sharing.

Para inserir a opção de cliques dentro do seu game é bem fácil, já que é um comando semelhante aos do teclado usados anteriormente, como você pode ver abaixo:

if event.type == pygame.MOUSEBUTTONDOWN: contador = contador +1 if contador == 1: tela.blit(texto1, (0,550)) if contador == 2: tela.fill((0,0,0)) tela.blit(texto2, (0,550)) if contador == 3: tela.fill((0,0,0)) tela.blit(texto3, (0,550)) if contador == 4: tela.fill((0,0,0)) tela.blit(texto4, (0,550)) if contador == 5: tela.fill((0,0,0)) tela.blit(texto5, (0,550))

Como você pode ver acima, foi criado um contador que inicia no zero (parte inicial das definições, veja na programação destacada abaixo) e que adiciona mais um ao contador para cada clique dado com o mouse e em seguida existe um "se" (if) para os valores 1,2,3,4 e 5 com as programações de limpeza da tela (tela.fill) e desenho na tela do texto (tela.blit) que corresponde ao valor numérico. Esses textos estão pré formatados na parte inicial da definição, como pode-se ver abaixo:

fonte = pygame.font.SysFont("dejavusans", 30) texto1 = fonte.render("Olá gamer, seja bem vindo ao jogo do Mário!", True, (255,0,0)) texto2 = fonte.render("Vamos começar a jogar?", True, (255,0,0)) texto3 = fonte.render("Use as setas para se movimentar", True, (255,0,0)) texto4 = fonte.render("Quais som você escuta?", True, (255,0,0)) texto5 = fonte.render("Obrigado por prestigiar esse game!", True, (255,0,0)) contador = 0 tela = pygame.display.set_mode((largura_janela, altura_janela))

Resumindo, a cada clique de mouse aparece uma nova frase que pode contar uma história ou um dialogo do game para o seu usuário. Para aumentar o número de frases, basta ir aumentando as frases na definição e nos "se" (if) seguindo o modelo já mostrado.

O post de hoje abre um desafio muito grande para você. Como criar diálogos ente diferentes personagens ou mesmo contar uma longa história que tenha vários caminhos possíveis (árvore de possibilidades). Você consegue dar conta desse desafio? Se conseguir, poste nos comentários como solucionou isso. Até a próxima!

Pygames: Como inserir sons no seu game

Lembra do nosso projeto de criar cenários e fazer  personagem se movimentarem por ele: https://vemfazermatematicaegames.blogspot.com/2019/04/pygames-criando-um-cenario-e.html. Hoje daremos continuidade  a ele, inserindo sons para customizar o nosso game. Uma atenção especial é que nem sempre o Python (com a biblioteca Pygames) faz a leitura do som em formato MP3, por isso tenha em mão um conversor (programa ou online) para outros formatos como o OGG e o WAV.

A primeira opção de som a ser colocado no game é o som ambiente que será tocado durante todo o game. Abaixo temos o código responsável por ficar tocando o som:

somdefundo = pygame.mixer.music.load('somdefundo-mario.mp3') pygame.mixer.music.set_volume(0.2) pygame.mixer.music.play(-1)

Lembre-se de sempre colocar o nome do arquivo e a extensão corretamente para não dar problemas na hora de executar o game. Além disso, quando usamos sons, pode acontecer dele ser extremamente alto ou baixo, de modo a prejudicar a execução do game. Isso pode ser ajustado com o comando "set_volume" que pode assumir valores entre 0 e 1 para ajustar o som sem precisar fazer qualquer modificação no arquivo.

Além do som de fundo, os games possuem sons associados ao personagem e ao ambiente. No exemplo abaixo, temos o código responsável por fazer sons quando o personagem pula e anda para frente e para trás:

pulo = pygame.mixer.Sound('pulo-mario.ogg') passo = pygame.mixer.Sound('passo.ogg') if event.type == pygame.KEYDOWN: if event.key == pygame.K_LEFT: x1 = -5 passo.play() if event.key == pygame.K_RIGHT: x2 = 5 passo.play() if event.key == pygame.K_UP: y1 = -5 pulo.play()

Assim como o código do som ambiente, é necessário definir um carregamento do arquivo de som, mas nesse caso, o play deve ocorrer somente na ação estipulada (pular ou andar) e por isso o play do som fica localizado no código referente a tecla de movimento. 

Caso você queira o código-fonte utilizado nesse post, basta acessar o seguinte link: https://drive.google.com/drive/folders/1LYtnlEE7InMgMGlWCgU83FlVpUuKVW22?usp=sharing. Agora é a sua vez. Use os conhecimentos aqui adquiridos para fazer sua versão de um pequeno game que tenha sons de fundo e sons complementares. Até a próxima!

Revista Maker

O post de hoje é um compilado das Revista Maker que serão atualizadas semana a semana e que trazem atividades das quatro áreas da Educação Maker do SESI SENAI SC para estudantes KIDS (7-10 anos) e TEENS (10-17 anos). Essas atividades em sua maioria são realizadas utilizando materiais simples que você encontra na sua casa.

Revista Maker Kids:

S01 E01 - https://issuu.com/esteladesa/docs/revista_maker_kids_-_s1e01

S01 E02 - https://issuu.com/esteladesa/docs/revista_maker_kids_-_s1e02

S01 E03 - https://issuu.com/esteladesa/docs/revista_maker_kids_-_s1e03

S01 E04 - https://issuu.com/bagatman/docs/revista_maker_s1e04_kids

Revista Maker Teens:

S01 E01 - https://issuu.com/esteladesa/docs/revista_maker_-_s1e01

S01 E02 - https://issuu.com/esteladesa/docs/revista_maker_-_s1e02

S01 E03 - https://issuu.com/esteladesa/docs/revista_maker_-_s1e03

S01 E04 - https://issuu.com/bagatman/docs/revista_maker_s1e04

Construindo um aplicativo de controle de gastos

Controlar seus gastos e ter uma boa saúde financeira é essencial para não acabar entrando em situações problemáticas como dívidas financeiras. Ter ao seu alcance um aplicativo que gerencie seus gastos é essencial e o post de hoje vai abordar essa possibilidade. Mas você deve estar se perguntando: existem tantos aplicativos de gerenciamento de gastos na rede, porque construir mais um? Pelo simples fato de que estar construindo este aplicativo, você já vai entender um pouco da dinâmica da Matemática Financeira e o controle de gastos. O aplicativo denominado Game Money que será abordado no post de hoje pode ser encontrado em: ai2.appinventor.mit.edu/?galleryId=5021055000903680.

Resumidamente esse aplicativo tem entradas numéricas para você colocar seu salário total, diversas despesas (aluguel, água, luz, etc.) e ao fim ele dá o valor que sobrou (se é que sobrou algo) por meio dos blocos de operações de soma e subtração que agem diretamente com os textos (no caso números) inseridos (destacado em vermelho), sem a necessidade de transformar esse dados em valores numéricos dentro da programação:

Como podemos ver acima, existe a possibilidade de armazenar esse valor em um arquivo .txt dentro do celular (opção dentro do Design>Armazenamento>Arquivo) que pode ser resgatado a qualquer hora, funcionando como um banco de dados simplificado (e off-line). Os blocos roxos com que advém da opção "Arquivo" (destacados em vermelho e verde) são responsáveis por guardar informações no arquivo, fazer a leitura e apagar totalmente os dados. Note que, mesmo que você saia do aplicativo sem limpar o "Arquivo", todos os dados ficarão lá armazenados para uma próxima utilização, a única coisa que não ficará guardada é o contador dos meses que será reiniciado após cada vez que a aplicação for encerrada. Na figura abaixo, mostra como fica a base de dados (usando um arquivo) que foi interrompido a contagem dos meses (foi fechado o aplicativo) e sua relação com a estrutura de texto que foi mencionada acima (destacada em vermelho na figura acima):

Assim encerramos a construção do aplicativo de finanças, mas é apenas o começo. Se você parar para pensar é possível adicionar diversas outras funcionalidades e customizações que vão deixar o aplicativo ainda melhor e mais funcional para você. Hora de botar a mão na massa e construir sua própria versão do Game Money, afinal tempo é dinheiro! Até a próxima.