Boa tarde!!

Hoje vamos dar mais um pequeno passo neste tutorial. Vamos implementar uma pontuação. Primeiro criaremos algumas variáveis.

-- Instruções
local instrucoes

-- Pontuação
local score
local scoreTF

Vamos começar implementando elas na função mostrarTelaJogo:

instrucoes = display.newImage( 'instrucoes.png', 112, 370 )
instrucoes.x = _W / 2
instrucoes.y = _H / 2 + 150

score = display.newImage( 'pontuacao.png', 260, 10 )
scoreTF = display.newText( '0', 278, 40, 'Marker Felt', 30 )
scoreTF:setFillColor( 238, 238, 238 )

Ao começar o jogo é preciso remover essas instruções da tela:

display.remove( instrucoes )

E agora precisamos incrementar a pontuação sempre que a bolinha acertar a raquete:

scoreTF.text = tostring( tonumber( scoreTF.text ) + 1 )

Com isso já deve estar tudo ok, qualquer dúvida é só postarem aí. Até o próximo post!! Ah, para baixar o projeto, clique aqui.

Bom dia!!
Hoje vou mostrar como o jogo vai funcionar. A lógica dele é bem simples, vocês vão ver.
Primeiro vamos adicionar mais algumas variáveis e declarar mais algumas funções:

-- Variáveis
local escala    = 0.9
local variation = 0.05
local ballX     = 0
local ballY     = 0
local ballVar   = 0.5

-- Fim do Jogo
local fimJogo

local gameListeners   = {}
local comecarJogo     = {}
local update          = {}
local moverRquete     = {}
local fim             = {}

Agora vamos deixar a função mostrarTelaJogo da seguinte forma:

function gameListeners( action )
    if ( action == 'add' ) then
        bg:addEventListener( 'touch', moverRaquete )
    else
        bg:removeEventListener( 'touch', moverRaquete )
        Runtime:removeEventListener( 'enterFrame', update )
    end
end

function comecarJogo()
    bg:removeEventListener( 'tap', comecarJogo )
    Runtime:addEventListener( 'enterFrame', update )
end

function hitTestObject( objeto1, objeto2 )
    local esquerda = objeto1.contentBounds.xMin <= objeto2.contentBounds.xMin and objeto1.contentBounds.xMax >= objeto2.contentBounds.xMax
    local direita  = objeto1.contentBounds.xMin >= objeto2.contentBounds.xMin and objeto1.contentBounds.xMax <= objeto2.contentBounds.xMax
    local cima     = objeto1.contentBounds.yMin <= objeto2.contentBounds.yMin and objeto1.contentBounds.yMax >= objeto2.contentBounds.yMax
    local baixo    = objeto1.contentBounds.yMin >= objeto2.contentBounds.yMin and objeto1.contentBounds.yMax <= objeto2.contentBounds.yMax

    return ( esquerda or direita ) and ( cima or baixo )
end

function update()
    escala = escala - variation
    ball.xScale = escala
    ball.yScale = escala

    -- Raising
    if ( math.floor( ball.xScale * 10 ) >= 15 ) then
        variation = 0.05
    end
    -- Missed
    if ( math.floor( ball.xScale * 10 ) < 3 ) then
        fim()
    end

    -- Movendo a bolinha
    ball.x = ball.x - ballX
    ball.y = ball.y - ballY

    -- Falling and Hit with paddle
    if ( math.floor( ball.xScale * 10 ) == 3 and hitTestObject( paddleTop, ball ) ) then
        variation = -0.05
        if ( ball.x < paddle.x + 50 ) then
            ballX = ( math.random() * 0.5 ) + ballVar
        end
        if ( ball.x > paddle.x ) then
            ballX = ( math.random() * -0.5 ) - ballVar
        end
        if ( ball.y < paddle.y + 75 ) then
            ballY = ( math.random() * 0.5 ) + ballVar
        end
        if ( ball.y > paddle.y - 70 ) then
            ballY = ( math.random() * -0.5 ) - ballVar
        end

        ballVar = ballVar + 0.025
    end
end

function moverRaquete( e )
    if ( e.phase == 'moved' ) then
        paddle.x = e.x
        paddle.y = e.y
    end
end

function fim()
    fim = display.newImage( 'alert.png', _W / 2, _H / 2 )
    transition.to( fimJogo, { time = 300, xScale = 0.5, yScale = 0.5 } )
end

Bom, hoje foi um post relâmpago, só para tentar não perder este ritmo de postagens antes de acabar o tutorial.
Para quem tiver interesse, pode fazer o download do andamento do projeto aqui.

Bom dia pessoal!
Hoje temos mais uma pequena parte do tutorial, vamos iniciar a tela do jogo. Para isso, vamos criar as variáveis que vão armazenar as informações desta tela:

-- Raquete
local paddle
local paddleTop
local paddleBottom

-- Bolinha
local ball

-- Variáveis
local escala = 0.9

local mostrarTelaJogo = {}

Também é preciso alterar a função startButtonListener, para que fique desta forma:

function startButtonListener( action )
    if ( action == 'add' ) then
        btnJogar:addEventListener( 'tap', mostrarTelaJogo )
        btnCreditos:addEventListener( 'tap', mostrarCreditos )
    else
        btnJogar:removeEventListener( 'tap', mostrarTelaJogo )
        btnCreditos:removeEventListener( 'tap', mostrarCreditos )
    end
end

E criaremos a função mostrarTelaJogo, já declarada anteriormente:

function mostrarTelaJogo:tap( e )
    transition.to( telaInicial, { time = 300, x = - telaInicial.height,
        onComplete = function()
            startButtonListener( 'rmv' )
            display.remove( telaInicial )
            telaInicial = nil
            -- bg:addEventListener( 'tap', startGame )
        end } )

    -- Paddle
    paddleBottom = display.newImage( 'paddleBottom.png', _W / 2, ( _H / 2 ) * 1.5 )
    paddleTop    = display.newImage( 'paddleTop.png'   , _W / 2, ( ( _H / 2 ) * 1.5 ) - 72 )
    paddle       = display.newGroup( paddleBottom, paddleTop )

    -- Ball
    ball = display.newImage( 'ball.png', _W / 2, ( _H / 2 ) + 55 )
    ball:scale( escala, escala )
end

Bom, está aí a tela do jogo já.
No próximo vamos adicionar a movimentação do jogo!!
Para baixar essa parte do tutorial, clique aqui.

Bom dia a todos!!

Hoje vou colocar a tela de créditos deste jogo.
Para isso, vamos adicionar as seguintes linhas:

-- [Tela Créditos]
local telaCreditos

local mostrarCreditos = {}
local ocultarCreditos = {}

Agora criaremos o listener do botão, o evento que será disparado ao clicar no botão.

startButtonListener( 'add' )

function startButtonListener( action )
    if action == 'add' then
        btnCreditos:addEventListener( 'tap', mostrarCreditos )
    end
end

function mostrarCreditos:tap( e )
    btnJogar.isVisible    = false
    btnCreditos.isVisible = false

    telaCreditos = display.newImage( 'creditos.png', _W / 2, _H / 2 + 90 )

    telaCreditos:addEventListener( 'tap', ocultarCreditos )
end

function ocultarCreditos:tap( e )
    btnJogar.isVisible    = true
    btnCreditos.isVisible = true

    telaCreditos:removeEventListener( 'tap', ocultarCreditos )
    display.remove( telaCreditos )
    telaCreditos = nil
end

Com isso, já deve estar aparecendo a tela de créditos ao clicar no botão. Mas não é só isso não. Vamos colocar um efeito nesta transição de telas. Para isso, vamos adicionar algumas linhas à função mostrarCreditos:

    lastY = titulo.y
    transition.to( titulo, { time = 300, y = ( display.contentHeight * 0.5 ) - ( titulo.height + 50 ) } )
    transition.to( telaCreditos, { time = 300, y = ( display.contentHeight * 0.5 ) + 35,
        onComplete = function()
            telaCreditos:addEventListener( 'tap', ocultarCreditos )
        end } )

E vamos alterar a função ocultarCreditos para que fique assim:

function ocultarCreditos:tap( e )
    transition.to( telaCreditos, { time = 300, y = _H / 2 + 90,
        onComplete = function()
            btnJogar.isVisible = true
            btnCreditos.isVisible = true
            telaCreditos:removeEventListener( 'tap', ocultarCreditos )
            display.remove( telaCreditos )
            telaCreditos = nil
        end } )
    transition.to( titulo, { time = 300, y = lastY } )
end

Bom, a animação desta tela não foi nada muito grandioso, mas já deu outra cara ao app.
Para baixar essa parte do tutorial, clique aqui.
Espero que estejam gostando deste tutorial. Até o próximo!!

Boa tarde!

Me desculpem por ter sumido e deixado o blog um tanto abandonado, mas é que as coisas ficaram bem corridas por aqui.
Mudança de emprego, idéias para meus aplicativos...
Espero que logo eu consiga postar aqui as novidades sobre eles e compartilhar com vocês.

Bom, mas vamos ao que interessa.
Hoje venho falar novamente sobre o desenvolvimento multi-plataforma que o Corona SDK oferece.
Recentemente foi lançado o Corona Editor (http://coronalabs.com/products/editor/), que auxilia no desenvolvimento.

E para não passar em branco o começo deste ano e a volta das postagens, vou começar um tutorial de um jogo.
Não fui eu que fiz este tutorial, estou seguindo um modelo que encontrei no próprio site do corona. Para quem quiser ver tudo, o endereço é este: http://mobile.tutsplus.com/tutorials/corona/create-a-balance-ping-pong-game/
Vamos começar criando uma pasta chamada Tutorial Pong, com um arquivo config.lua dentro dela. Esse arquivo de configuração tornará a aplicação em tela cheia para todos os aplicativos. Nele consta o tamanho original da tela e o método utilizado para dimensionar o conteúdo no caso do aplicativo ser executado em outra resolução.

application =
{
    content =
    {
        width  = 320,
        height = 480,
        scale  = "letterbox"
    }
}

Vamos criar também o arquivo main.lua, que é o nosso projeto em si.

-- Oculta Barra de Status
display.setStatusBar(display.HiddenStatusBar)

-- Constantes que armazenam o tamanho da tela
local _W = display.contentWidth
local _H = display.contentHeight

-- [Fundo]
local bg = display.newImage( 'bg.png', _W / 2, _H / 2 )

Ao colocar uma imagem na tela é preciso informar o nome desta imagem e o seu posicionamento na tela (X, Y). E como eu fiz isso? Utilizei as variáveis que eu criei - _W, _H - que capturam o tamanho da tela e dividi cada uma por 2, ou seja, posicionei minha imagem no centro da tela.
Vamos criar também as variáveis que irão armazenar a nossa tela inicial.

-- [Tela Inicial]
local titulo
local btnJogar
logal btnCreditos
local telaInicial

E a função principal do jogo:

-- Funções
local Main = {}

-- Função Main
function Main()
    titulo      = display.newImage( 'titulo.png'     , _W / 2, _H / 2        )
    btnJogar    = display.newImage( 'btnJogar.png'   , _W / 2, _H / 1.5 + 10 )
    btnCreditos = display.newImage( 'btncreditos.png', _W / 2, _H / 1.5 + 70 )

    telaInicial = display.newGroup( titulo, btnJogar, btnCreditos )
end

Main()

Bom, neste ponto já é para ser possível visualizar a tela inicial do jogo, quer dizer, se você tiver colocado as imagens já... hehehe

Vou mudar um pouco a sequência do tutorial no qual eu tive como base, de uma forma que eu acho que vai ser mais fácil para entender e ir visualizando também.
Para baixar essa parte do tutorial, clique aqui.
Qualquer dúvida, sugestão ou dificuldade, postem aí que farei o possível para ajudar!!