Construye tu primer juego en 2D con flutter y llama para iOS y Android | Rahul Agarwal | Skillshare
Pesquisar

Velocidade de reprodução


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Construindo seu primeiro jogo 2D com Flutter e Flame para iOS e Android

teacher avatar Rahul Agarwal, Flutter Developer & Trainer

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Introdução de curso vídeo

      1:01

    • 2.

      Criar um projeto do Flutter

      8:18

    • 3.

      Criando um curso de jogo

      11:47

    • 4.

      Adicionando fundo e jogador

      12:15

    • 5.

      Adicionando movimento com joystick

      10:28

    • 6.

      Limites de tela para o jogador

      8:51

    • 7.

      Adicionando componente de haltere

      3:24

    • 8.

      Adicionando HitBoxes a componentes

      7:08

    • 9.

      Reagir a uma colisão

      5:19

    • 10.

      Posições de halteres

      5:24

    • 11.

      Adicionando componentes de vírus

      5:10

    • 12.

      Adicionando movimento ao vírus

      7:19

    • 13.

      Limites de componente de vírus

      12:44

    • 14.

      Colisão entre vírus e jogador

      8:46

    • 15.

      Componente de texto para pontuação

      4:43

    • 16.

      Atualizando a pontuação e o tempo

      4:41

    • 17.

      Jogo sobre o menu

      8:19

    • 18.

      Tela de menu principal

      5:01

    • 19.

      Tela de jogo

      10:25

    • 20.

      Mudar o Sprite do jogador condicionalmente

      11:41

    • 21.

      Criar um componente de vacina

      6:28

    • 22.

      Adicionar vacina em intervalos aleatórios

      14:17

    • 23.

      Trabalhar no componente de proteína

      18:10

    • 24.

      Adicionar uma tela de respingo

      4:51

    • 25.

      Alterar o ícone do lançador

      7:18

    • 26.

      Teste o jogo completo

      0:39

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

24

Estudantes

--

Sobre este curso

Você se lembra dos jogos 2D clássicos que costumávamos jogar como crianças? Como Mario, Contra, Donkey Kong, combate mortal etc. você está interessado em desenvolver seus próprios jogos para celular, mas não sabe por onde começar? Bem boas notícias é, agora você também pode construir seu próprio jogo móvel 2D com este novo curso emocionante que o levará em uma jornada de desenvolvimento de jogos do zero com a ajuda de flutter e motor de jogo de chama! Este curso abrangente foi projetado para ensinar aos iniciantes os conceitos básicos de desenvolvimento de jogos usando o framework Flutter e o motor de jogo Flame.

Com instruções passo a passo e explicações, você aprenderá como criar seus próprios jogos 2D para dispositivos iOS e Android. Você começará criando seu ambiente de desenvolvimento e aprendendo os fundamentos do design de jogos, incluindo sprites, animações e detecção de colisão. A partir daí, você mergulhará em tópicos mais avançados, como manipulação de entrada, efeitos sonoros e mecânica de jogo.

Durante todo o curso, você trabalhará em um jogo de amostra, construindo-o do zero e personalizando-o ao seu gosto. No final, você terá um jogo totalmente funcional que você pode compartilhar com amigos e família ou até mesmo publicar em lojas de aplicativos.

Quer você seja um iniciante completo ou um desenvolvedor experiente que procura expandir seu conjunto de habilidades, "Construindo seu primeiro jogo 2D com Flutter e Flame" é o guia perfeito para ajudá-lo a começar no desenvolvimento de jogos.

Conheça seu professor

Teacher Profile Image

Rahul Agarwal

Flutter Developer & Trainer

Professor

Hello, I'm Rahul. I am skilled in building cross platform application using Flutter. I am freelance developer as well as conduct workshops to share my knowledge with the community.

Visualizar o perfil completo

Level: Beginner

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Introdução de curso em vídeo: Você se lembra dos jogos 2D clássicos que costumávamos jogar quando crianças, como Mario Contract, Donkey Kong, mortal combat, etc. Uma boa notícia é que agora você também pode criar seu próprio jogo 2D para celular com este novo e empolgante curso que o levará a uma jornada de desenvolvimento de jogos do zero com a ajuda da Flórida e do motor de jogo Flame? Começaremos com o básico, como para configurar um projeto. Depois, aprenda sobre como criar e adicionar sprites. Implemente entradas do usuário, como controles de joystick, configure um loop de jogo para manter nosso jogo funcionando sem problemas. Você também aprenderá como detectar colisões entre objetos e adicionar efeitos sonoros para aprimorar sua experiência de jogo. Se você é um programador iniciante ou experiente. Este curso foi desenvolvido para ajudá-lo a dominar as habilidades necessárias para criar seus próprios jogos 2D. Ao final do curso, você terá um jogo completo que poderá compartilhar com amigos, familiares e até mesmo publicar na App Store. Então, sem perder mais tempo, vamos começar. 2. Vídeo 1 Crie um projeto de flutter: Olá, bem-vindo ao primeiro vídeo do curso, onde aprenderemos como criar um jogo usando o motor de jogo flutter and flame. Então, espero que você já saiba o que é chama. Flame é uma estrutura de jogo 2D construída sobre a Flórida, qual podemos criar qualquer tipo de jogo 2D e executá-lo em todas as plataformas suportadas pela Flórida como celular, web e desktop. Com o flame, podemos criar uma grande variedade de jogos, incluindo jogos de plataforma, jogos de quebra-cabeça e menos corredores, RPGs, jogos de aventura e muito mais. Então, eu não quero entrar muito na parte teórica. Mas pelo menos devemos saber o que vamos construir. No final do curso. Vamos construir um jogo em que um homem precisa coletar halteres para ficar em forma, bem como evitar vírus para não perder massa muscular antes que o tempo acabe. Além disso, apresentaremos vacinas, que você mesmo pode coletar como imune por alguns segundos, bem como shakes de proteína, que lhe darão energia extra. Vamos começar criando um novo projeto na Flórida. Então vá para o diretório desejado abra seu terminal e crie um novo projeto na Flórida com esse código Flutter. Crie. Vou nomear o lutador do jogo. Pressione Enter. Ok. Já fizemos, criamos o projeto k. Além disso, já que não vou cobrar pelo Windows, Linux e Mac OS. Então, vou remover esse arquivo apenas para deixá-lo limpo e consumir menos espaço. Agora, anexe o editor VSCode e acrescente a nova pasta do jogo. A semana do curso para K. Ok. Agora, a primeira coisa que farei é instalar os pacotes necessários. Então vá para o desenvolvedor. E, em primeiro lugar, procure a culpa. Só chama. Este é obrigatório. Flame fornece um conjunto de ferramentas para criar os jogos, incluindo widgets para inserir sprites e emissões e gerenciar a lógica do jogo. Simplesmente, vou copiá-lo e colá-lo no arquivo YAML pub spec dot abaixo aqui na seção de dependências. Apenas salve-o. E outro pacote necessário é esse que é culpado pelo áudio. O Flame audio é um pacote que fornece ferramentas para lidar com áudio e jogos. Ele inclui utilitários para carregar e reproduzir efeitos sonoros e músicas, gerenciar canais de áudio e controlar a reprodução de áudio. Basta copiar este também. E cole aqui. Salve isso. Ok, acho que está funcionando bem. Nós temos os pacotes. Então, a próxima coisa que farei é criar uma nova pasta, ativos na raiz do nosso projeto que está aqui, vou apenas criar ativos. Aqui, precisamos de duas novas pastas, áudio e imagens. Esta é a estrutura de pastas proposta ou o jogo fake flame, ou seja, a estrutura visual. Nossa pasta, pastas de ativos como essa, ou seja, áudio, imagens. E eu anexei os ativos necessários neste vídeo, bem como no último vídeo em que nós, você pode baixar o todo, ou seja, o código-fonte completo. Eu tenho esses ácidos. Vou apenas copiá-lo e colá-lo na pasta do nosso projeto. Como você pode ver, temos o plano de fundo, o logotipo do jogo com halteres, diferentes tipos de físico do jogador, vacina contra o shake de proteína e o vírus. E para áudio, temos som de halteres, som de proteína. Ou seja, se colidirmos, coletarmos o material, então os sons serão reproduzidos. Se você quiser pesquisar suas próprias imagens, você pode pesquisar diretamente on-line por homens levantando halteres, vacina de desenho animado, I can PNG, protein shake, I can PNG. E para áudio, você pode simplesmente pesquisar gratuitamente para fazer o áudio do jogo. Agora, temos a pasta, a pasta de ativos, mas precisamos nos certificar de especificar os locais das pastas recém-criadas no arquivo YAML do Pub spec dot. Então, aqui você pode ver abaixo, você tem essa linha interna 64, você tem esses ativos. Então, basta remover, ir até esta linha e simplesmente remover pressione delete duas vezes, e vá abaixo e pressione duas vezes. Espero que você saiba que esse julgamento é muito delicado. Qualquer espaço ou guia extra gerará um erro. Aqui estão simplesmente mencionados ativos, imagens e o outro são os ativos de áudio. E salve-o. É isso para este vídeo. Na próxima sessão, criaremos nossa classe de jogo. Obrigada. 3. Vídeo 2 Criando um curso de jogo: Oi. Então, agora vamos aprender o conceito de classe de jogo flame. Este será o coração, ou você pode dizer, o ponto de entrada do nosso jogo. Criaremos e gerenciaremos todos os nossos outros componentes a partir daqui, vá para o arquivo principal de pontos. E vamos remover, basta remover tudo. Ok? Eu quero remover tudo aqui. Vamos criar uma aula separada para nossa classe de jogo, que é uma pasta separada em suas vidas. Basta criar uma nova pasta e chamá-la de jogos. E dentro dele, crie um novo arquivo. Peso. Jogo de luta. Nem dardo. Jogar a classe de jogos implementa um jogo baseado em componentes. Ele tem uma árvore de componentes e chama os métodos de atualização e renderização de todos os componentes que foram adicionados ao jogo. Então, para criar uma classe adquirida pela chama, basta criar uma classe, esse jogo de caça F8, e estendê-la para o jogo de chamas como este. É assim que você cria uma classe de jogo. Portanto, ele tem um método onload, ou o conjunto de métodos também, mas descarrega. E aqui eu vou simplesmente fazer disso um futuro. E uma pia aqui eu relaciono os componentes de uma pia que é qualquer outra imagem de fundo. Todos esses são componentes que podem ser adicionados à classe do jogo diretamente com a ajuda desse descarregamento. E aqui usaremos o método add apenas para adicionar esse componente à nossa classe. E esse carregamento é executado apenas uma vez durante a inicialização do nosso jogo. Então, esta é a classe do Flame Game. Vamos falar sobre esse widget do jogo. Cada jogo que você executa com chamas é rígido. Em nosso aplicativo da Flórida, como qualquer texto ou botão, o widget do jogo é um widget de flutuação usado para inserir esse jogo dentro da árvore de widgets da Flórida. Portanto, é muito simples. Basta ir ao arquivo principal de pontos e remover esse código que é minha classe e outro recurso que resta é a classe principal. Podemos passar diretamente o widget do jogo aqui no aplicativo Run. E isso requer uma instância de jogo que simplesmente chame o objeto do nosso jogo, como nesta luta final, de jogo. O jogo aqui. Basta passar a variável. E para ter certeza de que está pronto. Escreveremos esta Flórida, um widget da Flórida vinculativo e desvinculado, sem garantir que seja inicializado. Então, tudo é inicializado pelo flutter. Agora salve tudo, abra o dispositivo VR, ou seja, estou usando um emulador, mas você também pode usar seu próprio dispositivo. Agora, espere, isso. Basta começar a depurar. Pode levar algum tempo. Vamos ver qual é o erro? Acho que não há nenhum erro aqui, ok, esqueci de dar uma barra. É um erro muito tolo. Agora, basta desenvolver o aplicativo. Esses são erros muito pequenos e tolos, que acontecem. Então, como você pode ver, nosso aplicativo está em execução, mas não fará nada. Nós apenas dizemos tela preta vazia em nosso dispositivo. Como sabemos, já temos o áudio dos ativos para adicionar imagens dentro da pasta de ativos. Mas em vez de chamar esses arquivos pelo nome em todos os lugares, vamos criar um arquivo separado para eles. Então, vamos criar uma pasta. O nome é constante e, dentro dele, crie um arquivo. Ponto global. Armazenaremos todos os nomes dos ativos em variáveis estáticas. Essa abordagem evita erros de ortografia, além de ser conveniente alterar qualquer ativo posteriormente. Vamos criar uma classe global. A primeira coisa que farei é simplesmente tornar esse construtor privado para que não tenhamos que criar um objeto ou instância dessa classe. Chamaremos diretamente as imagens usando essa sequência estática estática. Sacola moída. Sprite é igual ao nome do sprite de fundo é ponto de fundo JPG. Denso, tão grosso. Olhou. Traga halteres brilhantes. Ele vai fazer PNG com pontos com halteres? Em seguida, estático, const, tocador de cordas. Magro. Sprite é igual à camada skinny dot PNG. Agora é só copiar e colar assim. Em seguida, temos o player sprite. Será player fit dot PNG. Então temos o jogador musculoso Sprite. É um PNG de pontos musculosos. Você está com febre. Ou seja, se ele foi atacado, então temos febre em camadas daquele PNG. Então temos o sprite do vírus. Vírus. E o nome do spray é virus dot PNG. Colou mais algum tempo. Em seguida, seremos vacina, vacina aquela PNG. E então temos proteínas sprite. E o nome é protein ik dot PNG. Essas são as imagens. Agora é hora do áudio. Basta colá-lo e será o som numérico. O nome do som é Número, som MP3. Ao copiá-lo, cole-o quatro vezes. O próximo é o som sem fio. Será muito menos PNG. Próximo som da vacina, ponto sonoro. Isso é onda, isso é onda. E, finalmente, temos o som da proteína. Aqui está o ponto de som de proteína, mp3. Sim. Então, nossas constantes estão prontas. Será muito conveniente ligarmos para qualquer ativo posteriormente em nosso aplicativo. E Q 4. Vídeo 3 Adicionando fundo e jogador: Oi, bem vindo de volta. Neste vídeo, criaremos nosso primeiro componente. Os componentes são os elementos básicos de um jogo em chamas. Qualquer entidade ou objeto dentro do jogo pode ser representado como um componente. É bastante semelhante aos widgets da Flórida. Tudo o que vemos na parte superior da tela, ou seja, todos os componentes, por exemplo , imagem de fundo, personagens mais antigos , objetos na tela, etc. Então, vamos para a pasta lib. Crie uma nova pasta chamada Come ponens. E dentro dele, se for um novo arquivo e chamá-lo de componente de fundo k, simplesmente as redes criam uma classe. Mas componente terrestre. Isso estenderá o componente de sprite desta forma. Agora, nesse motor de jogo de culpa, um componente de sprite é um objeto gráfico que representa uma imagem ou animação 2D. Normalmente é usado para representar personagens, itens ou outros objetos no mundo do jogo. componente Sprite pode ser posicionado, girado e dimensionado e pode ser atualizado para diferentes quadros de uma animação. Aqui. Isso tem um método de carregamento próprio. Portanto, cada componente tem descarga, descarga e atualização. Todos esses métodos são pré-construídos. Vamos apenas escrever sprite, que é o valor desse componente de sprite. Aqui. Agora, basta entender, esse é apenas o componente e temos que adicionar esse componente em nossa classe de jogo principal. Então, definitivamente, precisamos ter alguma referência que possa ser feita usando um mixin chamado that is width, jogo como esse e o nome do jogo que é fistfight. A classe deles. Essa é a classe de jogo que tem referência de jogo e é usada para indicar que um objeto tem uma referência à classe de jogo atual. Ou seja, isso tem a referência à classe de jogo atual. Isso é útil porque muitos objetos do jogo precisam acessar variáveis globais. Qualquer variável que esteja aqui nesta classe, por exemplo, partituras ou qualquer coisa, manipulando a reprodução de áudio de entrada. Então, em outras palavras, podemos acessar as propriedades e métodos que estão nessa classe de jogo a partir dessa classe, tão simples quanto isso. E podemos acessar nosso material de envio ou carregamento usando esse ref do jogo, o ponto de referência do jogo de festa, load bright. Então, qual sprite queremos? Antecedentes globais de início. Sprite, esse. E qual deve ser o tamanho desse brilho? Deveria ser do tamanho desse jogo. Essa é a tela completa. Ok, agora, se eu salvá-lo, nada acontecerá. Ok? Espero que você entenda que essa carga é o ciclo de vida desse componente. Estamos usando o evento OnLoad para obter a mesma coisa que essa classe de jogo. Isso garantirá que tudo esteja pronto quando for chamado pela primeira vez. E o tamanho dos pontos do desenvolvedor do jogo ocupa a largura e a altura completas do dispositivo do usuário. Agora, para mostrar esse componente neles, nesse jogo, basta usar esse método de adição, que é usado para adicionar um novo objeto de jogo ao mundo do jogo. Portanto, o método add é útil para adicionar novos objetos de jogo, como jogador inimigo ou quando um novo nível é carregado. Por todas essas coisas. O anúncio é usado. Nós apenas temos que escrever um componente de fundo como este. Novamente, estou falando que isso se chama quando o jogo é carregado pela primeira vez e cria uma nova instância do componente em segundo plano. Agora vamos salvá-lo. Temos o jogo rígido adequado para o jogo deles É a deles esquema referência do esquema deles? Sim, é tudo o que eu vou dominar. E comece de novo. Acho que deveria ter atualizado a adição várias vezes. Vamos ver o que acontece se Fred, e novamente, vermos que temos aquela imagem de fundo. Então esse erro foi esse. Tivemos que remover, reiniciar ou, às vezes, parar e iniciar nosso aplicativo, pois não estávamos usando o carregamento Hartree. Da mesma forma que esse plano de fundo, vamos criar um componente de sprite para o nosso jogador também. Basta ir para a pasta de componentes, criar um novo arquivo de pontos. Componente da camada. Ponto, ponto. Sim, um componente semelhante à camada de luz estende o componente brilhante e tem um mixin que está aqui como referência do jogo. Como o jogo deles, assim. Caverna. Agora, temos que usar a descarga. Meu pai disse que seria uma descarga futura. Então. Da mesma forma, usaremos a propriedade sprite desse componente de propagação porque queremos que o sprite seja carregado. Esse sprite de carregamento e que é o nome da imagem, global start player. Lote global. Temos o jogador magro, esse. Então. Agora também existem outras propriedades de um componente de sprite. Essa é a posição desta imagem, certo, em jogo. Então, devemos colocá-lo, vamos colocá-lo no meio da tela. Ou seja, pegamos a tela completa e dividimos por duas. Vamos mostrá-lo no centro da tela, no eixo x e no eixo y. Agora, qual deve ser a altura? Vamos apenas mencionar a altura aqui em uma variável para que possamos mudar. Sempre que quisermos. Sprite, a altura será 100. Basta escrever, altura é igual a peso é igual a psi. Então, o aumentado, que deve ser a mesma âncora. Ancore onde e onde. Portanto, a âncora dos componentes de um sprite se refere ao ponto interno. Portanto, isso é usado assim como a origem ou o ponto central dos sprites. Ou seja, ele é usado como referência para particionar, girar e dimensionar o sprite. Por padrão, o ponto de ancoragem está localizado no canto superior esquerdo, mas agora o alteramos para o centro. Agora. Agora vamos salvar tudo. Da mesma forma, temos que adicionar isso em nosso componente de fundo também. Então, vamos adicionar um componente de camada como este. E lembre-se também de que os componentes são adicionados nessa sequência. Nós os mencionamos, ou seja, se escrevermos o plano de fundo abaixo do player , não poderemos ver esse componente do player na tela. Além disso, vou simplesmente mudar esse mundo global. Como o nome do arquivo é global, vou apenas alterá-lo para global e fazer as alterações. Por. Agora. Iniciamos o aplicativo e vemos que você pode ver o componente do player no meio da tela. E quando digo tamanho ou posição, é eixo x e eixo y. Espero que você tenha aprendido a criar seus primeiros componentes. No próximo vídeo, trabalharemos na adição de um joystick em nosso jogo. Obrigada. 5. Adicionando movimento com joystick: Oi, bem vindo de volta. Então, agora é hora de adicionar um pouco de movimento ao nosso componente de jogador. O plano nos oferece diferentes opções de entrada, como teclado , gestos, arrastar etc. Mas como pretendemos criar um jogo para celular, a maioria dos dispositivos móveis não tem teclado ou botões de hardware. Por esse motivo, criaremos um joystick virtual, qual chama? Isso pode ser feito usando o componente de joystick. Então, vamos criar uma nova pasta dentro da lib conhecida como inputs. Dentro dele, crie um arquivo. Joystick ponto, ponto. Agora, basta criar uma instância do componente Joy Stick. joystick é igual ao componente do joystick de k. O componente do joystick é composto por três elementos principais. Aquele botão, fundo e margem. Então, vamos então que o botão agora será um componente circular. Então o EDS aguardará 30. Vamos pintá-lo. Paleta básica, aquele ponto vermelho com alfa dois e tinta vermelha. Esse é o círculo interno que o usuário arrastará. Esse botão é aquele. Então temos o plano de fundo. Antecedentes. De novo. Eu tenho um componente circular. O raio será maior que 80. Pinte. Básico, paleta de pontos vermelhos. Vamos mudar algum tipo de opacidade, ou menos aquela tinta. Ok, agora, este é o círculo externo. Você entenderá quando estiver sendo renderizado. E então, finalmente, vamos ter essa margem. Consiste em inserções de borda. Inserções de borda que só eu preciso. Aqui. A esquerda será combatida. modem D será para T. Então é isso, esta é a posição do joystick. Posição do joystick. Então esse é o componente do joystick. Vamos salvar nosso arquivo. Vamos adicionar esse joystick em nosso jogo. Acesse o arquivo do caça F8 aqui. Clique abaixo do componente do player à direita. Joystick. É importado das entradas. E lembre-se também de que temos que usar essa mistura arrastável no arquivo principal do jogo, na classe principal do jogo, quando estamos usando qualquer tipo de escolha, os componentes, então, como essa largura arrastou isso porque, como você também a entende, estamos arrastando o botão aqui. Vamos sair e conferir novamente. Ok. Desculpe novamente, eu tenho que atualizar. Veja. Nós o temos agora. Eu simplesmente não gostei da cor do círculo externo. Vamos de novo. O círculo externo deve ser escrito à mão. Está muito bonito. Agora, vamos acrescentar que esse movimento foi para o nosso componente de jogador. Vá para o arquivo do componente da camada. Em primeiro lugar, teremos uma variável de componente do joystick. Ou seja, aceitaremos esse joystick aqui. Neste arquivo. É necessário um componente de camada, este tipo de joystick de pontos. Ok? Então, temos que enviar esse joystick aqui. Além disso. Vamos mencionar a velocidade com que o jogador se moverá. Serão 500. Agora, usaremos o método de atualização. Agora, a atualização é uma espécie de ciclo de jogo. Temos dois loops de jogo, principalmente atualização e renderização. Portanto, usaremos o método de atualização na maioria das vezes. A chama chama o método de atualização de um componente uma vez a cada quadro de marcação do loop de eventos para redesenhar cada componente do jogo que foi alterado. É semelhante às oscilações. Construa minha vez. Vamos adicionar lógica aqui nesta atualização, minha posição de diretor, o personagem ou o movimento dos personagens. O método de atualização usa um único parâmetro, que é esse tempo delta. Ou seja, esse d t é medido em segundos. Esse tempo delta é usado para garantir que os objetos do jogo se movam e se comportem de forma consistente em diferentes dispositivos e taxas de quadros. Por exemplo, se um jogador deve se mover a uma velocidade de cem pixels por segundo. E o tempo decorrido desde o último quadro foi de 0,02 s, o objeto deve se mover em dois pixels nesse quadro. Isso é 100 pixels por segundo multiplicado por 0,02 segundo. Neste jogo, os desenvolvedores podem criar jogos que pareçam suaves e responsivos em vários dispositivos. Agora, vamos adicioná-lo. Eu vou. Em primeiro lugar, vou apenas verificar se o joystick, essa direção é igual à direção, direção do joystick está inativo Isso é, nada está acontecendo, então simplesmente retornarei daqui. Se o usuário não estiver arrastando o botão. Difícil em outro lugar é simplesmente mudar a posição que esse ponto variável adiciona. Adicionaremos o delta relativo do joystick ao festival da primavera. Eu vou te mostrar o que acontece se eu não multiplicar o delta. Então, vamos mandar um bastão como esse. Vamos conferir nosso aplicativo. Agora. Se eu arrastá-lo para cima, veja, foi tão rápido. Mas se eu for para o componente player aqui, se eu multiplicar d T também , você verá que parece muito bom. O movimento. É uma sensação muito boa. Então, nosso movimento está acontecendo corretamente. É isso para este vídeo. Nos vemos na próxima sessão. 6. Vídeo 5 limites de tela para o jogador: Oi. Então, como você pode ver, nosso jogador está se movendo bem, mas se ele chegar perto do limite , ele o ultrapassa. Ou seja, ele atravessa a fronteira. Portanto, temos que criar algumas ou implementar alguma lógica para que o usuário não possa mover o limite da pasta do jogador. Isso é porque aqui ele tem que parar. Aqui, ele tem que parar assim. Portanto, temos que garantir que o jogador só consiga se mover dentro da tela do dispositivo. Componente preferido do player. Sim. Primeiro, vamos criar uma variável de limite para todos os quatro lados. Atrasado, duplo, vinculado à direita, atrasado, esquerdo, vinculado, descendente , vinculado. Agora, como são variáveis tardias, obviamente precisamos inicializá-las no onload. O limite direito será um jogo desse tamanho, NÃO x -60. Então, vou explicar esse valor. Portanto, esse é o limite certo. Ok? Então, primeiro de tudo, fizemos o jogo rho f dot size x, o eixo x. Deste lado. Pegamos todo o tamanho vertical ou horizontal aqui e depois -60 para que não fique desse lado. Ou seja, eu não quero que seja verde-azulado aqui. Se eu der apenas ao jogo ref dot size dot x, será Delia, então eu dou -60, então ele será interrompido aqui. Estamos subtraindo 60. Então, isso vai parar aqui. Então, essa era a lógica para o limite direito ou esquerdo. Serão simplesmente 60. Ou seja, se escrevermos zero, novamente o mesmo conceito. Vai até o fim. Mas eu estou apenas dando algum tipo de margem, você pode dizer, 60. O limite superior será o mesmo. 60. Como y começa, y começa com zero, estamos apenas adicionando zero mais 60. Aqui, já que a direção x começa com zero. E aqui estamos apenas subtraindo. Espero que você entenda o tamanho completo da tela -16. E a esquerda começa do zero para cima e depois temos isso para baixo. Ponto do tamanho do ponto vermelho do jogo. Por que isso foi até a direção vertical, até o fundo e depois subtraiu seis. Caverna. Agora temos as variáveis. No método de atualização. Vamos apenas verificar se os eixos x e y do Sprite estão fora dos limites de compra, então faremos com que os valores dos eixos x e y sejam constantes. Ou seja, é esse valor que é a borda do limite. Vou implementar e explicar novamente. Então, abaixo, aqui. E diremos que, se não for o ideal, não verifique os limites. Verifique se o eixo x do componente sprite é maior que igual ao limite de destaque e, em seguida, o eixo x do pacote direito, eles não agregam mais valor a esse local. Mais uma vez, eu gostaria de explicar. Isso significa que aqui o acesso do jogador ao eixo x é zero. Então ele começa a aumentar, aumentar, aumentar. Então é no limite direito que está aqui. Então, agora estamos apenas certificando de que o eixo x não aumente. Estamos apenas atribuindo o XX, limite direito de aludido é que esse valor está sendo atribuído a ele repetidamente. Da mesma forma. Vamos verificar se o eixo x é menor que igual ao limite esquerdo, então x é igual ao limite esquerdo. Agora, se o eixo y for maior que igual ao limite superior, então y é igual à ligação. E se y for maior que igual à ferida para baixo, então y é igual a K agora não vinculado . Não precisamos mudar nada aqui que seja reiniciado. Agora, se eu tentar ir em qualquer direção, veja que os limites estão funcionando perfeitamente. Agora. Aqui, como eu disse, se o eixo x for maior que a ligação reta, certifique-se de que o valor de x esteja limitado à direita. Ok? Agora vou apenas mudar a valência. Mostre qual é a diferença. Se eu pressionar da última vez que, se eu apenas escrever, por exemplo , se eu escrever, o que acontecerá se eu for diretamente escrever existe c, ok? Era muito valioso, ok? Se eu apenas escrever encadernado, acho que deveria ser apenas mais -60, deveria ser menos -60 a mais. Vamos ver. Se eu for C. Somos empurrados para -60 aqui. Isso é -60. Mas eu quero, não quero um -60. É por isso que eu só quero o eixo x até o fim. Essa é essa. É isso. O mesmo vale para qualquer outra direção. Espero que você tenha entendido o conceito. Se você criar apenas um ou dois aplicativos , você se acostumará com esses conceitos e tudo mais. Obrigada. Nos vemos no próximo vídeo. 7. Vídeo 6 Adicionando componente de Dumbbell: Oi. Agora vamos criar um novo componente de sprite para esses halteres. Dentro da pasta de componentes, crie um novo arquivo. Ponens componente, ponto, ponto. Ok, então, da mesma forma, adicionaremos o sobrenome. Como oponente, estende o componente do sprite. Ele terá o jogo OF mixin adequado para seu jogo. K. Numbers, certo? O tamanho será reproduzido. A altura é igual a 60. Vamos descarregar meu total. Novamente, isso é sprite. O valor será aguardado. Jogo ref dot load sprite, global dot dumbbell sprite. A altura será igual ao peso, que será igual a 60. Essa é a variável de altura do sprite. A partição será o vetor dois é apenas o eixo x e o eixo y. Vou apenas dar o valor de x em 200, 200. Vamos mudar isso mais tarde. E a âncora será o centro do ponto âncora. Salve isso. Agora vamos adicionar esse componente de halteres em nosso jogo. Vá para a tarifa de combate do FIT. Por. Em seguida, abaixo do componente da camada. Basta adicionar aqui como este componente de haltere, k. Vamos reiniciar o aplicativo e dar uma olhada. Veja, nós temos o haltere aqui. Obviamente, nada acontecerá se tocarmos no haltere agora. Mas pelo menos isso, nosso aplicativo de jogo parece um pouco bonito. As pessoas podem ver e dizer, ok, isso é algum tipo de jogo. Então é isso para este vídeo. No próximo vídeo, trabalharemos nessa detecção de colisão. Obrigado. 8. Vídeo 7 Adicionando HitBoxes a componentes: Oi. Então, agora é hora de trabalharmos a lógica de que sempre que o jogador se aproxima do haltere, deve haver alguma coisa acontecendo na tela, se devemos ser capazes de agarrar os dois e todos eles. Essas funcionalidades podem ser feitas usando o conceito de detecção de colisão. detecção de colisão é necessária na maioria dos jogos para detectar e agir sobre dois componentes que se cruzam , por exemplo, uma flecha batendo e qualquer outro jogador pegando uma moeda. Portanto, para detectar colisão em qualquer componente, deve haver uma caixa delimitadora precisa ao redor desse componente. E, tecnicamente, é conhecido como caixas de sucesso. Agora vamos implementá-lo. Portanto, o primeiro passo é habilitar a detecção de colisões em nossa classe de jogo principal. E nesta aula, podemos fazer isso adicionando uma chamada de mixagem. Tem detecção de colisão, simples assim. Portanto, garantirá que nosso jogo agora ouça qualquer colisão entre componentes. Agora, para garantir que nossos componentes possam colidir uns com os outros, precisamos adicionar a mixina conhecida como callbacks de colágeno. Essas coisas que você só precisa lembrar, é isso. Novamente, a mesma coisa neles. Retornos de chamada de colisão de componentes de camada. Agora, temos que adicionar caixas de calor a um componente. Esse sistema de detecção de colisão suporta três tipos diferentes de formas que você pode criar. Caixas de ódio de. Isso forma nosso polígono, retângulo e círculo. Várias caixas de ódio podem ser adicionadas a um componente para encontrar a área que pode ser usada para detectar colisões. Sem adicionar a caixa principal, esse componente não terá ideia de que pode colidir. Nossos interesses se cruzam uns com os outros. Agora, como nosso haltere é esse, a estrutura do nosso haltere é uma espécie de retângulo. Então, adicionaremos a caixa retangular ao nosso componente de halteres. Podemos simplesmente adicioná-lo assim. Quando a função onload, é muito semelhante a qualquer adição de qualquer outro componente. Vá para o componente do player e faça a mesma coisa. No OnLoad. Basta adicionar Tangle Head Box Lady. Ok, agora, se eu salvar e acessar nosso aplicativo, você não verá nenhuma diferença. Mas podemos, pelo menos nesse modo de depuração, usar um recurso fornecido pelo motor lemma. Ou seja, podemos ligar o de Beauvoir para verdadeiro. É uma ferramenta que permite aos desenvolvedores visualizar e depurar colisões entre objetos no mundo do jogo. Quando o modo de depuração está ativado, os objetos de colisão são destacados e exibidos de forma que os desenvolvedores possam ver onde estão e como interagirão uns com os outros. Basta ir para o haltere. E aqui, apenas o modo de depuração de gravação é igual a verdadeiro. E o mesmo vale para o jogador. Abaixo, aqui. O modo de depuração de apenas gravação é igual a verdadeiro. Agora, salve e reinicie. Agora você pode ver algum tipo de caixa retangular. Agora você pode pelo menos visualizar a caixa principal. Então, esta é a caixa principal. Obviamente. Novamente, agora nada vai acontecer. Temos que fazer mais algumas funcionalidades para garantir que a colisão esteja acontecendo. Mas pelo menos sabemos que implementamos a caixa principal. E veja aqui se eu for, o eixo x é dois nono, um, se eu for aqui, o eixo x é obviamente zero, mas você não pode vê-lo. O mesmo vale para o eixo y. Veja aqui. Além disso, como o modo de depuração que as caixas de sucesso têm um campo chamado colisão tipo C, assim, ponto do tipo , temos ativo, inativo e passivo. Passivo se refere a um tipo de objeto de colisão que não se move nem reage às colisões. Exemplo. Digamos que estamos criando um jogo em que a bola está quicando pela sala. As paredes da sala serão passivas do tipo colisão. Então, temos o tipo de colisão ativo como padrão para um tipo de objeto de colisão que pode se mover e reagir a colisões com outros objetos. Por exemplo, em um jogo em que controlamos uma nave espacial voando pelo espaço, há muitas balas que não podem colidir umas com as outras. Linha em direção à nave espacial. nave espacial será configurada para ponto ativo do tipo colisão, mas as balas serão configuradas para ponto passivo do tipo colisão. Então temos o inativo. Inativo, por outro lado, se refere a um tipo de objeto de colisão que não está ativo atualmente no mundo do jogo. Isso pode ser útil para otimizar o desempenho, pois objetos inativos não precisam ser verificados quanto à colisão até que se tornem ativos. Ajuste um YouTube. Eu só queria que você soubesse que esse conceito está disponível para que, em jogos futuros, se você ver algum tipo de colisão, ponto passivo e tudo mais, pelo menos você saiba que isso está conectado às colisões e caixas de sucesso. Obrigada. Isso é tudo para este vídeo. Nos vemos na próxima sessão. 9. Vídeo 8 Reagir em uma colisão: Portanto, agora a próxima etapa é ser notificado em caso de colisão entre dois componentes. O Flame faz isso verificando você em cada ciclo de atualização. Assim que atingir caixas, interagir ou cruzar, ele usará o método de colisão que devemos evitar. Essa sobrecarga é possível devido a essa colisão chamada de mixagem reversa. Abaixo da carga, logo na colisão aqui. Assim. Então, obtemos dois parâmetros sobre isso, no método de colisão. Uma delas é uma lista de pontos que se sobrepõem entre as caixas de sucesso, ou seja, pontos de interseção. E o outro é o componente no qual esse componente colidiu. Isso é haltere com ele, colida com ele aquele jogador. Agora, vamos simplesmente escrever a lógica. Se esse outro componente, outro é um componente transparente. Em seguida, basta remover esse componente que é o componente do haltere do pai que é desse jogo simplesmente fazê-lo desaparecer. Vamos tentar. Estou indo em direção ao haltere e vejo. Ele desapareceu. Então, dá uma sensação ou um efeito que o jogador pegou, aquele haltere, coletou esse número. Você pode dizer. Nossa detecção de colisão está funcionando perfeitamente. Podemos remover esse modo de depuração, pois não precisamos dele. Agora. Comece de novo e veja se eu for em direção a ela, ela desaparece. Então, isso está bonito. Agora vamos tocar um som quando os componentes do player colidirem com eles. Componente de halteres. O pacote de áudio flame, que já adicionamos em nossa dependência de projeto, é uma ferramenta projetada para tornar gerenciamento de áudio muito mais fácil e eficiente. Dessa forma, precisamos pré-carregar todos os nossos arquivos de áudio no método node de nossa classe de jogo que se adequará ao jogo Fighter. Aqui na classe do jogo, no método onload. Basta escrever áudio em chamas, áudio , dinheiro, carregar com pontos, toda a resolução. Significa simplesmente que carregaremos tudo na memória, a memória cache. Isso aceita uma lista ou uma matriz cujos nomes de som são globais, som de halteres de pontos. Globais. Temos o som do vírus. Depois, há o som global da vacina por pontos. E, finalmente, temos amantes do dot protein sound. Ok? Esse carregamento é recomendado porque se tentássemos reproduzir sons diretamente no jogo que não foram adicionados ao cache. Pronto, então, aí, então pode haver algum atraso na reprodução do som. Depois disso, toque o som. Isso está feito. Vamos tocar esse som no componente do haltere após a colisão. Aqui. Simplesmente escreveremos antes de você mover, chama direita do áudio que é reproduzido. E o nome que queremos tocar, o som do haltere. K. Vamos testá-lo. Se eu chegar perto dela. Sim. O som está funcionando corretamente? Espero que você tenha conseguido ouvir esse som. Isso também é feito. Obrigado por assistir ao vídeo. Espero que você esteja gostando de construir este jogo. Nos vemos na próxima sessão. 10. Vídeo 9 posições de haltere aleatórias: Oi, bem vindo de volta. Então, até agora, a posição do componente do haltere estava fixa. E depois que o jogador colide com ele, ele desaparece. Vamos modificar e permitir que halteres apareçam em posições aleatórias. Assim, quando o jogador pegar isso primeiro, removeremos o componente do haltere criaremos um novo haltere e colocaremos aleatoriamente na tela. E isso vai continuar até o fim do jogo. Oh, vá para o arquivo de pontos pontos do componente haltere. Em primeiro lugar, crie uma instância da classe aleatória. É isso que nos dá a biblioteca matemática que pode ser usada para gerar números aleatórios. Simplesmente aleatório assim. E veja, você tem esse fosco escuro importado. Vamos criar uma nova função que retornará um objeto vetorial dois, ou seja, valores x e y, e fará com que eles façam uma audição. Agora, primeiro, obteremos o valor de x, ou seja, x é igual ao inteiro aleatório próximo ao int. Ok? Agora, se você ver a descrição aqui, até mesmo entenda que temos um próximo intenso aleatório. Portanto, o valor é maior que igual a zero e menor que igual a dez. Então é assim que chegamos lá, número inteiro aleatório, ok? Vamos apenas obter esse número inteiro aleatório de X como ponto de referência do jogo, ponto x ponto, ponto, ponto, ponto para int, e torná-lo duplo. Ok? Então, isso significa que o eixo x pode ser de zero até o final do valor da tela, qualquer número inteiro aleatório para o x. Da mesma forma, para o y, temos um ponto aleatório. Em seguida, int, game Raf, raf dot, size dot y. Integral, pois não é inteiro, mas temos que mudar para dobro novamente. E então retornaremos um objeto vetorial dois com x e y. Então espero que você entenda que isso é apenas para obter um valor aleatório de x e y. É isso. A próxima coisa, camiseta, você pode me entender aqui também. O que isso faz? Agora temos que chamar essa função dentro do método onload do componente haltere aqui. Agora, quando estivermos atribuindo o valor, essa posição aqui, simplesmente escreveremos get random position. Ok? Além disso, após a colisão, removeremos o componente atual do haltere e, em seguida, adicionaremos novamente um componente aleatório de halteres ao jogo . SE esse número estará em uma posição aleatória por padrão, como já mencionamos essa lógica aqui no método onload. Agora, vamos salvar tudo e ver agora que o guarda-chuva está aqui. E se eu fizer isso de novo, atualize-o novamente, ele irá para lá. E se eu pegar, veja, está apenas gerando posições aleatórias. Agora, isso é divertido, eu diria. E, obviamente, faz. O som do haltere está tocando. Mas como estou gravando a tela, talvez você não consiga ouvi-la, mas tenho certeza de que você pode ouvi-la em seu próprio sistema. Espero que você tenha entendido o conceito de detecção de colisão. É isso para este vídeo. Nos vemos na próxima sessão. 11. Vídeo 10 Adicionando componentes de vírus: Oi, bem vindo de volta. Então, até agora, o jogo é muito simples. O jogador pode facilmente pegar os halteres sem enfrentar nenhum obstáculo. Precisamos adicionar algum tipo de desafio ao nosso jogo. Vamos adicionar dois vírus que o jogador deve evitar. Então, agora, dentro da pasta de componentes, crie um novo arquivo de dados. Componente do vírus, ponto aqui. Da mesma forma, como antes, o ótimo componente de vírus, componente X dense sprite tem referência de jogo. Jogo Fit Fighter. Temos a altura do sprite. É que vamos mencionar o sprite I-T até o fim. E tomaremos a posição inicial como argumento. É vetor para iniciar a partição. E entenderemos que foi construído, é necessário assim. Agora, o OnLoad é meu terceiro, sim. Aguarde. E eu acho que na camada está lá. Sim, e eu simplesmente esqueci o debate certo. Um voo será vermelho vivo, escuro e brilhante. Ponto azul y. Essa posição do sprite será a posição inicial que está sendo enviada para este componente. Então, o peso será igual à altura, que será exibida uma altura de 200. Vamos ver quanto é 200. E n é igual ao centro dos pontos âncora. Agora, basta adicionar esse componente de vírus recém-criado à classe do jogo. Basta adicionar componentes sem fio. Posição inicial agora, estou apenas codificando. Para valorizar. Temos que enviar e ler e 150. E, da mesma forma, acrescente o motivo pelo qual isso está aqui. X será o tamanho ponto x -50 e o tamanho ponto y -200. Você pode simplesmente brincar com esses valores e entender o que eles fazem. O k inteiro funciona, certo? A altura é demais. Vamos dar 100. Também é muito grande. vamos dar um D. T. Se eu der 60, obviamente. Sim. Os anos 60 parecem decentes. No2 e estava parecendo muito ruim. Sim. Também temos o vírus em nossa tela. No próximo vídeo, trabalharemos na movimentação desses componentes do vírus. Obrigada. 12. Vídeo 11 Adicionando movimento ao vírus: Oi. Podemos ver nossos dois vírus em seus cantos da tela, mas eles não estão se movendo para lugar nenhum. Então, agora vamos trabalhar para adicionar movimento a eles para que o jogador tenha que evitá-los e pegar os halteres. Vamos começar acessando o arquivo ponto ponto do componente do vírus aqui. E vamos criar algumas variáveis. Primeiro será ajustado à velocidade. Essa será a velocidade e a velocidade. Eles vão movê-lo, 300. Obviamente, vamos multiplicá-lo por D, D e L. Vamos criar uma função. Para que lado eles giraram um vetor para se mover. Certo? Agora, a primeira linha de código gerará um ângulo aleatório em radianos por nulo. Então, o ângulo é igual ao ponto aleatório da classe, próximo dobro em dois. Em Dubai. Então temos que escrever Kool-Aid. O seno e o seno cos do ângulo. O ângulo senoidal é igual ao sinal. E o ângulo do cos final do mangá é igual ao ângulo aleatório do cos. Agora, o valor final da velocidade em x é igual ao ângulo cos em relação à velocidade. Por outro. A velocidade dupla em y é igual ao ângulo senoidal nessas velocidades. E, finalmente, voltaremos a isso: bem, vamos ver d x, d x, bem, vamos ver DY. Salve isso. Então, qual é essa função? Para mover um sprite em um ângulo aleatório, primeiro precisamos gerar um ângulo aleatório. O ângulo é normalmente medido em radianos, que é uma unidade de medida usada em geometria para descrever ângulos. Um círculo completo é igual a dois pi radianos, o que é aproximadamente 6,28 rad. Então, para gerar o ângulo aleatório em radianos, podemos usar um número aleatório para gerar um número de 0 a 2 pi, assim. Ponto aleatório. próxima dupla é que minha tecnologia para a faculdade, ou seja, ela gera um valor aleatório entre 0,0 e 1,0 multiplicando o resultado de NextDouble por dois e Pi, estamos efetivamente gerando um ângulo aleatório de ingredientes de 0-2 pi. Uma vez que temos um ângulo aleatório, usamos a trigonometria para calcular a velocidade x e y a velocidade x for calculada como o cosseno do ângulo multiplicado pela velocidade. E a velocidade y é calculada no seno do ângulo multiplicado pela velocidade. Então, devo dizer que essa única cadeia i2 tem o Google e pesquisa no StackOverflow e tudo mais. Então você só precisa se lembrar dessa linha de código. E, obviamente, se você quiser, você também pode pesquisar isso. Agora, a próxima coisa que precisamos fazer é que a escrever que a velocidade é igual ao movimento do sprite. escrever que a velocidade é igual ao movimento do sprite. Então, obteremos a velocidade em que ângulo ele se moverá. E agora temos que criar um método de atualização. E em dívida, quando estiver em terceiro lugar, mudaremos a posição para a velocidade, velocidade multiplicada por d t. Então, como você sabe, multiplicando a variável de velocidade por d t, garantimos que o sprite mova EdTech a uma velocidade consistente, independentemente da taxa de quadros, por exemplo, se a taxa de quadros cair para 30 quadros por segundo, o parâmetro T será um pacote de bytes do segundo sprite, moveremos a velocidade para uma por 30 unidades neste quadro. Da mesma forma, se aumentarmos para 60, será em, ou seja velocidade multiplicada por um por 60 unidades. Isso apenas garante que o jogo se comporte de forma consistente em diferentes dispositivos e telas. Agora, vamos salvar tudo e reiniciar. E como você pode ver, os vírus estão se movendo. Então é isso. Para este vídeo. Nos próximos vídeos, trabalharemos para definir limites ao componente do vírus, bem como para as colisões. Obrigada. 13. Vídeo 12 limites para o componente de vírus: Oi. Como podemos ver, existem vírus que estão ultrapassando os limites. Vamos garantir que haja alguma detecção de colisão entre eles. Primeiro, adicione a caixa de aquecimento ao componente sem fio, bem como à classe do jogo. Então vá para o componente do vírus aqui. E aqui abaixo da velocidade acima, basta adicionar a caixa de sucesso do círculo. No arquivo do jogo fit Fighter. Aqui. Vou adicionar a caixa de seleção na tela. Ou seja, esse é novo. É qualquer colisão nos limites da janela de visualização. Inflamar. A caixa de ódio na tela é um objeto que representa os limites dessa área visível da tela. Ele é usado para determinar se nosso outro componente do jogo está dentro da área visível da tela e deve ser renderizado na tela. Agora salve-o. Agora, no componente do vírus. Nos componentes sem fio. No método de colisão. Primeiro, verificaremos se esse objeto colidido é uma caixa de aquecimento de tela ou não. Então, simplesmente vamos para o fundo. Em quatro, em colisão. Temos que adicionar retornos de chamada de lesão. E depois na colisão. Agora vamos verificar se essa é a caixa de acesso à tela. Aqui. Nós obteremos os pontos de interseção. Como você sabe, tem esse. Com a ajuda disso, verificaremos condicionalmente em qual direção a tela colidiu e, em seguida, alteraremos a velocidade oposta a essa. Aqui. Vamos fazer isso como se fosse outro vetor até o ponto de colisão. Vai fazer pontos de interseção, arquivos de pontos? Esse é o primeiro ponto de interseção. Isso é assim que colidiu com a tela. Verificaremos se o ponto de colisão x, o valor de x é igual a zero. Ou seja, na extrema esquerda. Em seguida, mudarei a velocidade do eixo X para a velocidade negativa do eixo x. E velocidade ponto y eixo. A mesma, que é a velocidade ponto y. Então, vou apenas mudar a direção do eixo x. Da mesma forma, se o ponto de lesão.xx for igual ao ponto do ponto de referência do jogo, ponto x, ele estará no lado direito. Então eu farei a mesma coisa. ponto de velocidade x é igual a menos a velocidade, o ponto x é apenas alterar o mesmo valor de velocidade. ponto de velocidade y. É igual ao ponto de velocidade y. Então vou verificar se ponto de coalizão y é igual a zero. O ponto de velocidade x será o mesmo. Mas o ponto de velocidade y seria negativo. Velocidade ponto y. E, finalmente, lembre-se de que esta está na parte superior da tela. Se o ponto de colisão ponto y é igual ao jogo de.size.y.xy e dois menos velocidade ponto y. Ok, vamos salvar tudo e conferir nosso aplicativo. Href é igual a zero. Vamos ver o que está acontecendo aqui. Então essa blusa está funcionando. Ok, este não está funcionando. Vamos ver. C estava funcionando bem. Esquerda, que está à direita, não está funcionando. É maior que igual a, vamos ver. Então eu estou mudando. Agora a velocidade K. Não, não será. Nesta seção. Primeiro ponto. Parece que não são os pontos de interseção da lesão que primeiro estão aqui. Ok. Então, modelo esquerdo e superior trabalhando do lado direito. E o padrão é que esse cálculo não está correto aqui. Conjunto de Dulles. Como eu disse no fundo. A parte inferior também está funcionando K. Como você pode ver. No fundo, eu diria que eles estão trabalhando nisso. O lado direito não está funcionando. Não deveria ser menor, porque, obviamente, vamos ver. Veja o ref do jogo, tamanho do ponto k. Um pequeno erro. Deve ser maior do que igual a isso. Vamos ver, -60 cc. No momento, está funcionando porque -60 é a vantagem. Como temos a cabeça do sprite aos 60. É por isso que. Então, esses cálculos são um pouco complexos. Não vou dizer muito, mas sim. Então, como você pode ver , está funcionando perfeitamente. Nossos vírus estão colidindo e se movendo por toda a tela. Obrigada. 14. Vídeo 13 Colisão entre vírus e jogador: Oi. Agora é hora de trabalharmos com base na funcionalidade. A gripe é o movimento do jogador. Como ele ficou com febre depois colidir com qualquer um dos dois componentes do vírus. Já temos o sprite da febre e o recurso sonoro do vírus. Agora, vamos criar algumas variáveis dentro desse componente do player. Aqui. Primeiro de tudo, vamos ver. Eles colocaram componentes brilhantes. Jogador, magro, feliz. Alguma nota? Vamos escrever para player skinny it primeiro. É brilhante. Febre de camada. Estou escrevendo para o jogador skinny and fever aqui porque vamos alterá-lo acordo com as colisões anteriores, estávamos apenas exibindo o sprite aqui diretamente. Agora, no método onload, escreverei que player skinny é igual a este. Aqui mesmo. A febre do jogador é igual à mesma coisa, mas só mudaremos o sprite. Ou seja, as febres de camada são brilhantes. E agora, no Sprite principal, ele ficará magro logo no início do jogo. Ok? Agora é hora de escrevermos uma lógica em que o jogador não será capaz se mover por 3 s. depois de colidir com o vírus. Também mudaremos essa imagem do sprite. Vamos criar novas variáveis de estado, bem como funções para congelar e descongelar o movimento do jogador. Então, aqui vou adicionar o arquivo FASTA quando o vírus booleano atacado for igual a falso. E eu vou usá-lo. Dímero. Dimer é igual a 3 s, então é como congelar por 3 s. Iniciaremos esse cronômetro quando o vírus e o jogador colidirem. Então, agora, vamos criar uma função, void, freeze player plus the fall. Vamos verificar se isso é verdade. isso é verdade. E escreveremos: não, vou postar a verificação do nível alfa. Se o vírus atacado for falso, então apenas congele porque se for verdadeiro, então já está congelado. Em primeiro lugar, reproduziremos o som global start virus sound. Reproduza o som na lesão. Em seguida, escreveremos que o ataque de vírus é igual a verdadeiro. Então, nós vamos fazer o que é certo para combater a febre. Mude a imagem do sprite. E, finalmente, iniciaremos o cronômetro C. Ok? E também criaremos uma função para descongelar a camada. Vamos simplesmente mudar que o ataque do vírus é igual a falso. E mude isso para player skinny novamente. Espero que você tenha entendido essas duas funções. Eles são muito básicos e diretos. Agora, no método de atualização, verificaremos condicionalmente se jogador está sendo atacado por um vírus ou não. Ou seja, se o valor booleano for falso, permita os movimentos do joystick. E se o valor for três, seja, se o valor for verdadeiro, atualize esse cronômetro e chame a função unfreeze player após 3 s. Então, aqui, em primeiro lugar, vamos apenas verificar se o ataque do vírus é falso. Se for falso, então só permita esses códigos. Ou seja, todo esse código. Basta recortar e colar aqui. Porque se for, se não for atacado por um vírus, então só são permitidos os movimentos. E à medida que atualizaremos esse dímero, ou seja, verificaremos esses segundos. E se o dímero estiver pronto, ou seja, 3 s passaram, então somente a função de frio e congelamento. Agora isso também é feito. Por fim, escreva isso no método de colisão desse componente do player. Já temos o retorno de chamada de colisão. Então, simplesmente aqui está o trenó em colisão. E vamos apenas escrever se é por isso que esse componente é simplesmente chamado de função de congelamento do player. Ok. Agora reinicie o aplicativo e veja o som. Está lá. Imagem do jogador, o sprite congela e não podemos nos mover por 3 s. E se pegar o haltere, então está funcionando. E, novamente, se bater, seus movimentos serão restritos. Está muito bonito. Espero que você tenha entendido o funcionamento do aplicativo e tenha gostado de construí-lo até agora. Obrigada. 15. Componente de texto Vídeo 14 para pontuação: Oi. Agora, as funcionalidades do nosso jogo estão funcionando perfeitamente, mas precisamos informar ao usuário quantos halteres ele pegou na forma de pontuação, bem como quanto tempo ainda falta para terminar o jogo. Não queremos que o jogo rode para sempre. Para isso, vamos ao principal, essa grande luta, sua principal classe de jogo. Temos que criar duas novas variáveis. O primeiro será a pontuação, que começará do zero, depois o dímero tardio, o dímero e depois o nt. Restante. O tempo é igual a 30. Ou seja, queremos que o jogo saia por 30 segundos. Agora vamos usar esse componente fiscal do Flame apenas para emitir a pontuação e o tempo para o usuário. O próximo componente, texto de dez centavos. Agora, no onload, mencionaremos primeiro esse modo temporizador. Faça com que se repita um pouco. Acabe com isso, em cada repetição. Em cada repetição, ele verificará. Se o tempo restante for igual a zero. Se for verdade, então pause o motor que está pausado, o motor do jogo, tudo ficará preso. Ou então, deduziremos ou diminuiremos o tempo restante que eles se distraíram durante 28, 27, assim. E quando o jogo começar, também iniciaremos esse cronômetro automaticamente no método onload na NCL. Então, no descarregamento, depois que tudo for editado, esse componente do vírus, todo o cronômetro iniciará. Agora, vamos criar um componente de texto para exibir a pontuação e posicioná-la no canto superior esquerdo. Para que esse componente de texto, esse texto seja audição de pontuação, onde eles devem ser colocados no eixo x superior para d, eixo y para t. âncora será um ponto ancorado. Esquerda. Decks renderizam, textualizam, pintam. Essas são as propriedades do componente de texto que você só precisa lembrar ou estilo de listagem, estilo dec. Vamos mudar essa cor. Cédula básica, cor de pontos pretos 25. Depois disso, adicionaremos o componente de texto da partitura à tela. Vamos, está começado. E como você pode ver, temos o componente de pontuação na tela. Obviamente, é zero e não aumentará agora. Temos que escrever um pouco mais de lógica nas funções de atualização, o que faremos no próximo vídeo. Obrigada. 16. Vídeo 15 Atualizando pontuação e tempo: Olá, vamos continuar e criar outro componente de texto para o tempo restante aqui. Da mesma forma, certo? O texto de hora é um componente de texto. X2 permanecerá morrendo. Segundos de lesão. Lá também. Acabamos de dizer dias de mesa verde menos quatro d. E para o DDT está no lado direito. A âncora será ancorada no canto superior direito. E então haverá texto, tinta, tinta e depois estilo de cabelo. Cor do estilo, cédula básica da mesma forma. Agora, cor preta. O tamanho da fonte será lido como quantificador. E depois disso, basta adicionar esse componente ao texto do nome da tela. Veja, o tempo também está aí, e eu vou colorir aqui. 30 segundos. Podemos ver a pontuação e o tempo restante dos textos na tela, mas os valores não estão sendo atualizados. Vamos trabalhar nisso. No jogo Fleet Fighter. Crie a função de atualização. Depois do OnLoad. Crie a função de atualização. Obviamente, ele funcionará mesma forma que qualquer outro componente. A primeira coisa que precisamos fazer é atualizar esse objeto temporizador. Em seguida, atualizaremos a pontuação, essa pontuação x ponto x é igual a, vamos apenas dizer pontuação. E como o valor da pontuação é atualizado automaticamente aqui, seja, nesse momento ou não, nesse momento em que obviamente faremos, precisamos fazer algo nesse componente de halteres para atualizá-lo? Decks to time, ou seja, tempo. Isso pode. E aqui está o texto em tempo real, o texto. Ok? Agora, no componente de halteres, quando o haltere colide com o player, acabamos de removê-lo. Mas agora, certifique-se de aumentar o valor da pontuação para que pontuação do ponto de referência deste jogo seja mais igual a um. E a variável de pontuação está localizada na classe principal do jogo que estamos acessando com o jogo , como de costume. Agora, vamos reiniciar e ver o segundo conjunto, 26, 25. E se eu pegar os números , está aumentando. Se você não consegue ouvir esse som, tudo bem porque eu tenho apenas uma deficiência. Mas em seu sistema, tenho cem por cento de certeza de que você é capaz de ouvir seu som. Então é isso para este módulo. Nos vemos no próximo vídeo. Obrigada. 17. Vídeo 16 Jogo sobre o menu: Oi, bem vindo de volta. Neste vídeo, trabalharemos em sobreposições e sobreposições e permitiremos que qualquer widget da Flórida seja exibido em cima de uma instância de jogo. Isso facilita muito a criação de coisas como pausas, heads-up displays ou uma tela de inventário. Portanto, esse gerenciamento é feito por meio da sobrecarga de pontos do jogo, que anúncio e o jogo sobrepõem os métodos de remoção de pontos. Então, vamos criar uma nova pasta, telas dentro da lib e criar um novo arquivo de dados. Game over menu dot dot. Essa tela funcionará como uma tela de sobreposição. Importar. Meu jogo TTL Glass sobre meu novo widget extends sem estado. Temos um método duplo. Aqui. A primeira coisa que farei é criar um ID que seja const. String ID é que eles vão fazer o Game Over Menu. Esse ID de sobreposição é um identificador exclusivo anexado a cada sobreposição nessa tela. É usado para identificar e manipular uma sobreposição específica, como adicioná-la ou removê-la da tela ou do jogo. A ideia de sobreposição geralmente é atribuída quando as sobreposições são criadas e a string do Canvas ou o valor inteiro. Em seguida, tomaremos a referência do jogo fit Fighter, game href como parâmetro para o construtor. Você acabou de dizer const. Menu Gameover. Super dot t exigiu esses árbitros de jogos de dardos. Agora, com o dobro do meu terceiro, vamos devolver o andaime. Todos esses são widgets da Flórida. Espero que você conheça esse corpo. Teremos um contêiner. Em seguida, a declaração terá a imagem da declaração. Terá a imagem da declaração. Em seguida, ele aceitará uma imagem. Esta será uma decoração de caixa, então eles encaixotaram a equação e aqui estará a imagem da declaração. Imagem. Temos a imagem de fundo, ativos, imagens de barra , bolas azuis, globos, fundo, sprite. E o ajuste será em caixa, capa de pontos. Essa será a declaração. E então aquela criança terá o recipiente no centro. Criança. Então, da coluna matriz é o alinhamento, o centro do ponto de alinhamento. Então, nessas crianças, a primeira coisa que vou ter é um widget de texto. E lembre-se de que isso não é um componente pois merecem widgets de vibração. Estilo de fim de jogo, estilo, tamanho da fonte 50. Outros textos serão pontuação, que será jogo, pontuação do ponto de referência do jogo. E aqui o estilo será consistente, têxtil em tamanho. Eles se foram. Então, daremos um tamanho de espaço, em caixa, altura 200. Em seguida, teremos dois botões, um para jogar, outro para permitir que o usuário jogue novamente ou para voltar ao menu principal. Como eu disse, é a caixa. Embrulharemos a caixa do tamanho do botão apenas para a largura e a altura. Largura 200, altura 50. Criança. Botão elevado. E pressione. Não fará nada por enquanto. E vamos usar uma camada de texto constante novamente. Estilo, estilo de texto, tamanho da fonte, unificação. Em seguida, tenha um tamanho considerável apenas para dar um pouco de espaçamento aqui, novamente, tamanho da altura da caixa durante D. E abaixo desse tamanho da caixa. Carregamos Vox desse tamanho. Vamos ter uma caixa de outro tamanho para o botão. Altura. 50. Botão elevado para crianças. Na imprensa. E, novamente, texto infantil. Menu principal, decks. Não existe um tamanho 25. Então, isso é tudo para o menu Game Over. Exibiremos essa saída, esse menu posteriormente. No próximo vídeo, trabalharemos na tela do menu principal. Obrigada. 18. Vídeo 17 tela de menu principal: Oi, bem vindo de volta. Por isso, criamos o menu Game Over. Agora, vamos criar outra tela e chamá-la de menu principal. O menu principal, ponto, ponto. Vamos começar com a importação de material. Será apátrida, rígido. Dê um nome ao menu principal. E o retorno é um andaime. Nesse corpo. Vamos pegar um contêiner. Vamos dar uma decoração de caixa. Da mesma forma, forneceremos uma imagem de fundo. Esta imagem de decoração de imagem. Simplesmente uma imagem definida. Ativos cortam imagens cortam globalmente. Aquele sprite de fundo. E uma caixa com tampa de pontos, ponto mosfet sobre k. Agora, filho do contêiner, vamos ter um centro. Então. Dê a ele o microfone principal da coluna. X é a matriz do elemento é m centro de pontos. Que as crianças que o tenham do que isso tenham um texto que seja o nome do jogo e também o botão de jogar. E lembre-se de que isso não é uma sobreposição, é diretamente uma tela. Ou seja, essa será a primeira tela o usuário abrirá o aplicativo e verá brotar constantemente. Esse é apenas o estilo. Você pode fazer o que quiser. Tudo depende de você. Inserções de borda, simétricas, verticais 50. Então criança com o estilo têxtil. Tamanho único 50. Ok? E depois desse widget de preenchimento, vamos ter uma caixa de tamanho. Eles fornecem algum espaçamento. Como eu já sei que você é. É por isso que eu posso escrever diretamente esse preenchimento e aprimorar tudo. Obviamente, quando você está tentando criar algo do zero, você precisa testar os widgets da interface do usuário Alda e tudo mais. Eu tenho cem. Então, isso será, isso é apenas um botão. Eu prefiro o botão elevado para crianças. Na imprensa. Não vamos fazer nada agora. E nessa criança, temos uma const. O texto para x é simplesmente jogar e estilizar, estilo dec no tamanho 25. Então, isso também vale para o menu principal. No próximo vídeo, criaremos a tela de jogo e conectaremos todas as telas. Obrigada. 19. Tela de jogo de vídeo 18 jogo: Oi, bem vindo de volta. Então, em vez de chamar o widget do jogo diretamente nesse arquivo principal de pontos, criaremos um novo arquivo dentro das telas e o nomearemos. Jogabilidade: ponto, ponto ou material. Do que é menos rígido. Limite de ajuste. O jogo deles. Agora, não vamos chamá-lo de adequado para diarreia. Vamos chamá-lo apenas de jogabilidade. Ok, vamos chamar isso de jogabilidade. Em seguida, ele transformará um widget de jogo, como este widget de jogo. E, obviamente, temos que enviar uma instância de um jogo. Inicializaremos o jogo Street Fighter aqui. Eu nunca luto em um jogo mortal. Para um jogo como esse. E nós o enviaremos aqui. Não estamos inicializando isso diretamente aqui porque se salvarmos ou algo acontecer ou se esses métodos de cobrança forem chamados, perderemos todos os dados porque isso criará novamente uma nova instância do jogo Fruit Fighter. Ok? E agora vamos trabalhar ou usar a propriedade do jogo. Fizemos isso, esse mapa de construção sobreposto. Aqui, basta atribuir sobreposição, ID, tela, fatura, contextos, contexto, jogo, referência do jogo. E esse é o menu Game Over. Em nosso aplicativo, a única tela de sobreposição é a tela, então estamos apenas atribuindo o id. É verde. É isso que temos que mostrar quando essa ideia está sendo chamada. Agora nós fizemos isso. Vamos para o arquivo principal de pontos. E aqui no aplicativo. Em primeiro lugar, removerei esse aplicativo de material de inicialização . Eles movem o banner e a página inicial é a primeira tela que será o menu principal. E agora vá para o menu principal. Aqui. Quando o usuário clica no botão Jogar, deve navegar até a tela do jogo. É um navegador de contexto. O substituto por pressão. Vamos jogar o jogo. Como você sabe, jogabilidade. Vamos ver, jogue isso, esse jogo. O jogo vai começar. Agora vamos reiniciar nosso aplicativo. Como você pode ver, o verde é a tela de introdução do jogo, esse é o nome. Esse logotipo já está lá, já está lá em segundo plano. E temos o botão play. Se clicarmos em jogar C, agora podemos jogar. Ok. Vou apenas pausar o motor do jogo. Agora temos que usar o esquema de sobreposição, ou seja, jogo sobre tela. Temos que ligar depois desse cronômetro ou o jogo termina. Então vá para o jogo de luta de peso aqui. E aqui. Quando estamos, quando estamos cortando, o mecanismo de pausa simplesmente se sobrepõe ao ponto de adição. E temos que dar ao jogo de ID um ID no menu um ID de ponto como este. E isso mostrará a ele o Game Over Menu. Além disso, vamos criar uma função na parte inferior para reiniciar o jogo. Ou seja, se o usuário quiser jogar novamente, vamos começar. Vamos apenas atribuir essa pontuação a zero e o tempo restante é igual a 30 s. Finalmente, vá para o menu GameOver e permita que o usuário jogue novamente, bem como vá para a tela do menu principal. Aqui. Quando o usuário clica no Play novamente. Na primeira parada, moveremos a sobreposição. É um jogo, nosso menu é esse id. Em seguida, chamaremos a função de reset, que acabamos de mencionar que foi criada. E depois disso, retomaremos o motor. É isso. Essas são as três etapas. E se o usuário quiser voltar ao menu principal? Em primeiro lugar, removeremos novamente o ID sobreposto do GameOver desta forma. Então temos que ligar para o set. Em seguida, retomaremos o jogo. Mas depois disso, simplesmente usaremos o substituto de pus push e enviaremos um menu principal para o usuário. Assim. Espero que você possa ver o código. Esse é o código. Quando o usuário quiser ir ao menu principal. Vamos reiniciar e verificar todas as funcionalidades. Se eu clicar em jogar. E vamos ver depois de 30 s. Então, o que acontece? Esta final, eu direi. Agora, veja, temos o menu Game Over. Podemos ver essa pontuação. E se simplesmente clicarmos em jogar novamente, a pontuação será zero. E nós temos esse dímero. Novamente, começar com isso é de Tatu. E agora, novamente, o que acontece se você clicar no Menu Principal e sermos enviados de volta para a tela do menu principal. É isso. É isso mesmo para esse jogo. Sobreposições. Nos vemos no próximo vídeo. 20. Vídeo 19 Alterar o Sprite do jogador com estado: Então, até agora, quando o jogador o agarra, aumentamos essa pontuação. Mas por que não torná-lo interessante? Vamos mudar a imagem do sprite também. Quanto mais ele marca, mais musculoso ele se torna. Como todo mundo conhece cintos de levantamento de peso, músculos. Então, vamos tentar implementar isso. Arquivo de componentes do player Go-to. Vamos criar duas novas variáveis de estado para outros sprites. Por camada. Peso. Late sprite, blair, muscular, k. Vamos carregar a imagem do sprite nessas variáveis. Tenha o carregamento aqui. Basta copiar e colar duas vezes. O peso será o jogador se ajusta de forma brilhante e clara, musculosa do Live Player muscular sprite k. Agora, em vez de chamar sprites aqui, diretamente, isso aqui. E também na função de congelamento. Aqui estamos mudando a imagem do sprite. Vamos criar a função que renderiza condicionalmente o sprite. O que quero dizer é que, em k, vamos criar aqui um sprite para jogadores amplos. Primeiro verificaremos se foi atacado por um vírus. Então, o sprite será a febre do jogador. Em seguida, verificaremos se a pontuação do ponto de referência do jogo é maior cinco e menor que igual a dez, é de 5 a 10. A dança mudou para jogador por causa disso. Ok? Da mesma forma, Jack else-se o ponto de referência do jogo for maior que dez, então mude o sprite para jogador musculoso. Ou então, finalmente, assine o sprite inicial, a capa da tela faz sprite. Agora que mencionamos essa função, vamos chamá-la para renderizar os sprites em todos os lugares. Primeiro, vá para o método onload. Aqui. Em vez de chamar sprayed assim, basta chamar a função. Em seguida, vá para atualizar. Vamos nos certificar de que estamos chamando a função aqui. Ou seja, se não for atacado por um vírus, ele verificará essa pontuação e essa função será chamada repetidamente. Então vá descongelar aqui. Vamos chamar isso de função. Então, depois que o ataque do vírus for falso, novamente, o sprite mudará. Da mesma forma, vá congelar. Aqui. Vamos mudar a imagem do sprite desta forma. E também por que não diminuir essa pontuação quando atacado pelo vírus, o que significa que ele perderá os músculos após pegar castor ou resfriado por causa desse vírus. Como a pontuação diminuirá, o sprite também ficará muito magro. No final. Quem vamos verificar se o ponto de referência do jogo está marcado. Se for maior que zero, apenas diminuído, passará para negativo. Assim. Tão simples quanto isso. Ok, vamos atualizar. Ou você pode definir um começo. E vamos verificar o que acontece. Ok, veja, o placar caiu. Mas agora eu tenho seis anos, então minha imagem de sprite muda para caber. E, obviamente, vejo que, como você pode ver, a imagem do sprite foi alterada e também foi alterada novamente. E, finalmente, o jogo acabou. Mas agora você verá o que acontecerá se eu jogar novamente. Na maioria das vezes. Eu vou te mostrar o que quero dizer. Peso. Vá para o FIT, lute contra isso de novo. Vou remover o vírus ou alguns. Vamos ver. Vou te mostrar eles têm aquele sprite musculoso agora. Nossa, se não houver endereço , podemos marcar muito. Mas agora, o que acontece se eu clicar em Limpar novamente, ver se repetimos ou acessarmos o Menu Principal , a imagem do sprite não será alterada para o padrão. É o magro. Logo no começo. Como quando a função de atualização anterior do Gaming Genie parou de funcionar para todos os componentes. Para corrigir esse problema, vamos criar uma variável de estado para o componente Player. Notas. Acesse nosso código. Vá para fit por delta. Aqui. Vamos componente de camada de grade, componente de jogador, ok? Em seguida, carregue. Primeiramente, inicializaremos o componente player assim e depois o adicionaremos para que possamos alterar esse componente de camada diretamente, pois é uma variável de estado que não está dentro da função. Ok. Vamos mudar essa imagem do sprite para o padrão na função de reinicialização. Aqui. Vamos redefinir os pontos do componente do jogador sprite é igual a aguardar cargas brilhantes. Vamos fazer disso uma pia. Globais. Sprite magro. A série principal começou. E vamos conferir esse jogo novamente. Digamos 4/32. Apenas tenha paciência comigo. Vou criar uma pontuação alta como essa. Ok, agora, vamos esperar o cronômetro terminar. Agora, desta vez, se eu clicar em Reproduzir novamente, vejo que a imagem está novamente redefinida para capa. Então, espero que você tenha entendido os conceitos, por que estou fazendo isso, por que estou fazendo aquilo. E, novamente, vou descomentar o componente do vírus. Então é isso para este vídeo. Nos vemos na próxima sessão. 21. Vídeo 20 Criar um componente de vacina: Olá, vamos tornar o jogo mais interessante. Adicionaremos um componente da vacina em intervalos aleatórios e o usuário do fornecedor o pegará. Ele ficará imune ao vírus por alguns segundos. Isso parece muito interessante, certo? Vamos implementá-lo. Componentes internos. Crie um novo arquivo. Componente da vacina, ponto, ponto, copie e cole o código completo do componente do vírus. Então, vamos copiar tudo. Cole aqui. Vamos ver. Vamos mudá-lo para o componente da vacina. Componente da pele. Temos a velocidade do vetor na mudança de OnLoad, portanto, brilhante para o sprite das vacinas. Posição, posição inicial. Peso é igual à altura, ok? E isso é tudo para ancorar o centro. Ok? Tudo está bem. Esse código é muito semelhante a dividir basicamente esse componente, alteraremos apenas a imagem do sprite e classificação da peça de detecção de colisão é a mesma. Ok, nós temos o spray Move, isso também é o mesmo. Vamos para a colisão. Aqui. Abaixo do ódio verde, basta verificar se há um componente de camada. Em seguida, remova isso do pai, apenas removerá esse componente da vacina. Ok, guarde isso. Agora, vamos trabalhar na colisão entre o jogador e uma vacina. Componente preferido do player. Temos que fazer mudanças aqui também para que a vacina funcione. Primeiro, vamos criar uma variável de estado. Esse booleano é vacinado, é igual a falso. Então, aqui vamos apenas verificar se o jogador está vacinado, o que significa estar imune ao porquê disso. Não temos nada sobre colisão e isso é. Sim. Se houver vírus, diremos que se ele não for vacinado, só o libertaremos. Adultos não congelam o jogador porque ele está, ele já tomou a vacina. E também escreveremos que, se houver um componente da vacina, criaremos uma função injetar cera. Vamos criar funções para vacinas. No final, escreverei amplamente e criarei essa vacina injetável. Além dos quatro níveis. Verifique. Ou seja, basta escrever o comentário primeiro. Não execute se y, isso é se a lâmina for levantada pelo vírus, é se não for atacada. Não é por isso que esse ataque, então James é vacinado, é igual ao Drew. E reproduza o áudio. A vacina global soa 0, K. E outra função remove x para dentro. Vamos apenas mudar, se vacinado é igual a falso aqui. Nada demais. Então, sim, fizemos muitas mudanças. Então é isso para este vídeo. Vamos continuar fazendo as mudanças mais necessárias no próximo vídeo. Obrigado. 22. Vídeo 21 Adicionar vacina em intervalos aleatórios: Vamos continuar e fazer as mudanças necessárias na classe do jogo para que o componente da vacina funcione. Vamos ao jogo Fit Fighter. Temos que criar novas variáveis de estado. Em primeiro lugar, inicializarei o componente da vacina. Está tudo bem. Componente da vacina, componente z. Acabamos de mencionar a posição inicial. Vou apenas escrever o vetor dois, eixo x para enriquecer o eixo y 200. Então vou escrever em imunidade vacinal, dy é igual a quatro. Isso significa que a vacina dará imunidade, ou você pode dizer que trabalharemos esse jogador em licença por 4 s. Depois disso, ele será afetado pelo vírus do que pelo dímero tardio da vacina. Portanto, esse é o objeto temporizador da vacina. Vamos verificar se o segundo acabou ou não. E então teremos a hora da vacina. Os pais tornarão isso mais interessante porque daremos um tempo aleatório para a vacina ao FPS. Portanto, nem nós sabemos quando a vacina aparecerá no jogo. E toda vez que aparece em um horário diferente e diferente, você pode dizer porque esse jogador está fora de festas em segundos. Agora. Vamos para o onload. Aqui. No carregamento, vamos apenas escrever a vacina. O tempo de aparição é igual ao ponto aleatório próximo ao int. E escreveremos o tempo restante -20 mais 20. Dessa forma, a hora da primeira vacina aparecerá. Veja aqui, como você pode ver, próximo aleatório fornece um número inteiro aleatório. Se escrevermos diretamente o valor aqui que é dez , ele fornecerá um valor maior que, igual a zero e menor que dez. Mas como o jogo é de 30 s, quero que a primeira apareça a qualquer momento entre 20/32 para que ainda tenhamos tempo para que outra vacina apareça. Suponha que aqui a vacina, se a vacina for escolhida aleatoriamente por 5 s, então, em todo o jogo, apenas uma vacina aparecerá. Essa é minha própria escolha. Depende de você. E veja aqui o que acontece. Se eu fizer algo como o próximo na centena mais 50, valor será maior que 50, já que eu também adicionei 20. Portanto, o valor será maior que 20, e aqui será menor que 150, a adição de ambos. Então, suponha que o tempo restante seja marcado como t menos 2010 mais 2030. Então, eu simplesmente, esse cálculo significa que deve ser maior que 20 e menor que 30. Agora, depois disso, temos que fazer alterações no objeto temporizador anterior. Aqui, esse objeto temporizador. E verifique se o tempo restante do jogo é igual ao tipo de aparência aleatória da vacina. Se sim, adicione o componente da vacina. Então, o que vou fazer é primeiro verificar se o tempo restante é igual a zero. Faça uma pausa em Qian, ok? Bem, vou simplesmente apagá-lo. Aqui vou verificar se o tempo restante é igual ao dos pais do dímero da vacina. Em seguida, adicione o componente da vacina. E nós temos o componente da vacina e esse tampo assim. Ok? Então, suponha que a mania, aquela época da vacina contra o vírus, seja, essa era para Indy, suponho. Então, quando esse cronômetro marcar 302-920-8206, quando chegar a 25, adicionaremos o componente da vacina a esse jogo. Além disso, vamos criar um novo objeto temporizador para a vacina. Aqui. Abaixo desse cronômetro. Vamos escrever que o cronômetro da vacina é igual a um. Repita em ****. Deveria ser verdade. Em cada carrapato, verificará se o tempo de imunidade da vacina é igual a zero. Ou seja, a vacina acabou. Caso contrário, diminua o tempo de imunidade da vacina em um, o sabor pelos três segundos, dois segundos, segundo 1 s. E se acabar, em primeiro lugar, escreverei o componente player que remove a função da escreverei o componente player vacina. Ou seja, espero que você se lembre. C, vamos mudar cada vacina que é igual a falsa. Ok? Depois disso, escreverei novamente tempo de imunidade da vacina é igual a quatro novamente. Em seguida, adicionarei a vacina. aparência, a vinculação do tempo de teste da vacina e os pais são zero. Isso é feito para a verificação condicional. Faremos mais tarde para mostrar novamente a vacina. Aqui. Mais uma vez disse imunidade, hora de remover. Função da vacina na classe de jogadores. Ok. Então eu só quero que esse cronômetro, o cronômetro da vacina pare. Ou seja, eu não quero que isso dure de novo e de novo para sempre. Ok. Agora, finalmente, no método de atualização, verifique se o jogador está vacinado e se o VS continue executando esse objeto temporizador. E se o tempo de vacinação, o valor dos pais for zero, isso significa que o efeito da imunidade acabou. Isso, novamente, cria um horário aleatório para a vacina para um par nesse jogo. Você entenderá, espere, vamos para a função de atualização. Verificará se o componente está vacinado. Em seguida, apenas atualizaremos o cronômetro da vacina. Essa semana. Digamos que então ele terá funções Enda. Caso contrário, se a vacina tiver uma aparência igual a zero. Em seguida, verificaremos se o tempo restante do jogo é maior que 3 s. pelo menos. Então, novamente ADA. Então, novamente, adicione a vacina ao jogo que é aleatório. Ponto próximo ao int. Tempo restante -3 s mais três. Essa nova vacina. Pais. Aluga o tempo. Ok? Então, aqui acabamos de ler pelo menos o tempo em que o jogo deve ser maior que 3 s. Pelo menos. Aqui eu espero que você entenda novamente. Então, maior que 3 s e o que quer que seja o tempo restante neste segundo ou qualquer outra coisa. Ele receberá novamente um número aleatório. E por causa disso, ainda temos esse cronômetro e ele verificará se tempo restante é igual ao tempo da vacina e será novamente no componente da vacina. Portanto, o loop continuará indefinidamente até o fim do jogo. E nesse método de redefinição, estamos fornecendo a camada de pontuação. Temos o tempo restante. Vamos escrever req seen. O tempo de imunidade é igual a quatro. E removeremos o componente da vacina daqui. Conheço muito código, mas você precisa entender o conceito. Finalmente, o componente principal da vacina injetável. Vou verificar se não está tudo bem. Depois de jogar, basta escrever game ref, dot vaccine timer, dot start. Espero que você tenha visto isso. Aqui. Escrevemos o cronômetro da vacina, mas não vamos chamá-lo aqui. Ou seja, não estamos iniciando o cronômetro da vacina. Só começaremos se componente da camada superior colidir com o componente da vacina. Digamos: Bem, tudo bem, vamos fazer isso de novo. Vamos ver, estamos comprando qualquer editor ou o jogo está funcionando. Vamos manter nossos dedos cruzados. Vamos jogar. Veja, nós temos esse componente da vacina, mas desde que fui atacado pelo vírus, não funcionou. Mas vamos esperar. Acho que haverá outra vez em que o componente da vacina aparecerá. Se eles estiverem emparelhados novamente. Vamos jogar novamente. Veja. Agora eu tenho o componente da vacina e nada está acontecendo comigo. Mas depois de 4 s, novamente, estou sendo atacado. Então isso significa que somos pelo menos o componente da vacina. Está funcionando perfeitamente. Vamos ver. A vacina apareceu novamente ou não? Parece que não está necessariamente bem. Veja, finalmente, essa funcionalidade está funcionando perfeitamente. Espero que você tenha gostado e entendido esse conceito. Caso contrário, tente verificar esses códigos novamente antes de passar para outra seção. Obrigada. 23. Vídeo 22 Trabalho em componente de proteína: Oi, bem vindo de volta. Portanto, a última reviravolta que adicionaremos ao jogo é um componente proteico. Como a construção muscular e a ingestão de proteínas andam de mãos dadas. Basicamente, aqui, um suplemento de proteína aparecerá aleatoriamente por apenas uma vez por jogo. E se o jogador fizer um gráfico antes que ele desapareça, ele receberá um incremento aleatório do código de bônus que pode ser de qualquer valor de 0 a 8. Isso criará curiosidade. Então, vamos fazer isso. Vamos criar um novo arquivo dentro dos componentes, ou seja, o componente proteico dot care. Copie e cole o código completo da vacina. Aqui. Basta copiar tudo e colar. Obviamente, vamos mudar para Proteína. Vamos pegar um n, k. E no OnLoad, teremos proteínas dub brilhantes aqui e acabaremos em colisão. Vamos simplesmente escrever se outro é um componente do Player, suponha. Então, obviamente, removeremos esse componente ou objeto da tela, mas também aumentaremos a pontuação. Então, para obter a pontuação aleatória, já implementamos isso muitas vezes. E minha pontuação bônus é que faremos uma classe aleatória, um ponto próximo a nove. Então aqui, 0-8. Como nove é excluído, 0-8, ele pode gerar qualquer bônus aleatório. E nós simplesmente incrementaremos as chamadas Game ref, dot score, plastic coil, random bonus. Então, imagine que o usuário não saiba que ele pode ter um azarado núcleo de zeros, dependendo de sua sorte. Agora temos que fazer as mudanças necessárias na classe do jogo novamente. Então, vamos ao jogo Fit Fighter. Aqui. Vamos criar novas variáveis de estado para proteína. Então, aqui, assim como o componente proteico. Em primeiro lugar, vamos inicializá-lo. O componente proteico é igual a e vamos dar a posição inicial. Da mesma forma que 200.400 K. E se você quiser, você também pode gerar posições iniciais aleatórias, mas você sabe como implementá-las. Depende de você. Vamos escrever Proteína. Proteína. Hora. A esquerda é igual a quatro, o que significa que a proteína desaparecerá automaticamente automaticamente após 4 s. Então, aqui, o usuário tem que pegá-la em 4 s. Nós também teremos um dímero de proteína. Hoje. Reitor. Dímero. Então, vamos ter um dia. Meus pais, essa será hora aleatória para a proteína ser. Ok. E, finalmente, diremos apenas bônus de proteína. Vamos ver. Qual é o bônus de proteína para que possamos manter esse controle, acompanhar qualquer bônus que possamos exibi-lo ao usuário posteriormente. Então, qual é o valor exato do bônus que ele recebeu? Então, aqui abaixo da hora da vacina, meus pais, vamos escrever que os pais do dímero de proteína são iguais a um ponto aleatório próximo a int, tempo restante menos cinco mais cinco. O que significa simplesmente que o tempo deve ser maior que 5 s e menor que 30 s. Ok? Da mesma forma, isso acontece. Vamos fazer com que tudo fique bem. Horário rotineiro dos meus pais aqui. Da mesma forma que antes, faremos alterações no cronômetro do jogo. Objeto a ser verificado. Se o tempo restante do jogo for igual ao tempo de aparecimento aleatório da proteína. Se VS, adicione o componente proteico na tela. Então, vamos aqui. Primeiro. Estamos verificando se o tempo restante é igual ao da vacina. E aqui, novamente, verificaremos se o tempo restante é igual ao tempo de aparição rotineira. Em seguida, adicione o componente proteico e também iniciaremos esse dímero de proteína. Ok? Agora, vamos criar o cronômetro de proteína. Tudo isso funciona da mesma forma que criamos o dímero da vacina anteriormente. Uma repetição é igual a verdadeira. Um carrapato. Verificaremos se o centavo de proteína restante é igual a zero, esse tempo acabou e, em seguida, simplesmente removeremos o componente proteico. Mas o próximo jogo acabou de dizer que colocar tempo restante é igual a falso, r é igual a quatro. Não devemos torná-la definitiva. E vamos parar o cronômetro de proteína. Se for zero. Caso contrário, simplesmente diminuísse isso, imaginei que esses 4321, assim, **** saíram menos 10 k. Então implementamos a adição desse componente proteico. Inicie o cronômetro no dímero. Vamos atualizar esse dímero se componente proteico for adicionado ao jogo. Aqui. Vamos apenas escrever se o componente proteico está carregado, ou seja, está no jogo. Em seguida, o temporizador de proteína atualiza o DT. Ok, e então temos que fazer algumas mudanças. Agora está pronto. Como realmente dissemos que falta tempo de proteína, remova o componente e também atribua um tempo aleatório para o próximo jogo. Se o jogador jogou, novamente. Simplesmente, o VS Code é igual a esse componente aberto, o componente da vacina. Isso é aqui, como Dean, tempo restante para o componente proteico removido do pai. Rotina. Diamond Princess é igual a aleatório. Em seguida, o tempo restante menos cinco mais cinco. Espero que você entenda que estamos redefinindo a hora novamente , porque se o usuário jogar novamente, o método onload não será chamado. Essa é a razão. Agora, depois disso, digamos que quando vamos ao componente proteico, tenhamos que apelidar dub protein timer. Se a proteína colidir com o componente do player, reproduza o som e também atualize esse valor de bônus nessa variável de bônus de proteína. Aqui. Se for, então reproduziremos áudio, reproduziremos globais, as proteínas soarão. Então, simplesmente interromperemos o cronômetro de proteína. E como estamos, já que a proteína aparecerá apenas uma vez, é por isso que não há problema de parar e iniciar o cronômetro repetidamente. E diremos apenas que o jogo OF desse bônus de proteína trará uma pontuação de bônus aleatória. E exibiremos esse valor de bônus nesse menu de fim de jogo. Então, vamos começar o jogo com minha nova abaixo dessa pontuação. Abaixo dessa pontuação. Digamos que seja um texto. Dentro desse convés. Na biossíntese, emule o bônus de proteína. Então jogo OF protein bonus. Dê alguma forma, diz const. Têxtil no tamanho 20. Faça-o pequeno. Vamos guardar tudo e ver se a proteína está lá ou não. E só para simplificar, removerei as vacinas contra vírus ou um vírus para facilitar o teste. O jogo. Nós temos aqui está aqui. Está verificado. Eu vou jogar, digamos que obviamente King. Mas eu tomei delta x em C. O componente proteico está lá. E se eu aceitar, eu tenho uma pontuação muito boa, eu acho. E isso podemos verificar. No jogo over c, recebo oito bônus de proteína. Se eu jogar novamente. Vamos ver isso. Obviamente, se eu tomar a vacina, também não veremos nada. Agora eu acho que o bônus de proteína foi zero, eu acredito. Então, devo dizer que é muito divertido. Veja, o bônus de proteína foi zero desta vez. Então, tudo depende da sorte dele. Eu vou jogar novamente. E desta vez, se eu não tomar a vacina, vamos ver o que vai acontecer. Vamos apenas esperar que a vacina apareça. Ok, por engano, tomei a vacina. Vacina, desculpe, proteína. Então, a proteína era porque eu acredito que isso é suficiente. Tudo está funcionando muito bem. Estou satisfeito com o jogo. Então, isso é tudo sobre esse jogo. No próximo vídeo, simplesmente trabalharemos na tela inicial apenas para deixá-la bonita. Obrigada. 24. Vídeo 23 Adicionar uma tela de respingo: Oi, bem vindo de volta. Nosso jogo está concluído. Vamos adicionar algumas coisas extras, como uma tela inicial. Esse jogo ficará lindo e profissional com esses pequenos complementos. Vá para bob dot dev e digite a tela inicial animada. Aqui temos esse. Sim. Copie a dependência e adicione-a ao arquivo YAML Pub spec dot. De qualquer forma, esse inversor de pacote de tela inicial é uma solução pré-construída que fornece uma tela inicial animada personalizável para nossa tela. Até agora, os verdes simplesmente criam um novo arquivo e o chamam de jogo. Vidro. pontos verdes Material de importação de pontos verdes. Em seguida, crie um jogo de nomenclatura rígido sem estado. Tela inicial. Aqui, retornaremos a tela inicial animada. Portanto, algumas das propriedades e argumentos comuns que podemos encontrar ao trabalhar com uma tela inicial animada, nossa duração, um valor de duração. O valor da iteração especifica por quanto tempo a tela inicial ficará lá. Então, vamos escrever a duração para 2 s. Então. O próximo é a barra, qualquer widget que especifica a imagem, logotipo ou o texto a ser exibido na tela inicial. Então, splash, simplesmente escreveremos imagem, conjunto de pontos e, em seguida, ativos, imagens, jogo, logotipo, ponto PNG. Em seguida, temos a próxima tela. Isso significa por onde navegar. Depois disso, a duração dos respingos termina após 2 s. Com alguns, vá para o menu principal const. Em seguida, isso mudará o tamanho do ícone, 25250, e mudará a cor de fundo para as cores preto escuro. E também vamos escrever a transição inicial. Esse é o efeito da transição menos agradável. Vamos começar com a transição de escala. Ok? Vamos atribuir esse menu à página inicial. Basta escrever o jogo, a tela inicial. Vamos salvar tudo e verificar. Veja, faz telas iniciais lá e depois de 2 s, nosso menu de jogabilidade está lá. Então, vou reiniciar novamente e ver que esse foi o efeito dos rituais e está muito bonito. Eu direi que, se você quiser, você pode tentar diferentes transições. Depende de você. E você também pode alterar o logotipo do aplicativo ou qualquer plano de fundo ou aquela cor. Obviamente, é sua própria criatividade. Então é isso para este vídeo. No próximo vídeo, mudaremos o ícone do lançador, enqueue. 25. Vídeo 24 Alterar o ícone do lançador: Olá, bem-vindo ao vídeo final deste curso. Trabalharemos para alterar o nome do aplicativo e o ícone do inicializador. Então, se você acessar o aplicativo e sair, poderá ver aqui que este é o nome do aplicativo e esse é o ícone do lançador. Para alterar o nome do nosso aplicativo no Android. Vá para o diretório de aplicativos Android e depois para a fonte, depois para a média. Em seguida, arquivo de manifesto do Android. E aqui você pode encontrar esse rótulo de aplicativo aqui. Basta trocá-lo para lutador de peso. Ou seja, tem espaço e capitais. Então, isso era para o nome do aplicativo. Agora, para alterar o ícone padrão do aplicativo Platter, usaremos o nome do pacote como ícones do lançador de plotter. Então, vamos aqui. Certo? Lançador. Agora tenho certeza de que posso. É uma abordagem recomendada que faz todo o trabalho pesado de atualizar ícones do inicializador de aplicativos para diferentes plataformas. Então, vamos simplesmente copiar a dependência em seus puffs de volta para esse arquivo YAML. Simplesmente, basta colá-lo. Mas lembre-se, temos que colar isso dentro das dependências do desenvolvedor e não nas dependências. Então, aqui abaixo da lente da loteria, basta colar e salvar. Agora. Ok, espere, ainda está ficando bem, instantâneo. Agora, para que funcione, precisamos adicionar algumas configurações da Flórida dentro deste arquivo YAML de pontos de especificação do Pub. Então, abaixo, aqui, temos que ir exatamente abaixo dessas dependências de desenvolvimento. Lembre-se e escreva ícones de letras. E estou te dizendo repetidamente que essa especificação do Pub é que o arquivo YAML é muito sensível. Se você fizer algum espaço extra e tudo mais, você pode nos contratar. Agora, clique em um espaço. Nossa, nós pagaríamos a conta, ok. Dê uma conta. E escreva para Android para fazer iOS. Através da imagem. Separe essa parte do ícone. Eu decidirei ativos, imagens, o logotipo do jogo, pontos PNG e, em seguida o mínimo como K and ride. E usaremos 21. E eu recebo esses códigos na seção Leia-me. C. Você pode entender como isso é feito, como está nas dependências de desenvolvimento, nessa inundação, nos ícones da Flórida e tudo . Nós salvamos tudo. Depois de configurar a configuração, tudo o que resta é executar esse pacote com a ajuda de um terminal anexado ao comando e simplesmente escrever, obviamente, temos esse prato sendo recuperado repetidamente. E depois disso, basta escrever uma carta. Bob. Run, Flutter, lançador, ícones e apresentador. Oh, ei, vamos ver. Acho que acredito que está feito. Não tenho certeza se Wesley gerou ícones do lançador com sucesso. Temos que parar esse modo de depuração e executar novamente. Vamos ver. O Daikon está atualizado ou não. Se eu for ver, temos a picada da fruta, o nome do aplicativo e a etiqueta do ícone e está muito bonita. Eu direi que, se eu for, obviamente podemos jogar o jogo. Obviamente, tenho a intenção de dizer isso de novo. Os componentes do vírus, este é o jogo que podemos jogar. Temos uma leitura. Então é isso. Para este curso. Espero que você tenha gostado e aprendido muito. Continue praticando. E vou me certificar de criar mais cursos de código sobre um motor de jogo idiota e criar jogos lindos. Ou você pode dizer mais jogos interativos no futuro. Enquanto isso. Você também pode conferir meus outros cursos . Obrigada. Tenha um bom dia. 26. Teste o jogo completo: Uau.