Hoje em dia, as Smart TVs estão cada vez mais presentes no dia a dia. E muito por isso, gosto de pesquisar e aprender formas de programar sua interface e até criar apps que rodassem em seu ambiente. Nessas pesquisas, descobri que é fácil e simples o desenvolvimento para Smart TV, veja só:
1º Para criar apps para Smart TV você usará em primeiro lugar HTML, CSS e Ajax/JavaScript.
2º O modelo que vou usar será o da Samsung (que é a TV que mais tem suporte para o desenvolvimento). Você usará Eclipse para criação de suas apps e baixará o SDK no próprio site da Samsung Developers.
3º A instalação do SDK e dos emuladores para Smart TVs é bem fácil, mas você precisa ter a máquina virtual Java em seu PC.
Iniciando
1º Execute o Eclipse como administrador para facilitar a execução do emulador quando você rodar o app..
2º quando o Eclipse estiver aberto você irá em File > New > Project para criar um novo projeto.
3º Ai então você vai selecionar a opção de “Samsung Smart TV JavaScript App Project” porque essa opção permite que você crie apps com Ajax(Javacript) para o comportamento de sua app e CSS + HTML para interface.
4º Em seguida dê nome para sua app, e escolha a resolução da tela.
5º Pronto, se conseguiu fazer tudo direitinho você já pode começar a desenvolver sua app, no lado esquerdo você irá se deparar com as seguintes pastas, essas pastas são responsáveis pela organização do conteúdo de sua app, as mais importantes são “app” e “index.html”.
6º Na pasta “app” ficam as pastas “stylesheets” e “javascript” com os arquivos “Main.css” e “Main.js” respectivamente. Em Main.css fica o conteúdo de CSS da app (responsável pelo estilo da app) e em Main.js fica o desenvolvimento lógico (programação) do comportamento da app, onde você usa Ajax para definir as ações da app, e em “index.html” fica os componentes em html para você dar vida a sua app. Na pasta icon é onde você armazena os ícones usados.
7º Então vamos a nossa demo básica: dê um duplo clique em “index.html”. Insira seu código HTML nesse local. Vamos dar um “Hello World” apenas, somente para que vocês peguem noção.
8º então nesse trecho insira o seguinte código:
9º Então você vai dar um duplo clique no arquivo Main.css para estilizar a escrita, e inserir o seguinte trecho:
(você usa a #label para pegar os elementos html e manipula-los com CSS)
10º Feito isso agora você irá salvar e executar, com o botão direito você clica na pasta raiz do projeto e segue em “Samsung Smart TV SDK” e depois em “Run”.
11º Irá levar um tempo se for a primeira vez, mas ao terminar você verá essa tela:
Agora você pode usar sua imaginação e criar a App que desejar apenas com HTML, CSS e Ajax, no próximo tutorial irei introduzir como usar Ajax no desenvolvimento da App.