marți, 20 aprilie 2010

[1]WPF - About

WPF - about

  • WPF separates the appearance of an user interface from its behavior. The appearance is generally specified in the Extensible Application Markup Language (XAML), the behavior is implemented in a managed programming language like C# or Visual Basic. 

    • Appearance and behaviour are loosely coupled

    • Designers and developers can work on separate models.

    • Graphical design tools can work on simple XML documents instead of parsing code

  • Rich composition

    • Controls in WPF are extremely composable. (Samples: Put an image into a button to create an image button, or put a list of videos into a combobox to choose a video file)
  • Highly customizable
    • The concept of styles let you skin controls almost like CSS in HTML.


  • Resolution independence

    • All measures in WPF are logical units - not pixels. A logical unit is a 1/96 of an inch. If you increase the resolution of your screen, the user interface stays the same size

  • Both Windows- and web-based applications can be built
  • WPF has been built under the following design principles:
    • Integration
      • WPF was designed as a single model for application development, providing seamless integration between services (GDI/GDI+ for 2D graphics, UI services (User32 or WinForms), or Direct3D or OpenGL for 3D graphics) within an application
    • Vector graphics
      • WPF implements a vector-based composition engine. This allows for graphics to scale based on screen-specific resolution without loss of quality.
        WPF implements a floating-point logical pixel system and supports 32-bit ARGB color
    • Declarative programming
      • WPF introduces a new XML-based language to represent UI and user interaction, known as XAML
      • XAML allows applications to dynamically parse and manipulate UI elements at either compile-time or runtime, providing a flexible model for UI composition.
        XAML follows the code-behind model, allowing designers and developers to work in parallel and seamlessly combine their work to create a compelling UX
    • Simplified deployment
      • WPF applications can be deployed as standalone applications or as web-based applications hosted in Internet Explorer.
    • Document portability
      • In conjunction with the release of Microsoft Office 12, WPF utilizes Open Packaging Conventions, which supports compression, custom metadata, digital signatures, and rights management.
  • WPF is based on a messaging system implemented by the dispatcher
  • The foundation of the WPF property system is the concept of a property expression. A core philosophy of WPF is to move to a more declarative, "property centric" model of programming.
  • WPF uses a "painter's algorithm" painting model. This means that instead of clipping each component, each component is asked to render from the back to the front of the display. This allows each component to paint over the previous component's display. The advantage of this model is that you can have complex, partially transparent shapes.
  • WPF has full support for property binding, transformation, and list binding.
  • Data Templates. Data templates allow you to declaratively specify how a piece of data should be visualized. Instead of creating a custom user interface that can be bound to data, you can instead turn the problem around and let the data determine the display that will be created.
  • Two element trees exist within a WPF application: the logical tree and the visual tree
    • The logical tree is the hierarchical structure containing the exact elements of your WPF application as defined either declaratively within a XAML file, or imperatively in code
      • The logical tree outlines the 1:1 mapping of the nested XAML elements declared in the code snippet to their appropriate classes in the WPF API. 
      • The LogicalTreeHelper class provides methods such as GetChildren and GetParent for querying the tree object to extract a list of child collections of elements from the tree of object elements.
      • _buttonCtrl.FindName(“_textCtrl");
    • Virtual Tree
      • For each element in the logical tree, additional elements may be created to represent visual aspects required by the element. The combination of application elements and the elements created for visualization support is known as the visual tree.
      • Not all logical tree nodes appear in the visual tree; only the elements that derive from System.Windows.Media.Visual or System.Windows.Media.Visual3D are included
    • You can access both the logical and visual trees from code
      • You can easily traverse both the logical and visual trees using the somewhat symmetrical System.Windows.LogicalTreeHelper and System.Windows.Media.VisualTreeHelper classes
    • LogicalTreeHelper.GetChildren(obj as DependencyObject)
    • OnContentRendered, which doesn’t get called until after layout occurs
    • Visual class contains three protected members (VisualParent, VisualChildrenCount, and GetVisualChild) for examining its visual parent and children.

  • Events in WPF are called routed because there is a brand new process to handle these events.
    • In WPF, the parent element can provide information to child elements, providing usage, customization, and visibility to the potentially smaller, nested objects
    • There are three types of routed events:
      • Tunneling
        • It fires in the opposite direction from the top of the visual tree down.
      • Bubbling
        • It provides event handling from the originating element of a visual tree to the root of the tree.
      • Direct
          • Direct events represent the typical approach to which .NET programmers
    • To suppress the handling of an event, you need to set that Handled property of the RoutedEventArgs parameter
      private void PreviewMouseDownButton(object sender, RoutedEventArgs e)
          e.Handled = true;
    • Find the Source Element in an Event Handler: you need to access the Source property of the RoutedEventArgs parameter
  • Commands:
    • Essentially, commands are a means by which shared actions can be grouped and invoked in several different ways within an application.
    • Commands are considered “routed" in part because they follow the same line of tunneling and bubbling as events do in WPF
    • A fundamental difference between commands and events is that commands do not exist in relation to controls
    • When the RoutedCommand class is invoked by your application, it raises the PreviewExecuteEvent and the ExecuteEvent events
    • ApplicationCommands, ComponentCommands, EditCommands, MediaCommands
      • TextBox controls utilize valuable ApplicationCommands class functionalities such as cut, copy, paste, and so on.
    • A CommandBinding class is used to provide UI element-specific context to the execution of commands within a window or area of an application.
      • offers a total of four events: Execute, PreviewExecute, QueryEnabled, and PreviewQueryEnabled.
    • Commands are invoked using the notion of input gestures. Two input gesture types are supported: MouseGesture and KeyGesture
      • The InputGestureCollection class is used to house all the input gestures that can invoke a command.

  • Triggers 
    • WPF provides a new concept to the UI development effort: the trigger. Triggers are used to control and manipulate the visual representation of a control’s style elements within a window
    • Types of triggers:
      • Property triggers
        • the most common and basic types of triggers
        • They are basically XAML condition statements that check the state of a property to determine whether to use a specific style/setter value within the style of the element
        • property triggers, which enable you to perform your own custom actions when a property value changes without writing any procedural code.

      • Event triggers
        • They enable you to declaratively specify actions to take when a routed event is raised.
        • Event triggers are very different from property and data triggers in that they are based solely on events fired within the application.
        • Event triggers always involve working with animations or sounds
      • Data triggers
        • Data triggers are used to check the values within non-visual and/or non-WPF control elements
        • Data triggers are designed to work outside of the WPF dependency property system, accessing CLR properties or non-visual objects such as form content or variable values
        • Use Data triggers for:
          • Checking the value of a field or calculation
          • Controlling behaviors based on a variable in memory
          • Checking a non-visual data element
          • Checking a field within a bound control
      • Multi-condition data triggers
      • Multiple triggers
      • Multi-condition triggers
  • Globalization in the WPF platform means that the application should be developed with globally universal control references, and should not require recompilation in order to accommodate different languages.
    • Globalization is achieved in WPF through the use of the ResourceManager class
    • The ResourceManager class is used to provide culture-specific resource files and content at runtime
    • If ResourceManager determines that the culture is en-US, it will look in the en-US folder under the en folder within the application’s localized folder repository.
  • When a XAML file is compiled, it creates a BAML file, which can be accessed by the ResourceManager class. BAML files are compiled and deployable XAML applications that run under various .NET Framework deployment environments. BAML files are able to be accessed at runtime as a resource and utilized as content or functionality.
  • Property Value Inheritance
    • it doesn’t refer to traditional object oriented classbased inheritance, but rather the flowing of property values down the element tree.
    • The behavior of property value inheritance can be subtle in cases like this for two reasons:
      • Not every dependency property participates in property value inheritance. (Internally, dependency properties can opt in to inheritance by passing FrameworkPropertyMetadataOptions.Inherits to DependencyProperty.Register.)
      • There may be other higher-priority sources setting the property value
        • A few controls such as StatusBar, Menu, and ToolTip internally set their font properties to match current system settings.
  • Attached Properties
    • An attached property is a special form of dependency property that can effectively be attached to arbitrary objects.
    • Sample 1
        <StackPanel TextElement.FontSize="30" TextElement.FontStyle="Italic" .. />
        In this sample StackPanel does not have FontSize or FontStyle properties defined. But all the controls that are inside it, will inherit the properties defined through TextElement
    • Sample 2:
      TextElement.SetFontSize(panel, 30);
      TextElement.SetFontStyle(panel, FontStyles.Italic);

There are main development tools for WPF applications:

  • XamlPad
    •  is a basic visual editor for XAML
  • Visual Studio - for developers
    • code and XAML editing

  • Expression Blend - for designer 
    • The goal of Expression Blend is to provide an environment where graphic and interactive designers can create WPF applications using tools and concepts common to design applications they already use 
    • It provides support for all the graphical stuff like gradients, template editing, animation, style. #D graphics, resources, etc
    • It is especially created for user experience designers
      • Vector drawing tools
      • Timeline-based animation support, media integration, and 3D authoring
      • Robust integration with data sources and seamless integration with Visual Studio 2005
    • The design environment offers two different workspace orientations: design and animation.
    • A unique feature of the designer is the ability to zoom in and out of the workspace
    • Workspace panels:
      • The Artboard
        • it is the viewing space
      • Toolbox—Contains a list of available tools that you can use to create and manipulate elements on the artboard. The tools enable you to visually create, paint, and translate vector objects.
      • Project—Contains a list of components, controls, and assets local to the project or imported from external library references.
      • Properties—Enables you to alter the visual and positional properties of an element in the artboard, including opacity, stroke, and fill color.
      • Resources—Contains a list of all available resources in the current project such as styles, templates, and brushes.
      • Interaction—Contains subpanels where the designer can create triggers and the timeline subpanel for authoring animations.
    • Vector objects in Expression Blend can be lines, shapes, or controls. Each vector object can easily be modified and manipulated by moving, rotating, skewing, mirroring, or resizing them
      • primitive vector shape
        • Rectangle—Draws rectangles and squares with or without rounded corners
        • Ellipse—Draws circles and ellipses
        • Line—Draws a straight line between two points
      • Paths:
        • Vector shapes are composed of individual paths
        • Paths are made up of connected points, lines, and/or curves.
        • They can also be used to define motion paths for objects in animation.
  • Other tools:
    • Electric Rain ZAM 3D
    • Snoop (Inspect the Visual Tree of running WPF applications)
    • Mole (Data Visualizer for Visual Studio

    • XAML Power Toys

    • WPF Performance Suite

Page and Table Service (PTS). PTS is responsible for the organization and layout of text within the UI. This includes paragraphs, tables, and blocks of text.

Niciun comentariu:

Trimiteți un comentariu