1 / 78

Windows Presentation Foundation

Windows Presentation Foundation. Microsoft. Luis Guerrero. Developer Advisor. Blog : http://www.luisguerrero.net. Blog : http://geeks.ms/blogs/luisguerrero. Email : lguerrero@plainconcetps.com. Silverlight. Microsoft. Luis Guerrero. Developer Advisor.

prentice
Download Presentation

Windows Presentation Foundation

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Windows PresentationFoundation Microsoft Luis Guerrero DeveloperAdvisor Blog: http://www.luisguerrero.net Blog: http://geeks.ms/blogs/luisguerrero Email: lguerrero@plainconcetps.com

  2. Silverlight Microsoft Luis Guerrero DeveloperAdvisor Blog: http://www.luisguerrero.net Blog: http://geeks.ms/blogs/luisguerrero Email: lguerrero@plainconcetps.com

  3. ¿WPF? • ¿Que es WPF? • Experiencia previa • Windows Forms • ¿Donde estamos?

  4. .NET Framework technologies .NET Framework 2.0 • Common language runtime (CLR) and base class libraries. • Support for generic types and methods. • Compilers for C#, Visual Basic, C++, and J#. • ADO.NET. • ASP.NET. • Windows Forms. • Web services.

  5. .NET Framework technologies .NET Framework 2.0 SP1 • Updates .NET Framework 2.0 assemblies

  6. .NET Framework technologies .NET Framework 3.0  • Windows Presentation Foundation (WPF). • Windows Communications Foundation (WCF). • Windows Workflow Foundation (WF). • Cardspace.

  7. .NET Framework technologies .NET Framework 3.0 SP1 • Updates .NET Framework 3.0 assemblies

  8. .NET Framework technologies .NET Framework 3.5 • Language Integrated Query (LINQ). • New compilers for C#, Visual Basic, and C++. • ASP.NET AJAX.

  9. .NET Framework technologies .NET Framework 3.5 SP1 • ASP.NET Dynamic Data. • ADO.NET Entity Framework. • Data provider support for SQL Server 2008. • Support for the .NET Framework Client Profile, a setup package that includes only assemblies used by client applications. • Support for PixelShaders in WPF. • Improved performance in WPF.

  10. Silverlight Platform • Corepresentationframework • .NET Framework for Silverlight • Installer and updater

  11. ¿Qué es WPF? WPF esunatecnologiaparadesarrollar la siguientegeneración de aplicaciones en Windows y en la web, utilizandotoda la potencia del hardware y creandolasmejoresexperiencias de usuario (UX).

  12. demo

  13. Silverlight Platform

  14. Silverlight Silverlight es un plug-in para navegadores que permite crear aplicaciones RIA Características • Animaciones • Gráficos vectoriales • Reproducción de vídeo y audio. • CLR / .NET • Multinavegador • Multisistema

  15. Silverlight Platform • Corepresentationcomponents • Input • UI rendering • Media • Controls • Layout • Data binding • DRM • XAML

  16. Silverlight Platform • .NET Framework for Silverlight • Data • LINQ • LINQ to XML • Base classlibrary • WCF (Windows CommunicationFoundation • CLR (commonlanguageruntime) • WPF (Windows PresentationFoundation) controls • DLR (dynamiclanguageruntime)

  17. Silverlight Platform • Almacenamiento aislado (Isolatedstorage) • Programación asincrona • Administración de ficheros (File Open) • Interacción entre el control y HTML • Serializacion (JSON y XML) • Packaging (xap) • XML

  18. Herramientas • Visual Studio 2008 + SP1 • Microsoft Expression • Blend + SP1 • Desing • Encoder • MSDN 2008 SP1 • Visual Studio Tools for Silverlight • Silverlight 2 SDK • Se pueden descargar de: • http://www.microsoft.com/downloads/

  19. ¿Qué es WPF? • Markup and Code-Behind • Applications • Controls • Input and Commanding • Layout • Data Binding • Graphics • Animation • Media • Text and Typography • Documents

  20. ¿Qué es Silverlight? • Markup and Code-Behind • Applications • Controls • Layout • Data • Data Binding • Graphics • Animation • Media

  21. StandaloneApplications

  22. Browser-HostedApplications

  23. Markup and Code-Behind • WPF utiliza una programación basada en XML (XAML) y en codebehind, como por ejemplo asp.net (ASPX). • Markup • XAML es un lenguaje basado en XML para definir la UI de manera declarativa. • <Windowxmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Title="Window with Button" Width="250" Height="100"> • <Button Name="button">Click Me!</Button> • </Window>

  24. Markup and Code-Behind • Code-Behind • Es muy parecido a asp.net tenemos que definir cual es la clase que va implementar la funcionalidad de la ventana. • <Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="SDKSample.AWindow" Title="Window with Button" Width="250" Height="100"> • <Button Name="button“ Click="button_Click"> Click Me!</Button> • </Window>

  25. Markup and Code-Behind • Code-Behind • Es muy parecido a asp.net tenemos que definir cual es la clase que va implementar la funcionalidad de la ventana. • usingSystem.Windows; // Window, RoutedEventArgs, MessageBox • namespaceSDKSample • { • publicpartialclassAWindow : Window • { • publicAWindow() • { • InitializeComponent(); • } • voidbutton_Click(objectsender, RoutedEventArgs e) • { • // Show message box whenbuttonisclicked • MessageBox.Show("Hello, Windows PresentationFoundation!"); • } • } • }

  26. XAML • XAML es Extensible Application Markup Language • Está basado en XML • Jerárquico • Soporte para listas • Así es como se define la UI de las aplicaciones • Es un mapeo entre XML y los tipos del .NET Framework • Nodos -> Tipos • Atributos -> CLR Property o DependencyProperty

  27. XAML • xmlns • xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" • xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" • xmlns:custom="clr-namespace:SDKSample;assembly=SDKSampleLibrary" • Namescope • Ambitosdentro de XAML para el nombre de los elementosdentro del arbol. • x:Name=“control” • FindName(“control”)

  28. XAML • API para leer y guardar XAML desde código • XamlReader.Load • XamlReader.Parse • XamlWriter.Save

  29. demo trabajo con XAML

  30. Lab01 xaml

  31. Controls • Buttons • Button and RepeatButton. • Digital Ink • InkCanvas and InkPresenter. • Documents: • DocumentViewer, FlowDocumentPageViewer, FlowDocumentReader, FlowDocumentScrollViewer, and StickyNoteControl. • Input: • TextBox, RichTextBox, and PasswordBox.

  32. Controls • Layout: • Border, BulletDecorator, Canvas, DockPanel, Expander, Grid, GridView, GridSplitter, GroupBox, Panel, ResizeGrip, Separator, ScrollBar, ScrollViewer, StackPanel, Thumb, Viewbox, VirtualizingStackPanel, Window, and WrapPanel. • Media: • Image, MediaElement, and SoundPlayerAction. • Menus: • ContextMenu, Menu, and ToolBar. • Navigation: • Frame, Hyperlink, Page, NavigationWindow, and TabControl.

  33. Controls • Selection: • CheckBox, ComboBox, ListBox, TreeView, and RadioButton, Slider. • User Information: • AccessText, Label, Popup, ProgressBar, StatusBar, TextBlock, and ToolTip.

  34. Controls • Layout: • Canvas, StackPanel, Grid • Button / Command • Button, HyperlinkButton, RepeatButton • Selection controls: • CheckBox, ComboBox, ListBox, RadioButton, Slider • Date display and selection: • Calendar, DatePicker • Information Display (read-only) • TextBlock

  35. Controls • Text display and editing • PasswordBox, TextBox • Data display • DataGrid • Graphics and video display • Image, MultiScaleImage, MediaElement, InkPresenter • Aditional layout and grouping • Border, ContentControl, GridSplitter, ScrollBar, ScrollViewer, TabControl, Popup • User Help • ToolTip

  36. Layout • Layout es la disposición de los elementos en pantalla. • Es una de las partes más importantes del desarrollo de software (UI) y está entre las que más CPU gasta. • En WPF hay controles que nos ayudan con el Layout. • Layoutcontrols: • Canvas: Child controls provide their own layout absolute. • DockPanel: Child controls are aligned to the edges of the panel. • Grid: Child controls are positioned by rows and columns. • StackPanel: Child controls are stacked either vertically or horizontally. • VirtualizingStackPanel: Child controls are virtualized and arranged on a single line that is either horizontally or vertically oriented. • WrapPanel: Child controls are positioned in left-to-right order and wrapped to the next line when there are more controls on the current line than space allows.

  37. Layout • En la programación tradicional de UI cada control tenía su rectángulo para dibujarse. • Ahora hay dos medidas, Arrange y Measure • Measure: Le preguntamos a nuestro hijo en que tamaño se siente confortable. • Arrange: Organizamos o ordenamos los elementos hijos en función del tamaño disponible

  38. Alignment, Margins and Padding • FrameworkElement define una serie de propiedades comunes a todos los controles de WPF. • HorizontalAlignment • Margin • Padding • VerticalAlignment • Es muy parecido a HTML • Desaparece el concepto de Location (Point) y Size (Size)

  39. Alignment, Margins and Padding

  40. Alignment, Margins and Padding

  41. demo Layout

  42. Lab02 Layout

  43. DependecyProperty • Una de las principales motivaciones en el diseño de la arquitectura de WPF fue la preferencia sobre propiedades sobre los métodos o los eventos. • En WPF aparecen las DependencyProperty (propiedades de dependencia) que complementan el sistema de propiedades de CLR. • La misión de las DP es proveer un sistema para calcular el valor de una propiedad, notificaciones de cambio, coacción y metadatos.

  44. DependecyProperty Notificaciones de cambio (ambos sentidos) Validaciones UI Objeto de negocio

  45. DependencyProperty private inttemperatura; public intTemperatura { get { return temperatura; } set { temperatura = value; } }

  46. DependencyProperty publicintTemperaturaDP { get { return (int)GetValue(TemperaturaDPProperty); } set { SetValue(TemperaturaDPProperty, value); } } publicstaticreadonlyDependencyProperty TemperaturaDPProperty = DependencyProperty.Register( "TemperaturaDP", typeof(int), typeof(Wigo), new UIPropertyMetadata(0));

  47. DependencyProperty • Es un sistema flexible para definir propiedades. • Internamente se almacenan en un diccionario así que solamente tenemos los valores para las DP que tengamos establecidas. • Al ser un sistema dinámico podemos adjuntar (attach) Dependencyproperty de otras clases. • Resuelve el clásico ejemplo de usar la propiedad Tag (Object) para llevarse objetos personalizados. • Únicamente se deben usar para enlazar objetos con UI.

  48. DependencyProperty • Tenemos dos delegados que nos permiten obtener notificaciones sobre cambios de variables y validación. • PropertyChangedCallback • CoerceValueCallback • Metadatos • AffectMeasure • AffectRender • DP de solo lectura (Read-Only)

  49. demo Usando Dependency Properties

  50. demo Creando Dependency Property personalizadas

More Related