Aplicativo para cegos

Quem diria que um aplicativo poderia fazer as pessoas mais felizes? :)

 

Sei que constitui em uma propaganda (marketing) de uma empresa mas, mesmo assim, foi uma boa sacada da Johnson & Johnson (fabricante do Listerine).

Obs.: Tá bom, ando meio "sentimental" ultimamente...

Até mais!

CocoonJS - Alta Performance em Canvas no Mobile?

Qual web-developer não ficou furioso quando, ao trabalhar com canvas, fez aquela animação animal que roda "liso" em todos os navegadores de PC, porém, em dispositivos mobile, roda a 5 fps (frames por segundo)?

"P*ta que p*rui!" -- reclamaria.

Pois é, pensando em nós, a Ludei criou o CocoonJS!

O CocoonJS é uma ferramenta de desenvolvimento mobile para criação de jogos e apps para quem trabalha com HTML 5 e JS, focado na performance destes.

Pelos exemplos do vídeo acima, parece que o resultado é muito bom! :)

Que conhecer e testar a ferramenta? Então entre no site:

https://www.ludei.com/cocoonjs/

Até mais!

Ganhe $100.000,00 no Mobile Game Challenge!

Você é um desenvolvedor mobile de jogos? Tem criatividade e senso de humor? Sabe usar ou quer aprender as ferramentas livres do Havok?

Então, participe do "Project Anarchy Mobile Game Development Challenge", que se você ganhar, vai receber o prêmio de 100.000 dólares.

Só não se esqueça dos amigos (principalmente aqueles que deram ESTA dica ;) )!

Mais informações ou para participar da competição, entre no site:
http://www.projectanarchy.com/contest

Até mais e boa sorte para aqueles que irão competir!

Ferramentas de Desenvolvimento Mobile da IBM

Como não poderia deixar de ser, grandes empresas de informática estão investindo cada vez mais no setor de mobile, sabendo que este mercado esta em plena expansão.

Com a IBM não seria diferente:

http://www.ibm.com/developerworks/mobile/

O interessante desta vez, é que eles dividiram suas ferramentas para cada "etapa" de desenvolvimento de uma app (test, deploy, manage, etc.).

Legal, não? ;)

Obs.: A ferramenta de desenvolvimento é a cara do Eclipse (também pudera, foram eles que o criaram -- eu acho :P )!

Até mais!

Construindo aplicações multiplataformas com Intel XDK

Esta é mais uma ferramenta de desenvolvimento web/mobile, agora feita pela Intel:

http://software.intel.com/en-us/html5/tools

Possui emuladores de dispositivos móveis, é integrado com os frameworks Cordova/PhoneGap, JQuery Mobile e JNode (back-end), tem uma ferramenta de designer do tipo "clique e arraste" e roda no MS-Windows. :)

Se vale a pena? Só vendo para crer... :P

Até mais!

Dica de Programação: Existe um Firebug para Android e iPhone?

Esta certo que um esta em beta e o outro tem que pagar (mas existe a versão "comunidade"), mas sim, parece que existe! :)

O iWebInspector é uma ferramenta de desenvolvimento feita para MacOS X, que depura e consegue trabalhar no código HTML/CSS/Javascript de uma página dentro do emulador de iPhone que vem instalado junto com o XCode.

Bem bacana, mas não sei se funciona direito (é de graça, mas sua versão ainda não é a final...). Veja mais em:

http://www.iwebinspector.com/

Já o jsHybugger é a mesma coisa, só que faz isso para Android:

https://www.jshybugger.com/

Hum... Se eles funcionarem bem, posso dar adeus aos console.log e alert(s) :)

Até mais!

Dicas para programação de sites mobile

Aqui vão as minhas dicas para quem esta iniciando neste maravilhoso e complicado mundo de site mobile:

- É possível implementar aplicações responsivas (onde a página se ajusta, através de folhas de estilos, conforme o tamanho da tela/navegador), porém é um pouco difícil de se fazer, se as telas de desktop e de mobile forem muito diferentes (Quer mais informações? Entre no site da wikipédia: http://pt.wikipedia.org/wiki/Web_Design_Responsivo).

- Evitem usar muitas imagens "pesadas" para web-mobile, para que o usuário não sinta uma "lentidão" no sistema.

- Efeitos visuais não são recomendáveis, pois alguns aparelhos de baixo processamento não suportam muito bem isso (travam, ficam lentos, etc.).

- Evitem usar tamanhos fixos no estilo e nos elementos, tentem usar o máximo possível de porcentagem ou "em".

- Se sua aplicação checar se o navegador é mobile via User-Agent (cabeçalho da página web onde pode-se identificar o navegador e sistema operacional que requisitou esta), vocês podem emular isso via plugins, como este:

https://addons.mozilla.org/en-US/firefox/addon/user-agent-switcher/

 - Se necessário, não esqueçam da meta tag viewport:

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

- Se vocês não tiverem dispositivos para seus testes, pode-se emular alguns destes via web, através do site:
 http://www.mobilephoneemulator.com/ (Não é 100% confiável, mas é alguma coisa).

     
Obs.: Recomendação para esta ferramenta: para melhor emulação, abram esta url no Google Chrome (para testes no Android) e/ou no Safari (para testes no iPhone).

- Em testes finais, sempre usem dispositivos reais.

- Se for necessário implementar algum efeito visual, testem no pior dispositivo possível (com o menor processamento, tela pequena e pouca memória).

- Sei que isso vale mais para desenvolvimento nativo, mas sempre deem uma olhada nos guidelines disponíveis para Android (http://developer.android.com/design/index.html) e para iOS (https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html), pois estes dão dicas legais para quem esta começando. :)

Espero que isso ajude alguém...

Até mais!

Teste suas aplicações mobile com Appium

Appium é (mais) um framework de testes para aplicações mobile nativas ou híbridas que usa o protocolo WebDriver JSON Wire para executar seus scripts (não sabe o que é isso? Então clique aqui e aqui).

Pelos vídeos, parece legal (apesar que diz que pode ser programado em várias linguagens, os exemplos que vi estão em Python...).

O projeto atual é open-source e pode ser baixado (e também, para obter mais informações) no site:
http://appium.io/

Obs.: E sim, é mais um framework baseado em Selenium. :P

Até mais!

Faça jogos mobile com Gideros Mobile!

Se eu falar em Lua + Mobile alguns já vão pensar em Corona IDE, certo?

O problema é que o Corona é pago (ou era -- parece que eles liberaram uma versão free :P )

Mas sabia que existe mais uma opção para se programar jogos em Lua para dispositivos iOS e Android?

Pois é, e ele se chama Gideros.

Gideros é um aplicativo completo para desenvolvimento de games nesta linguagem. Possui uma IDE, um simulador e ferramentas para textura e fonte (parece completo...).

Sua versão free, por enquanto, não tem limitações (de acordo com o site).

Gostou? Quer saber mais? Então vá em http://www.giderosmobile.com/

Obs.: Esse negócio de fazer ferramentas multiplataforma para mobile esta cada vez maior (principalmente de jogos...). É impressão minha, ou será que este mercado esta crescendo?

Até mais!

Dicas de Programação: Desenhando na tela do Android

Esta foi um pedido de um colega meu.

Para os acostumados em "desenhar" pelo método paint do Java AWT/Swing, sabia que dá para "converter" este tipo de coisa para Android?

Para isso, o primeiro passo seria reescrever o método onDraw de uma View:

/**
 *Classe que herdar de android.view.View
 **/
public class DrawView extends View {

//Objeto de auxilio para desenhar
private Paint paint = new Paint();

/**
 *Construtor da classe
 *@param context Contexto da aplicação
 */
public DrawView(Context context) {
      super(context);
}

/**
 *Reescrevendo o método onDraw da View
 *@param canvas Objeto para "desenhar" na tela
 */
@Override
protected void onDraw(Canvas canvas) {
        //Chamando o método reescrito da "superclasse" (classe-pai)
super.onDraw(canvas);
        //Pintando a tela inteira de preto
canvas.drawColor(Color.BLACK);
        //Pintando um quadrado verde 50x50 na posição 100x100 deste objeto (view)
paint.setColor(Color.GREEN);
canvas.drawRect(100, 100, 150, 150, paint);
}
}

Agora, em sua Activity principal (classe que é executada pelo Android), basta adicionar a view que criamos para mostra-la na aplicação:

/**
 * Classe que herda de android.app.Activity
 */
public class MainActivity extends Activity {
 
/**
 *Reescrevendo o método onCreate da Activity (chamado no inicio da "atividade")
 *@param savedInstanceState Objeto que contém o último estado salvo.
 */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        //chamando o mesmo método da classe-pai ("superclasse")
        super.onCreate(savedInstanceState);
        //obtendo as propriedades da tela
        Display screen = getWindowManager().getDefaultDisplay();
        //criando a view principal
        DrawView drawView = new DrawView(getApplicationContext());
        //adicionando a view para ser mostrada em tela inteira
        addContentView(drawView, new LayoutParams(screen.getWidth(), screen.getHeight()));
    }
}

Se tudo funcionar bem, um quadrado verde aparecerá em seu sistema. :)

Até mais!

CocosBuilder: Criando interfaces para jogos

Para quem não sabe, Cocos2D é uma biblioteca gráfica que ajuda a criar jogos 2D (ela usa o OpenGL por trás dos panos).

Escrita inicialmente em Python, hoje esta é mais famosa pelo "port" feito em Objective-C para iOS.

Apesar da facilidade de usar a biblioteca (muito mais fácil que usar o OpenGL "puro"), fica difícil saber, via programação, como uma tela pode ficar (além de "perder" tempo ajustando posicionamento e resolução...).

Pensando nisso, algumas pessoas criaram uma ferramenta que auxilia a "moldar" a interface de um jogo feito com Cocos2D, chamada CocosBuilder.

Parece bem legal, ainda mais para quem esta começando agora (que é o meu caso :P).

Para mais informações, no site:
http://cocosbuilder.com/

Obs.: Parece que existe um "port" para AndEngine (que é similar ao Cocos2D, só que para Android) para suporte ao CocosBuilder:
http://www.andengine.org/blog/2012/06/andengine-cocosbuilderextension/

Obrigado Gui, pela dica! :)

Até mais!

Python para IOS

Para quem não sabe, Python é uma linguagem de programação interpretada onde sua característica principal é distinguir blocos de execução através de indentação.

Se você não entendeu a explicação, a Wikipédia pode te ajudar. :P

Mas até ai, tudo bem. A linguagem até que é famosa e nem estou falando nada que a maioria dos programadores sabe...

O que me surpreendeu, foi saber que alguém teve a idéia de criar um interpretador Python para iOS:

http://pythonforios.com/

E que a Apple liberou esta aplicação na App Store (ou seja, não usa um JailBreak)!

Até mais!

Tutorial - Parte 5 - Fazendo um Genius em PhoneGAP

Agora é a última parte. :)

Para iOS:

- No arquivo zipado do PhoneGap, vá na pasta lib/ios e execute o arquivo "Cordova-X.X.X.dmg";
- Clique duas vezes (ou uma vez, dependendo de como seu Mac esteja configurado...) no item "Cordova-X.X.X.pkg";
- Clique nos botões "Next" (ou "Continuar"), até que finalize a instalação (quando o botão exibido é o "Close" (ou "Fechar"));
- Clique no botão "Close" (ou "Fechar");
- Abra o "Xcode";
- Clique no item "Create a new Xcode project";

- Escolha o template "Cordova-based Application";
- Preencha os campos, retire o "check" "Use Automatic Reference Counting" (na versão 1.7 do Cordova ainda não tinha suporte...) e finalize (clique no botão "Next");
- Vá para a pasta www do projeto criado;
- Copie ou crie o arquivo html de sua aplicação na pasta www e renomeie para index.html (se já existir um, remova-o e coloque o seu);
- Clique no menu "File"->"Add Files to <Projeto>" do Xcode;
- Selecione a pasta www, selecione o item "Create folder references for any added folders" e clique no botão "Add";
- No Xcode, selecione o projeto/dispositivo a ser rodado e clique no botão "Run";

Se tudo der certo, a aplicação aparecerá assim:

Uia, iguar quenhem a otra! :)

E, finalmente, terminamos o tutorial...

Obs.: Eu dei uma arrumada nas outras partes do tutorial (isso que dá fazer sem testar...), agora deve estar tudo certo para que este pequeno jogo funcione. :P

Desculpem pelas mancadas!

Até mais!

Tutorial - Parte 4 - Fazendo um Genius em PhoneGAP

Vamos instalar a nossa aplicação?
- Primeiro, baixe o PhoneGap: http://phonegap.com/download;
- Expanda o arquivo zip;

Para Android:
- Abra o Eclipse e crie um novo projeto Android (selecione a versão 2.2 do Android);
- Crie em seu projeto no Eclipse, as pastas libs e assets/www;
- Jogue na pasta libs o arquivo cordova-X.X.X.jar do diretorio /lib/android que esta dentro do zip;
- Jogue no pasta assets/www o arquivo cordova-X.X.X.js do  diretorio /lib/android que esta dentro do zip;
- Clique com o botão direito no projeto (Eclipse) e vá em Properties;

- Nos itens a esquerda, vá para o item "Java Build Path";
- Na aba "Libraries", adicione o arquivo cordova-X.X.X.jar da pasta libs (interno do projeto);
- Agora, abra o arquivo "AndroidManifest.xml" em um editor (pode ser no Eclipse mesmo) e adicione as seguintes linhas entre as tags "uses-sdk" e "application":

    <supports-screens

        android:anyDensity="true"

        android:largeScreens="true"

        android:normalScreens="true"

        android:resizeable="true"

        android:smallScreens="true" />

    <uses-permission android:name="android.permission.VIBRATE" />

    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />

    <uses-permission android:name="android.permission.READ_PHONE_STATE" />

    <uses-permission android:name="android.permission.INTERNET" />

    <uses-permission android:name="android.permission.RECEIVE_SMS" />

    <uses-permission android:name="android.permission.RECORD_AUDIO" />

    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />

    <uses-permission android:name="android.permission.READ_CONTACTS" />

    <uses-permission android:name="android.permission.WRITE_CONTACTS" />

    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

    <uses-permission android:name="android.permission.GET_ACCOUNTS" />

    <uses-permission android:name="android.permission.BROADCAST_STICKY" />

- E na tag "activity" adicione as seguintes propriedades (dentro da tag):

            android:screenOrientation="portrait"

            android:configChanges="orientation|keyboardHidden"

- Agora abra a classe <Nome_do_Projeto>Activity (deve ser a única na pasta src) e mude ela para extender de DroidGap e use o método loadUrl no onCreate de sua classe:

package org.toolbox.game.genius;

import org.apache.cordova.DroidGap;

import android.os.Bundle;

public class <Nome_do_Projeto>Activity extends DroidGap {

    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        super.loadUrl("file:///android_asset/www/index.html");

    }

}

- Crie ou coloque o arquivo html da aplicação que a gente criou (no caso, o nosso genius) na pasta assets/www e renomeie para index.html (caso este não se chame assim);

- Se você criou um javascript separado, coloque nesta pasta (se ele estiver em outra pasta, coloque ele dentro da mesma hierarquia, ou seja, coloque a pasta completa :) );

- Clique no menu "Window"-> "AVD Manager"

- Crie um emulador, clicando no botão "New" (se já não existir), coloque um nome para este "dispositivo" e escolha em "Target" o valor "Android 2.2 - API Level 8";

- Clique no botão "Create AVD";

- Selecione o projeto no "Package Explorer" e clique no item "Run"->"Run" do menu principal;

- Selecione o item "Android Application" e clique no botão "Ok";

Se der certo, ele abrirá o simulador (agora, você deve esperar um bom tempo...) e aparecerá esta tela:

Legal, não?

O próximo passo é instalar no iOS e, com isso, será o fim de nosso tutorial! :)

Tutorial - Parte 3 - Fazendo um Genius em PhoneGAP

Terceira parte, e vamos que vamos! :)

Depois que a seqüência é exibida, precisamos obter os itens (cores) que o usuário digitar. Para isso, vamos mexer na função swithOnLight():

/**
* Função de acende a luz do item da seqüência selecionada
  */
function swithOnLight() {
//Se o indice esta na seqüência...
if ((index >=0) && (index < sequence.length)) {
  //Obtem o item da seqüência
  selected = sequence[index];
    //Acende a "luz" do item indicado
    switchLight(selected.x, selected.y);
    //Espera meio segundo para apagar o item selecionado
    setTimeout('switchOffLight();', 500);
} else {
   //Se o indice não estiver seqüência ou chegou no fim da seqüência,
   //habilito os botões para que o usuário possa digitar a seqüência de cores
index = 0;
alert('Sua vez!');
for (var i = 0; i < 4; i++) {
var el = document.getElementById('genius[' + parseInt(i % 2) + '][' + parseInt(i / 2) + ']');
if (typeof(el.ontouchstart)!='undefined') {
el.ontouchstart = play;
} else if (typeof(el.onclick)!='undefined') {
el.onclick = play;
}
}    
}
}

Agora, precisamos verificar se a seqüência que o usuário digitar é válida através da função play:

/**
* Função do evento de click de um dos botões de cores
*/
function play(event) {
   var el = event.srcElement;
        var color = "" + el.style.backgroundColor;
        //Troco a cor deste (se ele estiver mais escuro (por exemplo RGB(0,153,0)) , coloco uma cor mais clara (RGB(0,255,0) ou vice-versa)
        color = color.indexOf('153') >= 0 ? color.replace(/153/gi,'255') : color.replace(/255/gi,'153');
        //Coloco a nova cor para o elemento a ser exibido
        el.style.backgroundColor = color;
        setTimeout(function() {
            //Verifico se o que o usuário clicou esta correto na seqüência guardada
if (el.id == 'genius[' + sequence[index].x + '][' + sequence[index].y + ']') {
//Se sim passo para o próximo item da seqüência
index++;
//Se for o último item é por que a seqüência esta correta e completa.
if (sequence.length == index) {
alert('Seqüência correta!');
//Desabilito os botões de cores (Removo os eventos)
for (var i = 0; i < 4; i++) {
var btnCores = document.getElementById('genius[' + parseInt(i % 2) + '][' + parseInt(i / 2) + ']');
if (typeof(btnCores.ontouchstart)!='undefined') {
btnCores.ontouchstart = null;
} else if (typeof(el.onclick)!='undefined') {
btnCores.onclick = null;
}
}
//Habilito o botão de Start!
btnStart.disabled = false;
}
} else {
   //Senão, ele errou e deve fazer a seqüência tudo de novo
index = 0;
alert('Errou! Tente de novo!');
}
       //Troco a cor deste (se ele estiver mais escuro (por exemplo RGB(0,153,0)) , coloco uma cor mais clara (RGB(0,255,0) ou vice-versa)
       color = color.indexOf('153') >= 0 ? color.replace(/153/gi,'255') : color.replace(/255/gi,'153');
        //Coloco a nova cor para o elemento a ser exibido
        el.style.backgroundColor = color;
}, 500);
}

Ufa..., agora só falta instalar o PhoneGap para Android ou para iOS (e isso vai ser feito no próximo tutorial) :)

Até mais!

Teste sua aplicação Android com Robotium

Alguém já usou Selenium?

Se sim, você sabia que existe uma ferramenta de teste que se diz parecido com o Selenium mas que testa aplicações nativas em Android?

Pois é, ele existe e se chama Robotium (até o nome é parecido... :P ):
http://code.google.com/p/robotium/

Obs.: Para quem não sabe o que é Selenium: ele é uma ferramenta de testes automatizados para web que não só checa a "lógica" do sistema, como também o fluxo e as estruturas das páginas. Mais informações: http://seleniumhq.org/

Até mais!

Tutorial - Parte 2 - Fazendo um Genius em PhoneGAP

Vamos continuar o tutorial, agora escrevendo uma parte do javascript (aquela que "liga" e "desliga" as "luzes"):

Primeiramente, vamos criar uma funçāo que obtem um elemento e troca a cor deste para uma mais clara ou escura, dependendo do estado anterior:

<SCRIPT>
      /*
       * Função que "liga" ou "desliga" a "luz"
       * Parametros: x - posição horizontal da "luz" (0 (coluna 1) ou 1 (coluna 2)), y - posição vertical da "luz" (0 (linha 1) ou 1 (linha 2))
       */
        function switchLight(x, y) {
            //Obtenho o elemento que exibe a cor
            var el = document.getElementById('genius['+ x +']['+ y +']');
            //Obtenho a cor do elemento
            var color = "" + el.style.backgroundColor;
            //Troco a cor deste (se ele estiver mais escuro (por exemplo RGB(0,153,0)) , coloco uma cor mais clara (RGB(0,255,0) ou vice-versa)
            color = color.indexOf('153') >= 0 ? color.replace(/153/gi,'255') : color.replace(/255/gi,'153');
            //Coloco a nova cor para o elemento a ser exibido
            el.style.backgroundColor = color;
        }
</SCRIPT>

Para ver se a função deu certo, coloco esta no evento onclick (ou ontouchstart, em mobile) no botão:

<!-- Acende ou apaga a "luz" verde-->
<BUTTON id="start" ontouchstart="switchLight(0,0);">Start!</BUTTON>

Se tudo ocorrer bem, quando você clicar no botão "Start!", ele vai acender a luz verde e, quando clicar de novo, apagar! :)

Próximo passo: precisamos guardar a seqüência das luzes a cada nova interação. Para isso, criamos uma variável global (array):

var sequence = [];

E também uma função que gera e guarda a seqüência:

/* Função que gera uma seqüência: escolhe uma linha (zero ou um) e uma coluna (zero ou um) e guarda em um array
 */
function addSequence() {
//Gera um número aleatório de 0 ao 1
var x = Math.round(Math.random());
//Gera um número aleatório de 0 ao 1
var y = Math.round(Math.random());
//Guarda em um array
sequence.push({"x": x, "y": y});
}

Agora vem a parte mais difícil, que é reproduzir a seqüência na tela. Vamos criar as funções que lê um item da seqüência, acende a luz indicada por este item e depois apaga:

//Variável global que indica o item da seqüência a ser utilizada
var index = 0;
//Variável global que contém o item selecionado na seqüência
var selected = null;
//Variável que faz referência ao botão html
var btnStart = null; 
...

/**
 * Evento onload
 */
window.onload = function() {
btnStart = document.getElementById('start');
}

/**
 * Função de acende a luz do item da seqüência selecionada
 */
function swithOnLight() {
//Se o indice esta na seqüência...
if ((index >=0) && (index < sequence.length)) {
   //Obtem o item da seqüência
   selected = sequence[index];
   //Acende a "luz" do item indicado
   switchLight(selected.x, selected.y);
   //Espera meio segundo para apagar o item selecionado
   setTimeout('switchOffLight();', 500);
} else {
    //Se o indice não estiver seqüência ou chegou no fim da seqüência, habilito o botão "Start!" 
    btnStart.disabled = false;
}
}

/**
 * Função que apaga a luz e vai acender (se existir) o próximo item da sequência 
 */
function switchOffLight() {
//Se existe um item "acendido" (selecionado)
if (selected != null) {
     //então apago
     switchLight(selected.x, selected.y);
     selected = null;
}
//Vai para o próximo item da seqüência
index++;
//e tento acender este
setTimeout('swithOnLight()', 500);
}

Agora, retiramos o evento ontouchstart ou onclick (se foi colocado) do botão "Start!" e colocamos os eventos para criar a animação das luzes:
              
/**
 * Função que inicia a animação da sequência de cores
 */
function startSequence() {
     //Animação começa desde do inicio da sequência
     index = 0;
     //Desabilita o botão
     btnStart.disabled = true;
    //Adiciona um item na sequência
    addSequence();
    //tenta acender a primeira luz da sequência e executa as demais.
    swithOnLight();
}

/**
 * Evento onload

 */
window.onload = function() {
    btnStart = document.getElementById('start');
    if (btnStart != null) {
         //Adiciono o evento onclick ou ontouchstart para executar a sequência
         if (typeof(btnStart.ontouchstart) != 'undefined') {
              btnStart.ontouchstart = function() {
            startSequence();
            }
         } else if (typeof(btnStart.onclick) != 'undefined') {
              btnStart.onclick = function() {
            startSequence();
            }
         }          
    }
}

Por enquanto é só (mas agora falta pouco... :) ).

Até mais!

Tutorial - Parte 1 - Fazendo um Genius em PhoneGAP

Ultimamente ando meio sem assunto (e também um pouco ocupado...).

Mas, finalmente, tive um tempinho para postar aqui e resolvi fazer um tutorial de PhoneGAP (esta certo, não sou um especialista, mas na hora, foi o que deu para pensar...).

Pensei então em fazer um Genius.

Para quem não sabe, o Genius era um jogo, lançado pela Estrela, que basicamente era um jogo da memória. Consistia em decorar a seqüência de luzes e reproduzi-las a seguir.

Na época era o jogo mais "tecnologicamente" avançado, só perdendo para o Odissey e o recém lançado Atari.
Bem, chega de conversa, e vamos lá:

Primeiramente, vamos criar o HTML e o CSS para a tela:


<!-- DOCTYPE HTML -->
<HTML>
<HEAD>
<META name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</HEAD>
<BODY>
<TABLE borderspacing="0" borderpadding="0">
<TR><TD id="genius[0][0]" style="background:#009900;width:100px;height:100px;border:1px solid #000;" ></TD><TD style="background:#990000;width:100px;height:100px;border:1px solid #000;" id="genius[0][1]"></TD></TR>
<TR><TD id="genius[1][0]" style="background:#999900;width:100px;height:100px;border:1px solid #000;" ></TD><TD style="background:#000099;width:100px;height:100px;border:1px solid #000;" id="genius[1][1]"></TD></TR>
</TABLE>
<BUTTON id="start" >Start!</BUTTON>
</BODY>
</HTML>

Abra no navegador, e veja como fica. :)

Por enquanto, ficamos só nisso, no próximo post, vamos fazer a animação de acender o "pedaço".

Até mais!

Programe em Java para iOS

Mais uma ferramenta de desenvolvimento para Mobile Cross-Plataform, só que desta vez você programa em Java. :)

A ferramenta se chama Codename One. Ela constitui em um plugin (para Eclipse ou para Netbeans), uma aplicação para designer de tela (sim, você desenha a tela com drag and drop), um simulador (!!!), documentação e alguns códigos de exemplo.

Como a ferramenta também foi feita em Java, provavelmente roda na maioria dos sistemas operacionais, inclusive no MS-Windows ou GNU/Linux.

Para mais informações no site:
http://www.codenameone.com/

A ferramenta é open-source e completamente free para uso comercial.

Criando aplicações iPhone no MS-Windows com MobiOne

A coisa que mais complica um programador que queria criar aplicações iOS, é o fato de que, para desenvolver estas, é preciso ter o XCode instalado em um MacOSX (não há versões desta ferramenta para MS-Windows ou GNU/Linux ...)

Mas pensando nestas pessoas, a Genuitec criou um framework de desenvolvimento chamado MobiOne Studio.

Ele é uma ferramenta completa, com componentes visuais, interface drag n'drop e um emulador de iPhone embutido.

Para mais informações, entre no site:
http://www.genuitec.com/mobile/index.html

Parece que, basicamente, ele usa a mesma estratégia do PhoneGap (HTML 5, CSS e Javascript)

Obs.: Ele é uma ferramenta paga, mas dá para testar usando a versão trial por 15 dias.

Até mais!