{"id":156,"date":"2015-04-10T20:59:40","date_gmt":"2015-04-10T23:59:40","guid":{"rendered":"http:\/\/www.galirows.com.br\/meublog\/gideros\/?page_id=156"},"modified":"2015-04-11T17:15:07","modified_gmt":"2015-04-11T20:15:07","slug":"livro-interativo","status":"publish","type":"page","link":"https:\/\/www.galirows.com.br\/meublog\/gideros\/criando-aplicacoesjogos\/livro-interativo\/","title":{"rendered":"Livro interativo"},"content":{"rendered":"

Essa aplica\u00e7\u00e3o \u00e9 bastante b\u00e1sica, sendo que \u00e9 poss\u00edvel fazer o livro interativo sem nem mesmo ter visto o material introdut\u00f3rio<\/a> do blog. A facilidade em desenvolver o livro interativo \u00e9 porque ele se baseia em uma classe desenvolvida e disponibilizada em\u00a0http:\/\/hnimpage.wordpress.com\/2012\/02\/02\/gideros-mobile-comic-book-with-page-curl-effect\/<\/a>. Classe \u00e9 um conceito que \u00e9 explicado atrav\u00e9s do material \u00a0sobre objetos (dispon\u00edvel nesse link<\/a>).<\/p>\n

Os mesmos conceitos envolvidos no desenvolvimento de games podem ser utilizados no desenvolvimento de entretenimento digital de maneira geral. A proposta ilustrada agora fornece a possibilidade de elaborar um livro interativo, oferendo inclusive o efeito de virar a p\u00e1gina.<\/p>\n

Para utilizar esse recurso \u00e9 necess\u00e1rio baixar o arquivo PageCurlEffect.zip e incorporar seus dois scripts LUA e seu diret\u00f3rio de imagens a um novo projeto criado. A figura abaixo \u00e9 poss\u00edvel ver os arquivos incorporados ao projeto e na \u00e1rea de edi\u00e7\u00e3o do c\u00f3digo o arquivo \u201cmain.lua\u201d aberto para edi\u00e7\u00e3o.<\/p>\n

\"image056\"<\/a><\/p>\n

A elabora\u00e7\u00e3o do livro \u00e9 facilitada pela utiliza\u00e7\u00e3o de uma classe desenvolvida pelo autor e dispon\u00edvel no script \u201cFlipPageView.lua\u201c. Essas classes s\u00e3o bastante \u00fateis e mais adiante veremos como criar essas classes para nosso projeto. Por enquanto, nos contentaremos em utilizar a classe j\u00e1 que diversos recursos que s\u00e3o utilizados na classe n\u00e3o foram estudados ainda.<\/p>\n

A classe \u00e9 instanciada na primeira linha do script principal e em seguida s\u00e3o passadas as imagens atrav\u00e9s de um vetor. Tendo isso \u00e9 finalmente adicionada a instancia a cena e \u00e9 preciso chamar o m\u00e9todo show()<\/em>, como mostrado na \u00faltima linha.<\/p>\n

Ao executar a aplica\u00e7\u00e3o teremos a primeira imagem informada no vetor de imagens sendo exibida e quando clicamos e arrastamos na parte inferior direita da cena, vemos essa imagem se comportar como uma p\u00e1gina de livro e podemos ir para a pr\u00f3xima p\u00e1gina do livro.<\/p>\n

Podemos a partir disto elaborar um livro interativo onde podemos associar a cada p\u00e1gina, por exemplo, um \u00e1udio que narra aquela cena, ou adicionar alguns elementos gr\u00e1ficos animados na tela, trazendo mais destaque para uma parte da imagem. Para realizar os itens descritos \u00e9 preciso saber em que p\u00e1gina do livro o usu\u00e1rio se encontra, dado contido na vari\u00e1vel currentPage da inst\u00e2ncia (no caso do c\u00f3digo mostrado a vari\u00e1vel seria acessada atrav\u00e9s de: flipview.currentPage).<\/p>\n\n\n\n
Para praticar:<\/strong> adicione um t\u00edtulo em cada p\u00e1gina do livro, bem como uma narrativa da hist\u00f3ria, sons e anima\u00e7\u00e3o (isso sim vai exigir que voc\u00ea tenha acompanhado o material introdut\u00f3rio<\/a> disponibilizado no blog).<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Essa aplica\u00e7\u00e3o \u00e9 bastante b\u00e1sica, sendo que \u00e9 poss\u00edvel fazer o livro interativo sem nem mesmo ter visto o material introdut\u00f3rio do blog. A facilidade em desenvolver o livro interativo \u00e9 porque ele se baseia em uma classe desenvolvida e disponibilizada em\u00a0http:\/\/hnimpage.wordpress.com\/2012\/02\/02\/gideros-mobile-comic-book-with-page-curl-effect\/. Classe \u00e9 um conceito que \u00e9 explicado atrav\u00e9s do material \u00a0sobre objetos (dispon\u00edvel […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":154,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-156","page","type-page","status-publish","hentry"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t