Durante o Mix10 pudemos ver um pouco mais sobre o desenvolvimento para o Windows Phone 7 que tem como base o silverlight.
O mais envolvente nisso é que o mesmo Silverlight que já conhecemos não haverá uma versão especifica para Windows Phone 7 é "apenas" Silverlight.
Para começarmos a desenvolver para Windows Phone 7 vamos precisar de :
Windows Phone Developer Tools CTP
VS 2010 RC tools for Silverlight 4
Silverlight 4 RC
Após o download e instalação do Windows Phone Developer Tools CTP voce tera o Visual Studio 2010 Express for Windows Phone.
O tutorial a seguir mostrara como construir de forma simples uma aplicação para visualizar post’s de um determinado usuário do twitter.
Essa demo foi demonstrada durante o mix10 então quem não teve a oportunidade de acompanhar ai esta.
Figura 1: Visual Studio 2010 Express for Windows Phone.
Vamos iniciar um novo projeto do tipo Windows Phone Application,neste caso estou chamando de TwitterPhone7.
Figura 2:Novo Projeto Windows Phone Application.
Perceba que ele já trás a interface do Windows Phone.
Sua estrutura inicial e composta por dois Grid’s ,no primeiro encontramos dois TextBlock:
1. MY APPLICATION
2. page title
No segundo Grid iremos adicionar o conteúdo de nossa aplicação.
Figura 3:Interface Inicial.
Vamos começar por nossa interface,vamos adicionar um Button e um TextBox.Aproveitamos também para colocarmos o nome de nossa aplicação no TextBlock da parte superior.
Figura 4 : Incluindo controles.
No Grid inferior vamos adicionar um ListBox.
Figura 5 : Incluindo ListBox.
Agora vamos trabalhar no MainPage.cs,repare que ele já trás configurado suporte para que sua aplicação funcione nos dois modos de orientação através do "SupportedOrentations".
Em seguida vamos criar o evento de nosso botão.
Figura 6 : MainPage.cs
Dentro de nosso evento click vamos instanciar um WebClient,ele será responsável por importar os Feeds do Twitter.
Apos instanciar o WebClient vamos criar o evento DonloadStringCompleted que será usado mais a diante,em seguida fazemos a chamada do método DownloadStringAsync onde iremos passar como parâmetro a Uri da api do Twitter juntamente com o nome do usuário o qual vamos pesquisar.Ele ira rertonar um XML com os post mais recentes.
Figura 7 : Configurando evento Click.
Como nosso método retorna um XML iremos usar o LinqToXml para que possamos fazer nossas consultas de maneiras mas simples.
Vamos então adicionar a referencia do LinqToXml ao nosso projeto.
Figura 8: Adicionando Reference System.Xml.Linq.
Não esqueça de adicioná-la também na MainPage.cs : Using System.Xml.Linq;
Feito isso vamos criar nossa classe com os itens que iremos trabalhar em nossa aplicação:
· UserName
· Mensage
· ImageSource
Figura 9: TwitterItem
Lembram-se de nosso evento DonloadStringCompleted,iremos agora implementá-lo.
Nossa Consulta ira retornar os elementos necessários para nossa aplicação,ImageSource,Message e Username.A partir dai preenchemos nosso listBox.
Figura 10 : DonloadStringCompleted
Voltando a nossa interface vamos ajustar nosso ListBox.
Para isso vamos adicionar um ItemTemplate em nosso ListBox.
Achei esse tipo de visualização mais amigável mas isso não impede que você faça a interface de sua maneira.
Figura 11: ListBox Template
Executando nossa aplicação o visual Studio ira abrir o Windows Phone Emulator ,ele já prevê também o Windows Phone Device caso você possua o dispositivo para testar sua aplicação.
No TextBox digite o usuário no qual você queira ver os últimos post e clique em pesquisar(Obs.:neste caso o mouse simula o toque do dedo na tela do dispositivo)
Figura 12 : Aplicação Funcionando
Testando aplicação em modo "paisagem".
Figura 13: Orientation.
Perceba que nossa aplicação encontra-se no menu do dispositivo.
Figura 14 : Aplicação no Menu do Windows Phone 7.
Esse tutorial é apenas uma pequena amostra do que esta por vir nos próximos meses.
Espero que tenham gostado até a proxima.
Escrevo e participo atualmente nas seguintes comunidades e blogs:
· www.codificando.net
· WWW.blog.ronnin.com.br
· www.desenvolvendoparaweb.net
· www.silverlightbrasil.ning.com
Siga-me : @andersoncastro