4/28/2013

Why does WPF have strong points in UI programming, when comparing with WINFORM, MFC, WTL ?

  • The feature of declarable UI

First of all, the power of WPF is that it can aid to develop impressive user interface faster and easily. We are able to construct the ui of application using a markup language called XAML. The XAML is similar with HTML or XML. So that, if you already have some experience for them, learning XAML will just take a day! Here is an sample short code.


<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
          Title="Hello, there" Height="240" Width="300">
         <DockPanel>
                 <Border DockPanel.Dock="Top" BorderThickness="3" 
                          BorderBrush="White" CornerRadius="5" 
                          Padding="5" Background="Gray">
                     <TextBlock FontSize="10" TextWrapping="Wrap" 
                                Foreground="White">
                     Hello! There.
                     </TextBlock>
                 </Border>
                 <Button Background="LightGray" Width="80" 
                          Height="40" Content="Click"/>
          </DockPanel>
</Window>


Even if you haven't never meet XAML code before, you could estmate what above code is doing.
'DockPanel' and 'Border' are one of a number of rich controls which are provided by WPF. This sample code will make a window like a below picture.



Although, WinForm, MFC, WTL are supporting design tools for constructing UI easily, the quality of default controls of them is not relevant for using real workplace. Actually, the quality of WPF's default controls is also unattractive, but this point can be weighed out by using mark up language, because the use of markup language means that it can be available to bring the feature of web development such as CSS.
 

  • The power of Style

For a long time, one of distinct trends in UI programming is to provide the skin function. It allows to change the appearance of the application during the running time. The use of information file such as ini or xml is frequently used as a common method. Here is a drawback.
a typical example is below.

<Skin name="Gloomy">
 <Edit name="Input" position="10,40" size="100,40" color="128,128,128" />
 <Button name="Commit" position="115,40" size="70,40" color="128,128,128" /></Skin>


Above approach requires some extra processes. For example, indicated color value have to be translated relevant value for using in application code. So that, altering skin process usually follows the following sequence.First loading XML, next finding selected skin name, and then  by means of iterating, changing the look of all controls. Furthermore, C++ requires extra library for parsing xml, such as tinyXML.

On the other hand, all approaches for skin function change dramatically in WPF.
To begin with, we can declare some skin set like below,

-DefaultStyle.xaml
<Style x:Key="groupBoxHeader"
           TargetType="{x:Type Borders}">
       <Setter Property="CornerRadius"
                           Value="4" />
         <Setter Property="TextBlock.Foreground"
                           Value="White" />
</Style>


After that, above style set can be used like below code.
<GroupBox.Header>
         <Border Background="{StaticResource brownBrush}"
                Style="{StaticResource gropBoxHeader}">
             <TextBlock Text="Phone" />
         </Border>
</GroupBox.Header>

For changing style during the running time,
1)
After making several style xaml files, when it is needed, load that.
2)
Or, adopt resources to style as a 'DynamicResource'. And then, make each control's syle property to connect  this 'DynamicResource'.

When comparing to other measures, unnecessary works be reduced surprisingly. Now, we can just concentrate to other valuable work.


No comments:

Post a Comment