Instalando e Configurando o JIL SDK. Crie seu primeiro widget com a ferramenta.
1 gostou323 visualizações
O documento descreve como instalar e usar o JIL SDK para criar o primeiro widget "Hello World". Explica que o JIL é uma joint venture entre grandes operadoras para criar padrões de widgets móveis e que o SDK é baseado no Eclipse e gera arquivos HTML, CSS e JavaScript para executar widgets em emuladores. Demonstra a criação de um projeto simples "HelloWorld" com texto e imagem para executar no simulador.
![Instalando e Configurando o JIL SDK. Crie seu primeiro widget com a ferramenta.1 - IntroduçãoNeste pequeno tutorial vamos aprender como instalar e criar nosso primeiro widget através do JIL Software Development Kit. O leitor deve estar se perguntando: Pra início de história, quem é JIL. A JIL (Joint Innovation Lab) é uma Joint Venture entre as operadoras Vodafone, Verizon Wireless, China Mobile e Softbank Mobile.O primeiro projeto do grupo foi criar um padrão de criação para widgets, que já teve seus primeiros adeptos. Neste HYPERLINK \"
http://www.tinews.com.br/news/2009/10/22/principais-fabricantes-de-celulares-apoiam-a-iniciativa-da-joint-innovation-lab-jil/\"
link da internet podemos ler o seguinte parágrafo: A Joint Innovation Lab (JIL) anunciou hoje que as líderes de fabricação de aparelhos celulares, LG Electronics (LG), Research In Motion (RIM), Samsung Electronics Co., Ltd. (Samsung) e Sharp Corporation (Sharp) apoiarão a especificação do widget da JIL em futuros aparelhos móveis a partir do primeiro trimestre de 2010. O lançamento de uma ampla série de celulares compatíveis com o widget da JIL permitirá que os desenvolvedores criem aplicativos que podem ser lançados para os clientes através das empresas sócias da JIL, China Mobile, SOFTBANK, Verizon Wireless e Vodafone, que têm uma base de usuários combinada de mais de um bilhão na África, Ásia, Europa e América do Norte.Mesmo que você more na América do Sul, e esteja fora da atuação das operadoras do JIL, é possível criar seus widgets e disponibilizar na futura app store que o grupo pretende criar. Ou seja, suas portas para o mundo estarão abertas. Depois das apresentações formais, podemos falar sobre o JIL Widget SDK Version 1.0. Seu objetivo, assim como todos SDK, é de fornecer uma maneira fácil e rápida de criar seus projetos. O SDK é um porting da IDE Eclipse. A ferramenta também traz alguns emuladores. Porém, pelo menos na minha máquina eles executaram extremamente lentos. Mas, para isentar um pouco a JIL da culpa, eu tenho outros SDK instalados (como o Android SDK e alguns emuladores da BlackBerry) e eles também sofrem bastante com a lentidão. Também, o JIL SDK é parte do ecossistema global que envolve o JIL Developer Site [http://www.jil.org]. Este site permite que você cadastre-se e participe no JIL developer system. Uma vez que você é um membro do JIL Developer Site, você pode submeter seus widget´s para revisão e publicação dos download no site do JIL Widget. JIL Widgets podem ser monetizados. Como desenvolvedor, você pode ser pago pelo widget que você criou quando o widget é baixado. Veja a Figura 1, ela mostra a página de publicação de widget´s, veja o destaque em vermelho.Figura 1: Página de publicação de widget´s no JIL Developer Site2 – Instalação do SDKAgora vamos partir para a instalação do SDK. O primeiro passo é acessar o JIL Developer Site, cadastrar-se e baixar o arquivo de instalação, no meu caso o jil_sdk_windows_v1.1_BETA2.exe. Posteriormente, basta dar um duplo-clique no arquivo. Uma tela de wizard como a da Figura 2 deve aparecer.Figura 2: Wizard, passo 1Basta dar Next, o wizard passa para a segunda tela. Veja a Figura 3. Figura 3: Wizard, passo 2Basta aceitar a licença e clicar em Next. O wizard passa para a terceira tela, veja na Figura 4. Figura 4: Wizard, passo 3Nesta tela, escolhemos a pasta onde a instalação irá ficar, no meu caso, deixei o valor padrão mesmo. Clique Next e receba a tela mostrada na Figura 5.Figura 5: Wizard, passo 4.Nesta parte do wizard, configuramos o nome que aparecerá no menu iniciar do seu Windows, infelizmente não consegui testar no Linux para ver se esta tela aparece ou não. Em todo caso, não é muito relevante para a instalação. Clique em Next e vamos para o quinto passo. Veja a Figura 6.Figura 6: Wizard, passo 5.Deseja criar um ícone no desktop? Se sim, marque o checkbox. Dê Next e vamos prosseguir.O próximo passo do wizard (Figura 7) apenas mostra as configurações definidas até o momento da instalação e pede para você confirmar e seguir a instalação ou, voltar nas telas anteriores e redefinir alguns parâmetros da instalação. Verifique os dados e vá para a próxima tela, mostrada na Figura 8.Figura 7: Wizard, passo 6.Figura 8: Wizard, passo 7.Como você pode ver na Figura 8, o processo de instalação do SDK começa nesse momento. Se tudo ocorrer bem, a barra verde chegará ao final e você pode começar a programar para o JIL e, quem sabe, ganhar seus milhões europeus ou americanos. A Figura 9 informa que a instalação ocorreu com sucesso. Figura 9: Wizard, passo 8.3 – Criando seu primeiro widgetAo iniciar o SDK, você perceberá que você iniciou um puro e simples Eclipse. Veja na Figura 10.Figura 10: Tela incial do SDK.Porém, ao clicarmos na opção File -> New, encontramos a opção JIL 1.0 Widget Project, escolha esta opção (Veja a Figura 11). Figura 11: Tela incial do SDK (b).Receberemos outro wizard, conforme a Figura 12.Figura 12: Wizard para criação do projeto.Este wizard é super simples, no campo Project Name informamos o nome que queremos dar ao nosso projeto, chamei de HelloWorld. Abaixo, temos a opção de criar um novo projeto do início (Create na empty Project for a new widget development) ou, criar um projeto de fontes já existentes (Create a widget Project form na existing widget package). Finalmente, escolhemos o local onde o projeto será criado. No meu caso, deixei a opção Use Default Location marcada. Clique Finish. Você perceberá que seu projeto foi criado com todos os arquivos necessários. Veja a Figura 13.Figura 13: Projeto criado.Antes de explicar o fonte, vamos executar nossa recente criação. Selecione Run -> Run Configuration. Você receberá um wizard, como o mostrado na Figura 14. Marque a opção Widget Application e selecione New Launch Configuration. Nesta nova configuração, informe um nome e o projeto que será executado. Veja a Figura 15. Depois disso é só dar um Accept e um Run. Veja o resultado de nosso esforço na Figura 16.Figura 14: Wizard para configuração de execução do widget.Figura 15: Wizard para configuração de execução do widget (b).Figura 16: HelloWorld sendo executado no simulador.Em artigos futuros poderemos decifrar todo código, porém, neste artigo, vamos nos deter apenas a entender de forma básica oque o SDK criou. Veja a Figura 17. Um widget nada mais é que um programa web que pode ser “entendido” como um aplicativo stand-alone no dispositivo. Sendo assim, sempre teremos um arquivo .html, um .css e um .js. Teremos também imagens. No exemplo do HelloWorld temos duas. Teremos um arquivo XML de configuração e, por fim, um .wgt que será distribuído.Figura 17: Arquivos gerados pelo SDK para o projeto HelloWorld.Vamos ver o conteúdo dos três principais arquivos, veja as Listagens 1, 2 e 3.Listagem 1 – HelloWorld.html.HelloWorld Hello Widget! Listagem 2 – HelloWorld.css#front {position: absolute;background-image: url(“Default.png”); top: 0px;left: 0px;width: 235px;height: 158px;}#hello {position: absolute;color: white;top: 65px;left: 45px;width: 180px;height: 50px;font: 24px “verdana”;}HelloWorld.jsfunction showFront() {}function showBack() {}Para os desenvolvedores web deve ter ficado fácil, mas, mesmo para programadores Java ME, Symbian, Android, dentre outros, é muito fácil entender a lógica de um widget.4 – ConclusãoAinda é cedo para apontar o JIL como um grande futuro a ser investido, porém, não custa nada brincarmos um pouco com o SDK (em uma máquina decente) e ficarmos preparados. Confesso que fiquei com muita vontade de começar a criar alguns widgets e colocar a venda no site de desenvolvedores do JIL, quem quiser me acompanhar, seja bem vindo.](https://image.slidesharecdn.com/1-091109133432-phpapp01/85/Instalando-e-Configurando-o-JIL-SDK-Crie-seu-primeiro-widget-com-a-ferramenta-1-320.jpg)
Instalando e Configurando o JIL SDK. Crie seu primeiro widget com a ferramenta.
- 1. Instalando e Configurando o JIL SDK. Crie seu primeiro widget com a ferramenta.1 - IntroduçãoNeste pequeno tutorial vamos aprender como instalar e criar nosso primeiro widget através do JIL Software Development Kit. O leitor deve estar se perguntando: Pra início de história, quem é JIL. A JIL (Joint Innovation Lab) é uma Joint Venture entre as operadoras Vodafone, Verizon Wireless, China Mobile e Softbank Mobile.O primeiro projeto do grupo foi criar um padrão de criação para widgets, que já teve seus primeiros adeptos. Neste HYPERLINK \" http://www.tinews.com.br/news/2009/10/22/principais-fabricantes-de-celulares-apoiam-a-iniciativa-da-joint-innovation-lab-jil/\" link da internet podemos ler o seguinte parágrafo: A Joint Innovation Lab (JIL) anunciou hoje que as líderes de fabricação de aparelhos celulares, LG Electronics (LG), Research In Motion (RIM), Samsung Electronics Co., Ltd. (Samsung) e Sharp Corporation (Sharp) apoiarão a especificação do widget da JIL em futuros aparelhos móveis a partir do primeiro trimestre de 2010. O lançamento de uma ampla série de celulares compatíveis com o widget da JIL permitirá que os desenvolvedores criem aplicativos que podem ser lançados para os clientes através das empresas sócias da JIL, China Mobile, SOFTBANK, Verizon Wireless e Vodafone, que têm uma base de usuários combinada de mais de um bilhão na África, Ásia, Europa e América do Norte.Mesmo que você more na América do Sul, e esteja fora da atuação das operadoras do JIL, é possível criar seus widgets e disponibilizar na futura app store que o grupo pretende criar. Ou seja, suas portas para o mundo estarão abertas. Depois das apresentações formais, podemos falar sobre o JIL Widget SDK Version 1.0. Seu objetivo, assim como todos SDK, é de fornecer uma maneira fácil e rápida de criar seus projetos. O SDK é um porting da IDE Eclipse. A ferramenta também traz alguns emuladores. Porém, pelo menos na minha máquina eles executaram extremamente lentos. Mas, para isentar um pouco a JIL da culpa, eu tenho outros SDK instalados (como o Android SDK e alguns emuladores da BlackBerry) e eles também sofrem bastante com a lentidão. Também, o JIL SDK é parte do ecossistema global que envolve o JIL Developer Site [http://www.jil.org]. Este site permite que você cadastre-se e participe no JIL developer system. Uma vez que você é um membro do JIL Developer Site, você pode submeter seus widget´s para revisão e publicação dos download no site do JIL Widget. JIL Widgets podem ser monetizados. Como desenvolvedor, você pode ser pago pelo widget que você criou quando o widget é baixado. Veja a Figura 1, ela mostra a página de publicação de widget´s, veja o destaque em vermelho.Figura 1: Página de publicação de widget´s no JIL Developer Site2 – Instalação do SDKAgora vamos partir para a instalação do SDK. O primeiro passo é acessar o JIL Developer Site, cadastrar-se e baixar o arquivo de instalação, no meu caso o jil_sdk_windows_v1.1_BETA2.exe. Posteriormente, basta dar um duplo-clique no arquivo. Uma tela de wizard como a da Figura 2 deve aparecer.Figura 2: Wizard, passo 1Basta dar Next, o wizard passa para a segunda tela. Veja a Figura 3. Figura 3: Wizard, passo 2Basta aceitar a licença e clicar em Next. O wizard passa para a terceira tela, veja na Figura 4. Figura 4: Wizard, passo 3Nesta tela, escolhemos a pasta onde a instalação irá ficar, no meu caso, deixei o valor padrão mesmo. Clique Next e receba a tela mostrada na Figura 5.Figura 5: Wizard, passo 4.Nesta parte do wizard, configuramos o nome que aparecerá no menu iniciar do seu Windows, infelizmente não consegui testar no Linux para ver se esta tela aparece ou não. Em todo caso, não é muito relevante para a instalação. Clique em Next e vamos para o quinto passo. Veja a Figura 6.Figura 6: Wizard, passo 5.Deseja criar um ícone no desktop? Se sim, marque o checkbox. Dê Next e vamos prosseguir.O próximo passo do wizard (Figura 7) apenas mostra as configurações definidas até o momento da instalação e pede para você confirmar e seguir a instalação ou, voltar nas telas anteriores e redefinir alguns parâmetros da instalação. Verifique os dados e vá para a próxima tela, mostrada na Figura 8.Figura 7: Wizard, passo 6.Figura 8: Wizard, passo 7.Como você pode ver na Figura 8, o processo de instalação do SDK começa nesse momento. Se tudo ocorrer bem, a barra verde chegará ao final e você pode começar a programar para o JIL e, quem sabe, ganhar seus milhões europeus ou americanos. A Figura 9 informa que a instalação ocorreu com sucesso. Figura 9: Wizard, passo 8.3 – Criando seu primeiro widgetAo iniciar o SDK, você perceberá que você iniciou um puro e simples Eclipse. Veja na Figura 10.Figura 10: Tela incial do SDK.Porém, ao clicarmos na opção File -> New, encontramos a opção JIL 1.0 Widget Project, escolha esta opção (Veja a Figura 11). Figura 11: Tela incial do SDK (b).Receberemos outro wizard, conforme a Figura 12.Figura 12: Wizard para criação do projeto.Este wizard é super simples, no campo Project Name informamos o nome que queremos dar ao nosso projeto, chamei de HelloWorld. Abaixo, temos a opção de criar um novo projeto do início (Create na empty Project for a new widget development) ou, criar um projeto de fontes já existentes (Create a widget Project form na existing widget package). Finalmente, escolhemos o local onde o projeto será criado. No meu caso, deixei a opção Use Default Location marcada. Clique Finish. Você perceberá que seu projeto foi criado com todos os arquivos necessários. Veja a Figura 13.Figura 13: Projeto criado.Antes de explicar o fonte, vamos executar nossa recente criação. Selecione Run -> Run Configuration. Você receberá um wizard, como o mostrado na Figura 14. Marque a opção Widget Application e selecione New Launch Configuration. Nesta nova configuração, informe um nome e o projeto que será executado. Veja a Figura 15. Depois disso é só dar um Accept e um Run. Veja o resultado de nosso esforço na Figura 16.Figura 14: Wizard para configuração de execução do widget.Figura 15: Wizard para configuração de execução do widget (b).Figura 16: HelloWorld sendo executado no simulador.Em artigos futuros poderemos decifrar todo código, porém, neste artigo, vamos nos deter apenas a entender de forma básica oque o SDK criou. Veja a Figura 17. Um widget nada mais é que um programa web que pode ser “entendido” como um aplicativo stand-alone no dispositivo. Sendo assim, sempre teremos um arquivo .html, um .css e um .js. Teremos também imagens. No exemplo do HelloWorld temos duas. Teremos um arquivo XML de configuração e, por fim, um .wgt que será distribuído.Figura 17: Arquivos gerados pelo SDK para o projeto HelloWorld.Vamos ver o conteúdo dos três principais arquivos, veja as Listagens 1, 2 e 3.Listagem 1 – HelloWorld.html.HelloWorld Hello Widget! Listagem 2 – HelloWorld.css#front {position: absolute;background-image: url(“Default.png”); top: 0px;left: 0px;width: 235px;height: 158px;}#hello {position: absolute;color: white;top: 65px;left: 45px;width: 180px;height: 50px;font: 24px “verdana”;}HelloWorld.jsfunction showFront() {}function showBack() {}Para os desenvolvedores web deve ter ficado fácil, mas, mesmo para programadores Java ME, Symbian, Android, dentre outros, é muito fácil entender a lógica de um widget.4 – ConclusãoAinda é cedo para apontar o JIL como um grande futuro a ser investido, porém, não custa nada brincarmos um pouco com o SDK (em uma máquina decente) e ficarmos preparados. Confesso que fiquei com muita vontade de começar a criar alguns widgets e colocar a venda no site de desenvolvedores do JIL, quem quiser me acompanhar, seja bem vindo.