Este artigo tem como objetivo apresentar o App Studio da Microsoft, de forma a criar aplicações para Windows Phone 8.1 e Windows 8.1.

Há uns meses atrás a Microsoft lançou o Windows Phone App Studio Beta, serviço este que permite que qualquer pessoa sem conhecimentos de programação consiga criar aplicações para Windows Phone em apenas quatro passos: tenha uma ideia, adicione o conteúdo, escolha o estilo e use a aplicação. Recentemente, mais especificamente no evento //Build/ da Microsoft que se realizou no passado mês de Abril, foi lançada uma nova versão deste serviço e foi lançado também a versão Windows App Studio Beta, que para além das aplicações de Windows Phone, agora passamos a poder criar aplicações Windows 8.1 neste serviço.

O serviço pode ser acedido a partir de appstudio.windowsphone.com. E para começar a usá-lo é necessário uma conta Outlook, Live Id ou no caso de não ter uma conta destas deve usar uma conta que esteja associada ao Windows Live Id. Caso não esteja associado, pode associar qualquer endereço de email a este serviço na seguinte referência: http://bit.ly/1gywtmO ou na página de login, clicar em Inscrever.

Ao fazer o login pela primeira vez, irá aparecer um ecrã de permissões de acesso à sua conta, no entanto esta permissão pode vir a ser alterada mais tarde se assim o desejar. A seguir, terá que aceitar os temos de utilização do serviço e definir um utilizador (User) para a conta de email que está usar.

Neste momento estamos prontos para começar a criar aplicações! Para tal basta clicar no botão Start new project.

O App Studio fornece um conjunto de templates para ajudar os utilizadores na criação das aplicações. Estes templates não são mais que aplicações demos de temas específicos e mais usados.

De salientar que todos os templates são aplicações C#/XAML e estão disponíveis tanto para Windows Phone 8.1 como para Windows 8.1, exceto o Web App Template que apenas está disponível para Windows Phone.

Ao selecionar um template do tipo Empty App estamos a criar uma aplicação de raiz, do zero. Este template é muito utilizado em casos em que os outros templates não satisfaçam as necessidades do utilizador ou para o caso de utilizadores mais avançados que já tem alguma experiência com o App Studio. O utilizador irá definir todo o tipo de conteúdo, estilos e terá que usar toda a sua criatividade para obter uma “great app”. No caso do template Web App Template o utilizador irá também criar a aplicação do zero, mas neste caso é dado um URL de base que será o ponto inicial da aplicação e terá acesso a alguns botões na AppBar, este template é o ideal para site que se adaptam a dispositivos móveis. Por outro lado, os outros templates disponíveis já permitem ao utilizador ter um guia de orientação na aplicação que está a construir e apenas terá que alterar os dados e customizar a aplicação a seu gosto. Note-se que neste caso o utilizador poderá mudar radicalmente toda a aplicação inicialmente criada pelo template.

Vejamos agora na prática como podemos criar aplicações com estes templates.

Contoso Ltd Template

Depois de selecionar um template aparece um ecrã onde podemos visualizar a aplicação numa espécie de simulador de Windows Phone 8.1 e Windows 8.1. No entanto, não é permitido a navegação para a páginas de detalhe.

Neste ecrã já se consegue ficar com uma ideia da aplicação sem a ter que instalar no dispositivo. Vejamos então as configurações deste template.

Conteúdo (Content)

A primeira página apresenta o nome da aplicação e o logotipo da mesma (no topo do lado esquerdo) e apresenta a definição do conteúdo da aplicação, que é constituído por cinco secções:

• About us é uma secção do tipo HTML
• Catalog é uma secção do tipo coleção dinâmica
• Team é uma secção do tipo coleção dinâmica
• News é uma secção do tipo Bing
• Contact us é uma secção do tipo Menu, que contém ações de menus.

No máximo podem ser definidas seis secções para a aplicação, e depois de definida cada secção é possível editar, apagar ou mover de posição de forma a ordenar da melhor forma.

Para cada secção é possível escolher uma das seguintes opções:

• RSS – adiciona a informação baseada no feed fornecido pela referência do rss
• HTML – permite adicionar uma página estática que incluiu código HTML permitindo criar conteúdo personalizado
• Youtube – lista de vídeos com base no identificador do utilizador no Youtube ou numa palavra de pesquisa
• Flickr – lista um conjunto de fotografias fornecidas com base no Flickr UserId ou numa palavra de pesquisa
• Bing – lista um conjunto de referências web
• Facebook – lista o feed da página do facebook com base no identificador da página
• Menu – permite criar uma lista de ações de menu que podem recorrer a outras aplicações para ações diversas (por exemplo: indicar a morada da empresa e usar o Here Maps, indicar o número de telemóvel para efetuar chamadas)
• Collection – permite definir dados estáticos ou dinâmicos. No caso de dados dinâmicos é permitido possível importar/exportar dados de um ficheiro CSV.

Uma futura funcionalidade será a fonte de dados twitter, que neste momento não está disponível no App Studio, mas que foi mencionada na sessão sobre o tema que decorreu no //Build/.

O App Studio já apresenta uma boa lista de fontes de dados, permitindo o utilizador criar aplicações interessantes, no entanto, o facto de se basear em feeds existe algumas limitações no número de dados disponíveis e na qualidade da apresentação dos mesmos.

Tema (Theme)

Nesta página podemos definir a imagem ou cor de fundo da aplicação, definir a cor do texto e a cor da Application bar. Existindo três opções, customizado (usando a imagem de fundo), a preto (mais conhecido por Dark Style) ou a branco (mais conhecido por Light Style). O botão Select permite definir o estilo pretendido e depois disso é preciso fazer Save para guardar as configurações. Note-se que ao lado do texto Background Image existe um botão que permite fazer o upload da imagem de fundo.

Mosaicos (Tiles)

No separador Tiles, podemos definir que tipo de mosaicos (tiles) pretendemos para a aplicação, existindo três tipos: Flip Template, Cycle Template e Icon Template. Neste caso foi selecionado o Cycle Template e definido as imagens e texto pretendido. 

No separador Splash & Lock, são definidas as imagens para o splash screen das aplicações para Windows Phone 8.1 e para Windows 8.1 e o lock screen do Windows Phone.

Apesar de esta página não mencionar o tamanho das imagens, quando fazemos Edit aparece um ecrã que nos informa sobre o tamanho possível de cada imagem.

Publicar (Publish)

Nesta página é definida a língua usada pela aplicação, atualmente só é possível definir uma. É possível definir o título, a descrição da aplicação, permitir incluir a página Acerca de (About) e incluir publicidade na aplicação (que obriga a configurações finais no código). E ainda é possível associar a aplicação à Loja do Windows, que por sua vez requer que seja reservado um nome para a aplicação na Loja.

Depois de todas as configurações é possível finalizar a aplicação clicando no botão Finish.

Finalizar (Finish)

Nesta página podemos visualizar as aplicações para cada target (não sendo possível navegar) e é possível gerar a aplicação para assim obtermos o pacote da aplicação para instalar em cada dispositivo ou então obter o código fonte. Ao clicar no botão Generate obtemos um ecrã onde podemos escolher qual a aplicação que pretendemos gerar.

Podemos gerar para ambos os casos, que implica duas gerações diferentes. No entanto, para um utilizador mais experiente e que esteja a usar o Visual Studio para testar a sua aplicação, recomendo que seja feita a geração para Windows 8.1 porque o código gerado é uma solução Universal app que é constituído pelo projeto da aplicação Windows Phone 8.1, pelo projeto da aplicação Windows 8.1, por um projeto partilhado entre os projetos anteriores e neste caso ainda contém um projeto do tipo portable class library com toda a estrutura de dados.

Depois de gerado temos disponível o pacote da aplicação que nos permite testar a aplicação no dispositivo ou obter o código fonte e testar no simulador ou no dispositivo usando o Visual Studio. Note-se que um utilizador que não tenha conta de Developer e por essa razão não tem o dispositivo desbloqueado, terá que instalar o certificado fornecido e só depois poderá instalar a aplicação no dispositivo usando para tal o QRCode da aplicação ou a referência web fornecida. É possível partilhar a aplicação nas redes sociais e por email.

Ao gerar a aplicação para Windows 8.1 obtemos o seguinte ecrã:

Onde podemos obter o pacote da aplicação Windows 8.1 e depois usando PowerShell podemos instalar a aplicação num PC com Windows 8.1.

Depois desta geração, ao obter o código fonte vamos obter uma solução Universal app, que terá a seguinte estrutura:

Com o código fonte cada uma das aplicações pode ser estendida de forma a adicionar novas funcionalidades, tais como:

• Permitir mais do que uma língua
• Permitir publicidade na aplicação
• Suporte para twitter
• Alterar a interface com o utilizador

 Entre outras…

Web App Template

Com já foi referido, este template só está disponível para aplicações de Windows Phone e trata-se uma aplicação web. Vejamos então na prática como usar este template.

Ao selecionar o Web App Template iremos ter à seguinte página:

Como se pode ver, o conteúdo desta aplicação resume-se à referência de base da aplicação, que não é mais que um website que supostamente foi desenhado para dispositivos móveis.

Neste exemplo, está-se a usar o endereço m.microsoft.com mas poderíamos utilizar por exemplo: booking.com, m.sapo.pt, m.vodafone.pt, entre outras referências…

As definições para Theme, Tiles e Publish são iguais ao que foi apresentado no template Contoso Ldt.

Ao clicar em Finish iremos para a página de geração do pacote da aplicação e do código fonte. E ao clicar em Generator iremos ter o seguinte ecrã:

Com já tinha referido, apenas iremos gerar a aplicação para Windows Phone. E como podemos ver no template do Contoso Ltd, neste caso também vamos ter disponível o certificado para instalar no dispositivo, a referência web e o QRCode do pacote da aplicação, partilha nas redes sociais e via email e o código fonte.

O resultado final da aplicação, usando a referência de base m.sapo.pt, é:

As aplicações geradas pelo App Studio devem ser testadas em vários dispositivos para garantir que a aplicação está a funcionar correctamente e está de acordo com o que o utilizador definiu. Só depois de terminarem os testes é que a aplicação deve ser submetida na loja. De relembrar que na página de Publish tínhamos a opção de ligar a aplicação à loja, e na página final depois da geração da aplicação é nos fornecido a referência dos pacotes para submeter na loja. As aplicações geradas pelo App Studio são submetidas ao mesmo processo de certificação que uma aplicação desenvolvida por um programador.

Os utilizadores mais avançado, que pretendam extender a aplicação dando novas funcionalidades não tem como “submeter” essas alterações no site do App Studio, para que numa nova versão da aplicação no App Studio essas alterações sejam tidas em conta. A solução passa por fazer um “merge” entre o código de fonte alterado e a nova versão da aplicação. E a partir do momento que o código fonte é alterado, o utilizador é que é responsável pela criação do pacotes da aplicação utilizando o Visual Studio.

Para terminar, deixo uma referência sobre o este tema que podem consultar em Building apps without code using AppStudio, onde é possível encontrar um conjunto de artigos, vídeo e fórum sobre o App Studio.

Em conclusão, conclui-se que o App Studio apresenta uma solução rápida no desenvolvimento de aplicações tanto para Windows Phone 8.1 como para o Windows 8.1, sendo possível extender as funcionalidades da aplicação através do código fonte gerado. De salientar que apesar de todo o automatismo associado, existem algumas limitações que devem ser trabalhadas de futuro para que as aplicações geradas pelo App Studio apresentem ainda mais qualidade.