Instalando e configurando o Cordova no Ubuntu 14.04

Neste artigo você confere a instalação e configuração do Cordova para desenvolvimento de aplicativos para Android,  esse tutorial funciona no Ubuntu 14.04 e 14.10, Elementary OS, Linux Mint e outros derivados do Ubuntu.

Instale o Node Package Manager (NPM) e o Node.js:

sudo add-apt-repository ppa:chris-lea/node.js
sudo apt-get update
sudo apt-get install nodejs
sudo npm install npm -g

Agora instale o Cordova:

sudo npm install cordova -g

Agora que instalamos o Cordova vamos configurar o ambiente de desenvolvimento do Android.
Vamos instalar o Java com os comandos:

sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java8-installer

Agora você precisa baixar a SDK do Android clique aqui para baixar a versão certa para o seu sistema, baixe o "SDK Tools only".

Extraia o arquivo baixado, mova a pasta extraída para sua home e altere o nome para .android-sdk para ela ficar como pasta oculta.

Agora abra o arquivo ~/.bashrc (esse arquivo está na sua pasta home).

Adicione as seguintes linhas ao arquivo.

export ANDROID_HOME=$HOME/.android-sdk
export PATH=$PATH:$ANDROID_HOME/tools

Lembrando que se você colocar a pasta do Android SDK em um diretório diferente você o caminho acima será diferente também.

Agora digite o comando:

source ~/.bashrc

Agora digite o comando android e pressione enter, na tela que aparecerá marque Android SDK build-tools Rev. 19 em Tools, marque também Android 4.4.3 (API 19), os que estão marcados deixe como estão, clique em install, aceite as licenças e então install.
Feito isso, instale o ant com o comando:

sudo apt-get install ant

Agora encontre o id da versão correta do android para criar a máquina virtual, com o comando:

android list targets

Encontre a seguinte versão:

id: 4 or "android-19"
     Name: Android 4.4.2
     Type: Platform
     API level: 19
     Revision: 4
     Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
 Tag/ABIs : default/armeabi-v7a, default/x86

Como podemos ver no meu caso o id é 4, no seu caso pode ser diferente

Agora crie a máquina virtual Android usando o comando abaixo:

android create avd --name android44 --target idDaVersãoDoAndroid --abi x86

Agora seu computador estará pronto para criar aplicativos para Android utilizando o Cordova.

Read More

Compra de conta no Google Play

Essa semana comprei minha conta de desenvolvedor na Google Play, paguei o valor de 25 dólares que na cotação atual saiu pelo preço de 64 reais. E já publiquei meus primeiros apps, quem quiser acompanhar e instalar os apps clique aqui.

Estou desenvolvendo aplicativos usando Cordova com as linguagens HTML, JS e CSS, além de alguns frameworks para facilitar o trabalho. O próximo passo é aprender Angular JS durante as férias.

Read More

JavaScript: Verificar se campo possui apenas espaços

O código a seguir pode ser usado para validar um campo ao verificar se o usuário digitou apenas espaços no campo.

Quando o usuário digita apenas espaços no campo fazer a validação do campo pode parecer um trabalho difícil.

Veja o código:

a document.getElementById('id_do_campo').value;

if(a.split(" ").join("") == ""){

    alert("O campo está vazio!");

    return false;

}

O que acontece no código acima é que como não podemos comparar o campo diretamente com um espaço vazio, então fazemos o seguinte, substituímos todos os espaços do valor do campo por nada dessa forma se restar apenas nada significa que havia apenas espaços vazios no campo.

Read More

Palestra de desenvolvimento mobile com tecnologias web

No dia 18 eu ministrei uma palestra com o título "Desenvolvimento mobile com tecnologias web" em Teófilo Otoni para alunos do curso de Sistemas de informação, para alunos do curso técnico em informática da Doctum e para alunos do curso técnico de informática das cidades de Novo Cruzeiro, Padre Paraíso e Malacacheta, para mim foi uma ótima oportunidade de passar conhecimento adiante e espero que os alunos tenham absorvido bem esse conhecimento.

Durante a palestra eu apresentei ferramentas que podem ser usadas para desenvolver aplicativos, dentre elas o PhoneGap, jQuery, Ratchet e muitos outros.

Além disso fiz uma aplicação durante a palestra a aplicação obtêm a cotação atual do dólar e passa essa informação para o usuário por meio de uma notificação do sistema, dessa forma eu exemplifiquei uma aplicação que usa plugin do PhoneGap e também a comunicação com um servidor externo.

No link abaixo você irá encontrar o slide usado na palestra, o código fonte da aplicação que foi desenvolvida e o arquivo para instalar a aplicação no Android.

https://copy.com/G2H2izbBQtuGBtTw

Agradeço a todos que participaram e estou disposto a ajudar a quem se interessar a usar essas tecnologias e ferramentas.

Read More

jQuery: Inserir conteúdo com efeito fade

O código JS abaixo insere uma tag no body da página, e essa tag será mostrada com um efeito fade do jQuery.

$('body').append($('<div class="notification"><p>Você está deconectado!</p></div>').hide().fadeIn(800));

O comando .append() apenas insere uma tag na página e mostra ela, então para fazer o efeito fade nos escondemos a tag com .hide() e logo após mostramos ela com o .fadeIn(800), o valor entre parenteses pode ser alterado para alterar a velocidade do efeito.

Read More

Abrindo link no navegador do sistema operacional.

Usando o código abaixo como base é possível fazer com que um link seja aberto no navegador do Android.

<a onclick="window.open('asdasd.html', '_system')"> Clique aqui </a>

E fiz alguns teste e não adiante definir o href e colocar _system no atributo target isso não funciona, a única forma que consegui foi com o código acima.

Read More

Como executar uma função após o método .load() do jQuery

O jQuery é um framework JS usado para desenvolvimento web, com o código abaixo você poderá executar uma função após o carregamento da página referenciada no método .load()

$('body').load('notas.html', function() {
       alert('Sua página carregou');
});

O método acima carrega a página notas dentro da tag body da página atual, após isso ele exibirá um alerta informando o fim do carregamento.
Qualquer dúvida deixe o seu comentário.

Read More

Sair de um aplicativo usando PhoneGap

O PhoneGap é um framework usado para desenvolver apps para sistemas operacionais móveis usando HTML, CSS e JS, o código abaixo faz com que o aplicativo seja fechado, ele foi testado no Android e funciona corretamente.

navigator.app.exitApp();

Qualquer dúvida deixe seu comentário.

Read More