Resumo da Live sobre SDL

Olá, bem-vindos a mais uma live. Vamos continuar a nossa exploração da biblioteca SDL. SDL é uma biblioteca que é usada muito no desenvolvimento de jogos. Vou usar o C++, guarda o programação para poder demonstrar a demonstração da SDL 2. Se você ainda não é inscrito no canal, por favor se inscreva, deixa seu like e comentário. Nos ajuda muito. Você tem como doar alguma coisa para a gente. Tem aqui uns códigos que é R na tela. Você pode usar fazer uma doação de BTC ou BH. Então vamos começar partindo o que a gente já tinha antes. A gente vai dar o G++, o MEN, o CTP, para a Suelle SDL 2. A gente tem uma tela azul, um título lá, mundo. Uma coisa que a gente vai fazer é aprender a pintar a tela com mais retângulas para praticar. E depois disso a gente vai lidar com entrada de usuário. Vamos aprender como deixar a tela pintando direto para que o programa não peixe na mesma hora. Vamos aprender a lidar com as teclas de seta para poder mover um bloco na tela. Esse bloco vai representar o jogador. Vamos fazer um quadrado na tela que a gente vai usar para representar o jogador para demonstrar a programação da entrada do usuário. Vamos lá. Vamos fazer o seguinte. Vamos consertar o problema que a tela desapareceu e o programa terminou de uma vez. A gente vai fazer o chamado GAMING LOOP, que é a interação do jogo. Isto é, o jogo vai ficar repetindo no loop infinito até que o usuário diga que ele quer sair. Certo? Depois de pegar a superfície da janela, eu vou fazer o seguinte. Vou botar um while e vou fazer uma variável. Variável eu chamar, por exemplo, sair. Enquanto sair, enquanto o usuário não quiser sair, a gente vai pintar a tela com fail rack e atualizar a tela. Com isso não precisa mais do delay para pausar, vou comentar isso. Agora, esse BULL, a gente vai fazer aqui em cima, BULL, verdadeiro ou falso. Sair, eu vou... Vamos supor que o usuário não queira sair e vamos fazer esse loop infinito, enquanto sair. Não for verdadeiro. A gente tem que lidar com a entrada do usuário, a gente vai lidar com a entrada antes de pintar aqui. E nessa entrada, a gente vai verificar se o usuário clicou no botão de X para poder sair do programa. Para poder fazer isso, a gente tem que lidar com eventos. Eu vou criar um Sdl event, deixa eu criar aqui em cima. Sdl event, vou chamar isso de event, ou event, qualquer coisa. E a gente vai verificar se tem algum evento antes de pintar alguma coisa. A gente pode usar a função Sdl e PULL event. Aí você manda um endereço, o at, 1% do event. Isso vai retornar um valor, como você tem o PULL event. Você vai ter vários. Então a gente realmente faz um loop em todos os eventos. E se o valor não for zero, significa que tem alguma coisa para processar, se não for zero. Então enquanto o PULL event tiver alguma coisa para processar, a gente vai ver aqui. E quando a gente olhar no evento, a gente vai ver se é o usuário que saiu do programa. Vamos ver. Se o event.dive for Sdl quit. Nós vamos fazer o que? Vamos setar ou sair para tu. Dessa maneira, na próxima check do loop, ele vai terminar o loop e vai terminar o programa. Vamos testar. Aqui a minha tela azul. E ele continua na tela, a tela não desaparece. O botão de X aqui para fechar a janela, quando a gente clicar, ele sai do programa. Isso que a gente fez aqui no ILE, no event.type, igual Sdl quit, fechar. Setamos sair para tu para ele poder sair do programa. E terminar e destruir a janela e fechar o Sdl. Pronto. Com isso a gente vai agora praticar fazer, desenhar mais uns retangos na tela. Certo, vamos ver aqui. Então vamos supor, temos a tela aqui. Vamos supor que o queira fazer um retângulo que ocupe um quarto da tela. Isto é. Essa parte aqui do topo, à esquerda. Para poder fazer isso, a gente tem que usar, arrumar uma maneira de delinear a área da superfície que a gente quer pintar. Para isso a gente vai usar a estrutura chamada SdlRec. SdlRec é para um retângulo. Então para demonstrar isso na linha 35, eu vou fazer um SdlRec retângulo. Um. Esse retângulo tem quatro propriedades essenciais que a gente vai precisar. Posição, x e y do. Para onde vai começar essa área e a largura e a altura. Vamos começar com a largura e a altura. Então vamos lá, retângulo um. Largura é o W, certo? Então a gente vai usar a ponta W aqui. Da estrutura. Vamos mudar aqui para ser três. Então a gente quer que ocupe o quê? Oculpe metade da largura, né? Se for um quarto da tela. No sentido do topo, à esquerda. Então a gente vai fazer 640 dividido por 2. Para a altura mesma coisa. Ponto H é para a altura 480, que é a altura da tela, dividido por 2. Agora para a posição eu vou botar retângulo um ponto x a zero. Retângulo um ponto y a zero. Isso significa que vai começar lá no topo à esquerda. Então, vou mostrar aqui. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Desenhar aqui para você ver. Vou tentando abrir o programa de desenhar, mas não está abrindo. Não sei porque está funcionando anteriormente. Pronto. Pronto, demorou um pouco para abrir, mas abriu. Então, vai ter a tela, alinhante que é, pintar. Para esta parte da tela. Certo? Este é o objetivo. Agora, o x, certo? x e y, vão nessa direção. O x começa do topo, a esquerda vai para o topo, a direita. O y, coordenado, vai do topo, a esquerda, para baixo, a esquerda. Então, 0, 0 vai ser aqui. 0, 0. 0, 0. 0, 0. Está bom, então vamos lá. Vamos sair e recompilar. Nada aconteceu, porque a gente só definiu o retângulo e não usou ele para nada. Então, vamos fazer o fill-wrap. Deixa eu dar o... Sdl, fill-wrap, para encher retângulo. A superfície vai ser Windows Surface. A gente quer agora, segundo argumento, especifica onde na superfície você quer, qual área da superfície você quer pintar. Neste caso, vai ser a área delineada pelo retângulo 1. Então, vou dar o endereço retângulo 1. E a cor você escolhe, pode ser mapRGB, formato da superfície, Windows Surface, Format. Vamos dar vermelho, então 255 vai vermelho, 0 verde, 0 azul. Vamos tentar novamente. Agora tem assim. Vamos aprender agora como centralizar horizontalmente essa caixa, retângulo. Então, vou aumentar aqui. A gente quer centralizar o retângulo. Para mover ele para o centro. E também depois para vertical. Para fazer isso, a gente vai pensar aqui. Vamos pensar aqui. Se eu pôr uma linha aqui no meio... O... Desminuí... Se eu pôr uma linha aqui no meio... Se eu mover a largura dele próprio, ele vai parar aqui. Isso está errado. Se eu mover a largura da tela dividida por dois... Bem, porque eles têm metade? Então fica meio confuso, mas vai também parar no meu local. Deixa eu mudar aqui a largura do retângulo, em vez de ser metade, eu quero que seja 3,4. 3, 2, 1, 4. Mesma coisa para a altura. Para não poder confundir, porque ambos são metade, então fica difícil aqui. Eu vou supor que eu tentei 3,4 agora. E eu quero centralizar isso. Então... A gente vai fazer o seguinte. Deixa eu aumentar aqui. Isso que a gente quer agora. Então se esse for agora assim... Se eu mover metade da tela, ele vai parar aqui. Não dá certo. Se eu mover metade de seu... Sua própria largura, ele vai parar aqui. Mas ainda seria errado. Então a gente vai fazer o seguinte. A gente vai pegar a largura da tela. Subtrair a largura dele própria. Indivíduo por dois. Na verdade seria metade da tela aqui. Pega metade, pega metade dele. E subtrair para poder vir daqui e ir para lá. Pela metade e ir ficar no centro. Vamos lá. Antes de fazer isso, eu quero botar... Esses números da largura e altura da tela em um constante. Em um variável. Aqui em cima eu vou dizer int... WindowF... 640, int, WindowHeight... 480, em vez de falar aqui 640, vou falar as variáveis que eu criei. Mesma coisa aqui embaixo. Agora vamos mover na horizontal. Vai ser... A medida da tela dividir por dois menos... A largura do retângulo 1. Dividir por dois. Agora está centrar usado horizontalmente. Mesma coisa para vertical. Mesma... Fogo. A gente também pode simplificar a almoção de dividir por dois. Então combina aqui os parênteses. E para o outro canto, para o Y, é só usar o WindowHeight. A altura da tela menos. A altura do retângulo. Divido tudo por dois. Esqueci de um. Vamos estar sentado. Vamos fazer a mesma coisa para fazer o retângulo. Está dentro do vermelho. Vamos fazer o retângulo. Vamos fazer o retângulo. Vamos fazer o retângulo. Vamos fazer o retângulo. Está dentro do vermelho. Quero que você tenha cor verde. Seja menor de largura altura. Então é só fazer a mesma coisa. Primeiro você faz um S-DeliRack. Fazer o retângulo 2. Você pode definir o X, Y, K. WH. Então retângulo 2. W. Vamos fazer o WindowHeight. Vamos fazer o WindowWidth. Vamos fazer metade. Retângulo 2. A altura. WindowWidth. Não, WindowHeight. Divido tudo por dois. Então retângulo 2.x vai ser centralizado também. A mesma coisa. WindowWidth. Largura da tela. Menos a largura do retângulo 2. Divido tudo por dois. Mesmo a altura. Retângulo 2.y igual o WindowHeight. A altura da tela. Menos retângulo 2.h. A altura do retângulo. Divido tudo por dois. Agora vamos fazer o S-DeliRack. Com o verde. Da tela. Segundo o argumento vai ser o retângulo. Que é a área que a gente vai pintar. Passa o endereço. Porque ele espera um ponteiro para S-DeliRack. Um retângulo 2. Dá o S-DeliMap. RGV para C. Formato da superfície da janela. WindowSurface. Format. C, vermelha 0. Verde, vou botar 255. E azul, 0. Vamos tentar novamente. Agora temos isso aqui. Tá bom. Para quem não é inscrito no canal ainda, por favor se inscreva. Não se esqueça de deixar seu like e comentário. Ajudaria muito se você doasse alguma coisa. BTC ou BCH. Obrigado. Vamos continuar então. Agora gostaria de fazer um quadrado para poder indicar que é o jogador. Esse quadrado aqui vai começar na tela, na posição 00. E a gente vai adicionar a entrada. Adicionar controle da entrada para a gente digitar as teclas de 7 para poder mover aquele quadrado. O jogador. Vamos aqui. A gente já sabe como fazer um retângulo. Para poder fazer esse quadrado do jogador é só usar o fail rack para pintar. Mas tem que ter a posição da área. Tem a superfície da tela. Mas o jogador vai estar em uma certa parte. Vamos usar uma chamada tijolo. Tile. Vamos usar o tile de tamanho 32 por 32. Quadradinho. Vamos lá. Vamos aqui fazer o seguinte. Fora do loop, eu vou fazer um sdli rack que vai ser a posição do jogador. Posição do jogador. Isso vai começar. Eu vou já definir aqui na mesma hora. O x, y, y vai ser 0. Y vai ser 0. W vai ser a altura de 32. Vai ser o quadradinho que vai aparecer aqui no topo acima. Vai indicar que é o jogador. Vamos criar uma cor para o jogador. Vou fazer o sdl map. Vou passar o windowsurface format. E a cor, curbio. Eu vou fazer 128, 128, 128, que é arbitrário nesse momento. Vou armazenar isso. O valor de return sdl map rgb é windows32. Vou usar ele. Codo jogador, vou dizer. Agora aqui embaixo, na hora de pintar. Depois de pintar o mapa, vamos chamar a tela, o que está pintado na tela do mapa. Vai ser o mapa do jogo. A gente vai acima de tudo, acima do mapa. Não de baixo. Vai ser acima, por isso eu vou botar tudo depois da pintura dos atangulos. Vai ser a pintura do retângulo do jogador, do quadrado do jogador. Vou dar sdl fail rack na superfície da tela. Agora a área vai ser a posição do jogador. Mas como a função espera um ponteiro, eu vou botar o ampersand. A cor vai ser o cor do jogador. A gente definiu lá em cima. Vamos ver o que dá. Vamos ver no que dá. Pronto, agora a gente tem aqui no topo acima, essa cor meio cinza, para indicar que esse é o jogador. A gente quer que pressione a tela agora e mova esse jogador para a direita, para a esquerda, para baixo, para cima. Vamos lá. Para poder fazer isso, a gente vai lidar com o evento de key down, quando a tecla é pressionada. Você vai aqui no loop dos eventos, que dá processamento dos eventos e você vai adicionar um novo caso aqui. Se não for quit, vai ser outra coisa. Então a gente vai botar else if event.type vai ser sdl key down. Key down é, a tecla foi pressionada e está pressionada para baixo. A gente vai ter que checar qual a tecla, porque pode ser qualquer tecla do teclado. Qual foi a tecla? A gente quer checar se a tecla for as teclas de cima, baixo, direita ou esquerda, as setas. Então vamos verificar aqui if event.key que é tecla. .key sim .sim é meio grande. Se isso for igual a sdl por exemplo. Vamos começar para a direita? Vamos botar write. Se for a seta para a direita, sdl key .key underscore write nós vamos adicionar 32 à posição x do jogador. Então ele vai ser pintado na próxima pintura na posição 32 para direita. Então ele vai mover efetivamente para direita. Então a gente vai chamar posição jogador.x igual a posição jogador.x anterior mais 32, que é o tamanho do passo. A gente vai considerar esse mapa aqui com tijolos de 32x32 styles. E cada passo é 32. Eu vou salvar isso. Vamos testar. Agora quando eu apertar tecla para a direita ele vai mover. Agora a gente pode fazer a mesma coisa para baixo para cima e para esquerda. Então vamos lá. A mesma maneira você adiciona elseif event key .key sim igual sdl key. Vamos botar para baixo. Então posição jogador.y agora que vai para baixo. Igual a posição jogador.y e o que? Como o y vai de cima para baixo a gente tem que na verdade adicionar para o y. Para poder ir para baixo. Então é mais 32 e vamos lá. Vamos lá. Eu estou apertando agora a tecla para baixo. Certa para baixo e ele vai para baixo. Se você apertar e segurar ele vai lá continua. Você viu que ele saiu da tela. Isso é um problema que a gente vai consertar depois. Então vamos fazer o rest. Elseif vamos fazer então direita para baixo. Vamos fazer esquerda agora. Event.key .key sim.sim igual sdl key. Left para a esquerda. Posição jogador.x igual que a posição jogador.x anterior menos 32. Agora se eu for para direita e for para baixo a esquerda também funciona. Vamos fazer para cima. Elseif aqui.key sim. Sim igual sdl key. Up para cima. Posição jogador.y igual a posição jogador.y que. Agora vai ser menos 32. Você está indo para cima. Significa que você vai se aproximar mais do zero do y. O zero do y começa no topo à esquerda. .key estou para baixo. .key Agora posso ir para direita para baixo para esquerda e para cima. .key .key .key .key .key .key .key .key そう assim. .key .key .key .key .key .key .key .key . Pink .key .key adicionar um tem duas maneiras né a primeira é você antes de atualizar a posição você checar se ele não vai sair da tela a outra maneira é você já mudar para sair da tela e na mesma hora reverter isso se ele for fora da tela eu vou fazer o primeiro que é primeiro checar antes de mudar a posição então é só ir aqui adicionar um mais um efe para você você só pode fazer essa operação de para direita se a condição de que quando adicionar 32 ele não sai da tela então se a posição jogador ponto x mais 32 como é que eu posso garantir ele ainda está na tela a gente só vai mover se ele ainda estiver na tela depois de mover para direita 32 bem a tela tem uma largura de window o efe né se eu pegar essa largura e eu usar esse aqui ele sempre tem que ficar antes né a gente desenhar aqui mais um você tem a tela você tem um jogador aqui então você está aqui né você vai para lá esse essa posição aqui essa largura é o efe né o efe da vida tem aqui a largura do jogador que é o falar jota e então se eu adicionar 32 ele vai parar aqui isso não pode né então tem que checar ele só vai funcionar se eu tivesse aqui por exemplo isso para lá e para ser que se essa posição ainda fosse menor que essa efe mas tem que ser menos 32 que a largura do efe porque senão você checar e estava aqui em vez de checar está aqui vamos lá isso tem que ser menor ou igual a window efe se você pô o menor aqui você vai ver que ele vai dar o problema de não vai funcionar você tem que ter o igual também a então e então a eu estou usando o mapa de 32 né cada tiju é 32 e por isso que eu não estou olhando para o caso de por exemplo se eu parar aqui ó se o jogador tivesse entre lá fora e lá eu não vou considerar esse caso porque eu considero o passo de ser sempre exatamente 32 e o mapa por si só tem uma uma linha né de 20 tijolos exatamente 20 tijolos certinho então é só testar agora vamos lá se não deu nenhum erro lá eu vou tentar lá para a direita opa que aconteceu não deu certo vamos ver o que aconteceu aqui o suficientes direito se você adicionar ainda ficar antes do window e será que eu salvei e ver aqui e e o nome do excel porque será e ver aqui e aí e ai vamos ver que o menor verdade eu fiz o outro eu inverti e eu inverti e porque se tivesse igual na verdade ele bateria ele deixava você sair somente um passo você ficaria aqui fora por um passo mas não poderia dar mais para a direita por isso que estava errado e eu acho que eu confundi com outra com o da provavelmente o da o começo mas se ainda ficar dentro da tela né eu estou apertando para direita ele não sai e a mesma maneira você vai lá para baixo em vez de um e faz ser o que o indo right que a altura então só vale deixar eu vou ver para baixo enquanto a posição né jogador y mais 32 tem que ser menor que a window right e o anseu dentro salva fecha recompila e executa vou tentar ir lá para baixo e está bloqueada não vai mais para baixo não vai mais para direita mas ele vai para a esquerda e vai para cima vamos consertar isso também mesmo coisa né quase a mesma coisa se a posição jogador se ele foi para a esquerda por exemplo ele tiver a posição 00 ele tentar ir para a esquerda e isso for menor o negativo vamos lá posição jogador y menos x menos 32 só vai deixar isso e ainda ficar maior que a que maior que 0 né ou igual a 0 que se for igual a 0 e vai estar lá no ponto 0 mesmo do maior vai ser no 32 assim por diante e o Testa o para esquerda. Vou tentar ir para a esquerda, estou apertando sete para a esquerda e não vai. Não vai mais. Faz a mesma coisa aqui para o Y. If, posição, jogador, ponto Y. Você vai para cima, significa menos 32. Tem que ser maior que zero ou igual a zero. Está aqui. Tentar ir para cima, não vai, sete para cima, não vai mais. Então a gente está agora dentro da tela, não sai mais. Tentar ir para cima, não vai mais. Tentar ir para cima, não vai mais. Tentar ir para cima, não vai mais. Então vamos revisar o que a gente fez. Tentar ir para cima, não vai mais. Tentar ir para cima, não vai mais. Tentar ir para cima, não vai mais. A gente aprendeu como lidar com eventos, só criar um SDL event, faz essa variável. Aí a gente fez o game loop, a interação do jogo, que fica repetindo as coisas até o usuário indicar que ele quer sair. Nós, primeiro, definimos sair como falso, ele não quer sair ainda. Você vai fazer, chamar o poll event com o endereço da variável event para poder ver se tem algum evento para processar. Se esse valor não for zero, significa que tem alguma coisa. Então ele vai pegar e vai modificar a variável aqui para pôr o evento lá. As informações do evento vai estar na variável evento. A gente vai fazer um loop para poder fazer o processamento de cada evento que tiver. Se o tipo do evento, event.tip, for SDLquid, significa que o usuário quer fechar a tela. Significa que talvez, por exemplo, cliquei no X, nesse X, em ter fácil, do usuário. Você sete o sair, essa boolean, valor essa flag, bandeira para true. E na hora que terminar o loop, ele não vai mais continuar a repetir e vai terminar o programa. Destruir a janela e fechar o SDL. Outros casos de entrada são do movimento de jogador. Se o usuário apertar algum teclado do teclado, é o SDLquid down. Esse evento ocorre quando você aperta a tela. Se essa tecla, a gente checa a tecla com o evento key, key sim, key sim. Se a tecla for essa constante que indica que é a tecla da direita, você move o jogador para a direita, só modificar a estrutura da posição. Mesmo uma coisa para a down, que é para baixo, para a left, que é a esquerda, para a up, que é para cima. Aprendemos também a manter o jogador na tela sem que ele saia da área da tela. Para isso, a gente faz esse F para testar. Se a gente for mudar a posição, ele ainda fica na tela, você pode modificar a posição. Se não, se ele tentar ir fora da tela, a gente não deixa. Acepta. Então é isso. Nós temos um protótipo de jogador movendo na tela. Então por essa aula, por essa só, não se esqueça de se inscrever no canal. Deixe seu like, comentário. Duações sempre... Sempre aberto para doações se você tiver BTC ou BCH. Se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se você tem alguma dúvida, se