Silverlight 4.0 é uma extensão da plataforma .NET para desenvolvimento de aplicações ricas para desktop, web e mobile. O documento discute ferramentas como Visual Studio e Blend, além de conceitos como layouts, data binding, comportamentos e interação com controles Silverlight.

1. Silverlight 4.0 Insights A tech overview & quick start Alexandre Marreiros, 2011

2. Agenda Alexandre Marreiros, 2011 UserControls Blend Design & Logic Data Binding Behaviours Referencias Contactos Problema Intro Tools Demo XAML Layout Canvas StackPanel Grid

3. Problema Alexandre Marreiros, 2011 Complexidade de criação de aplicações RIA. As frameworks tradicionais para a criação de aplicações RIA, estão tipicamente associadas a uma plataforma unica.

4. Intro Alexandre Marreiros, 2011

5. Intro Alexandre Marreiros, 2011 É uma extensão à plataforma .NET. É instalada através de um plugin gratuito. É transversal a diferentes browsers e plataformas Pode ser definida como uma plataforma, para desenvolvimento de aplicações ricas para desktop, web e mobile.

6. Intro Alexandre Marreiros, 2011 Originalmente chamava-se WPF/Everywhere. É suportado por quase todas as versõe dos sistemas operativos Windows e Macintosh OS. Suportado por todos os browsers actuais. Desenvolvido com o objectivo principal de trazer uma maior usabilidade e experiencia de utilização, a dispositivos mais fracos e à Web. Rapidamente se tem imposto também em aplicações LOB.

7. Tools Visual Studio 2008 com SP1 ou superior ( pode ser a versão express). Silverlight Tools para o Visual Studio. Expression Blend. Alexandre Marreiros, 2011

8. Demo Alexandre Marreiros, 2011 Silverlight App Visual Studio

9. Demo Alexandre Marreiros, 2011 Estrutura de ficheiros Silverlight App.XAML MainPage.XAML Assets e Views

10. Demo O Silverlight é uma tecnologia compilavel. Ao compilar uma aplicação silverlight obtemos um ficheiro do tipo XAP. Alexandre Marreiros, 2011

11. Demo Alexandre Marreiros, 2011 <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%"> <param name="source" value="ClientBin/SilverlightApplication2.xap"/> <param name="onError" value="onSilverlightError" /> <param name="background" value="white" /> <param name="minRuntimeVersion" value="4.0.50826.0" /> <param name="autoUpgrade" value="true" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration:none"> <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/> </a> </object>

12. XAML Alexandre Marreiros, 2011 Define uma hierarquia de objectos designada de object tree. Cada nó da arvore pode ser decomposto em templates. A existencia da descrição visual da hierarquia de objectos por meio de um ficheiro XAML, promove a interoperabilidade entre ferramentas de diferentes geneses.

13. Layout Para disposição dos componentes que constituem a user interface do silverlight, é utilizado um metodo baseado em modelos de layout. O sistema suporta a disposição de elementos sobre uma superficie de forma dinamica. Alexandre Marreiros, 2011

14. Layout Cada superficie de layout é ela mesma um control. As superficies dinamicas para disposição dinamica de controlos mais comuns em silverlight são: Canvas. StackPanel. Grid. Alexandre Marreiros, 2011

15. Canvas Alexandre Marreiros, 2011 Ui element Ui element Ui element <Canvas> <ButtonCanvas.Top="50“ Canvas.Left="50"Content="Button 1"FontSize="18"Width="150"Height="45"/> <ButtonCanvas.Top="70"Canvas.Left="80"Canvas.ZIndex="99"Content="Button 3"FontSize="18"Width="150"Height="45"/> 5:</Canvas> Ui element

16. Grid Alexandre Marreiros, 2011 Ui element Ui element <GridShowGridLines="True"> <Grid.RowDefinitions> <RowDefinitionHeight="60"/> <RowDefinitionHeight="60"/> <RowDefinitionHeight="60"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinitionWidth="175"/> <ColumnDefinitionWidth="175"/> <ColumnDefinitionWidth="175"/> </Grid.ColumnDefinitions> <ButtonGrid.Column="0"Grid.Row="0"Content="Button 1"/> </Grid>

17. StackPanel Alexandre Marreiros, 2011 Ui element Ui element Ui element Ui element Ui element <StackPanel> <ButtonMargin="10" Content="Button 1"Width="150"Height="5"/> <ButtonMargin="10"Content="Button 2"FontSize="18“ Width="150"Height="45"/> </StackPanel>

18. Demo Alexandre Marreiros, 2011 Silverlight Layouts

19. User Interface O silverlight disponibiliza a sua UI por intermedio de controlos. Através da criação de USER CONTROLS é possivel criar componetes reutilizaveis. Conceptualmente e a nivel de instanciação estes controlos são em tudo iguais aos do ASP.NET. Alexandre Marreiros, 2011

20. Demo Alexandre Marreiros, 2011 Silverlight User Controls

21. Blend Alexandre Marreiros, 2011

22. Design & Logic Alexandre Marreiros, 2011 Development Design Presentation Logic

23. Data Binding Alexandre Marreiros, 2011 Objecto .NET Objecto .NET Mecanismo de Binding

24. Data Binding O silverlight disponibiliza mecanismos de binding. Através das propriedades dos controlos; Através de XAML. <TextBlock Text=“{Binding codeBind, Mode= OneWay” /> Efectuando o binding de colections sobre data sources <ListBox ItemSource=“{Binding countryCollection, Mode=OneWay}”/> Alexandre Marreiros, 2011

25. Data Binding de objectos Alexandre Marreiros, 2011 XAML <grid x:name=“CustomerGrid”> <TextBlock x:Name=“Customer” Text=“@Binding CustomerText ”.../> </grid> XAML <grid x:name=“CustomerGrid”> <TextBlock x:Name=“Customer”.../> </grid> C# CustomerClass cust = getCustomers(); Customer.Text = cust.CustomerText; ... C# CustomerClass cust = getCustomers(); CustomerGrid.DataContext = cust; ... O Objecto Source deverá efectuar a implementação da propriedade INotiFyPropertyChanged

26. Demo Alexandre Marreiros, 2011 Silverlight Binding Objects

27. Data Binding através da rede O Silverlight disponibiliza a capacidade de Binding de DataSources externas ao servidor. Todo o Binding é Assincrono; Acessos Cross Domain carecem de autorização, ou relações de confiança. São fontes de dados validas: XML, JSON,RSS, WCF services Alexandre Marreiros, 2011

28. Data Binding através da rede Existem dois objectos distintos na plataforma silverlight destinados ao processamento de pedidos na rede: WebClient WebRequest Alexandre Marreiros, 2011

29. Data Binding através da rede WebClient Alexandre Marreiros, 2011 Void GetNetworkData(){ WebClient wc = new WebClient(); Uri req = new URI (“http://sapo.pt/noticias.htm”); wc.DownloadStringComplete += Processing(); wc.DownloadStringAsync(req); }

30. Data Binding através da rede WebRequest Alexandre Marreiros, 2011 Void GetNetworkData(){ WebRequest wr = WebRequest.Create (“http://sapo.pt/noticias.htm”); wr.BeginGetRequestStream(reqStream,wr); } Void reqStream(IAsyncResult ar){ WebRequest wr = (WebRequest)ar.AsyncState; Stream st = wr.EndGetRequestStream(ar); wr.BeginGetResponse(ProcessResponse,wr); } Void ProcessResponse(IAsyncResult ar){ //cria Web Request novamente //processamento do pedido }

31. Data Binding através da rede Alexandre Marreiros, 2011 XML parsing: Efectuado recorrendo aos objectos da plataforma .Net XMLReader, document ou Linq to XML. JSON: Recorrendo ao DataContractJsonSerializer do .net RSS: Efectuando o parsing do stream através de parser próprio. SyndicationFeed feed = SyndicationFeed.Load(stream)

32. Data Binding através da rede Alexandre Marreiros, 2011 Os pedidos CrossDomain so podem ser atendidos se o servidor o permitir. Por omissão os serviços Silverlight são considerados not trusted. Para saber mais sobre esta questão http://msdn.microsoft.com/en-us/library/cc197955(v=vs.95).aspx Workaround: Criar no servidor onde correra a aplicação silverlight um serviço que instancia o serviço remoto e que será consultado pelo silverlight.

33. Behaviours Eventos; Trigers; Actions; Behaviours; Alexandre Marreiros, 2011

34. Demo Alexandre Marreiros, 2011 Iteracting with silverlight controls

36. Programming C# 4.0: Building Windows, Web, and RIA Applications for the .NET 4.0 Framework (Animal Guide), Livroo’reilly

37. Pro Silverlight 4 in C# by Matthew MacDonald;