Paginar Comics HQs e livro com swipe no construct2

Vamos aprender a fazer paginação de Comics HQs e Livro, com swipe (movimento de touch nas telas) no construct 2.

Para esta aula utilizaremos o Construct 2 (que pode ser baixado do site da Scirra), e imagens baixadas da internet.

O construct 2 faz games e aplicações para várias plataformas:
– PC (Windows, Mac e Linux)
– Web
– Mobile (IOS, Android,…)
E outras, conforme site do fornecedor Scirra).

E dentre as aplicações podemos citar a criação de livros / revistas (conteúdo para leitura), com o diferencial de poder adicionar animações e áudio, criando assim um produto diferenciado.

Veja nesta aula uma forma de trabalhar com este tipo de mídia, com a criação da mecânica de troca de páginas.

Etapas

1 – Selecione as imagens que deseja apresentar em cada tela (pode explorar bem o cenário, nesta aula utilizaremos imagens simples baixadas da internet.)

2 – Escolha um tamanho de tela e resolução.

resolução telas

3 – Conte quantas páginas vc utilizará, e multiplique pela largura da resolução escolhida, e defina a largura do seu layout com este resultado.

4 – Criação de variáveis de controles para paginação, e outras variáveis de controle para swipe.

variaveis
– PaginaAtual, NumeroPaginas – serão para controle interno no script
– TamanhoPagina – deve conter o tamanho que foi selecionado na resolução da tela.
– SwipeInicioX, SwipeDistancia – serão para controle interno no script
– SwipeTamanho – deve conter o tamanho de swipe mínimo que aceitaremos para execução da troca de página, isto é necessário para que não pude de página com um leve toque, e sim com um arrastar de dedo.

5 – Ao iniciar o layout já carregaremos algumas informações:

script_start_layout
Definimos o numero total de páginas (baseado no tamanho total da largura do layout).
E movimentamos a tela para a primeira página.

6 – Segue abaixo o script para controle do Swipe e mudança das páginas:

script_swipe
No evento que testa o swipe apenas atualizamos a página atual, e abaixo teremos o scroll to X movimentando para a página atual.

Acompanhe o tutorial em vídeo:

Abraços
Maciel

Para receber atualizações assine nossa newsletter, e o canal no youtube: Canal Youtube

Siga nossas postagens nas redes sociais:
– Curta a Fanpage: Facebook
– Acompanhe nossas postagens no G+: Google Plus
– Receba atualizações pelo Twitter: Twitter

Deixe uma resposta