WPF学习小结

今天开始WPF的学习,分析了一下Windows SDK 里面的Sample——DataBindingLab
        该解决方案示意图为:

这个Sample是个在线拍卖的实例,其中DataBindingLabApp.xaml是该应用程序的入口,为什么呢?
一、DataBindingLabApp类继承于Application类,而Application类在.NET 3.0后整合了WPF应用程序类。
二、请看DataBindingLabApp.xaml开始的一段代码
None.gif < Application  x:Class ="DataBindingLab.DataBindingLabApp"
None.gif  xmlns
="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
None.gif  xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
None.gif    Startup
="AppStartup"
None.gif    xmlns:src
="clr-namespace:DataBindingLab"  
None.gif    xmlns:System
="clr-namespace:System;assembly=Mscorlib"
None.gif    
>
None.gif
<!-- 省略 -->
None.gif
</ Application >
其中Startup="AppStartup"这句,说明它作为程序入口,相应后台代码有:
None.gif          void  AppStartup( object  sender, StartupEventArgs args)
ExpandedBlockStart.gifContractedBlock.gif        
dot.gif {
InBlock.gif            LoadAuctionData();
InBlock.gif            MainWindow mainWindow 
= new MainWindow();
InBlock.gif            mainWindow.Show();
InBlock.gif            
//AddProductWindow addProductWindow = new AddProductWindow();
InBlock.gif            
//addProductWindow.Show();
ExpandedBlockEnd.gif
        }

None.gif
其中LoadAuctionData()加载拍卖数据,mainWindow.Show()将打开MainWindow窗口,MainWindow窗口是个MainWindow类,文件为MainWindow.xaml.cs

       现在来具体看看DataBindingLabApp.xaml在做些什么。
1、首先是个Application.Resources的标识,它是用来获取和设置应用程序范围资源的集合,比如Styles或者Brushes;
2、各种style定义,其实功能相当与Web使用的CSS/Skin等,比如
None.gif < Style  x:Key ="titleStyle"  TargetType ="TextBlock" >
None.gif        
< Setter  Property ="FontWeight"  Value ="Bold" />
None.gif        
< Setter  Property ="Foreground"  Value ="DodgerBlue" />
None.gif        
< Setter  Property ="FontSize"  Value ="18" />
None.gif      
</ Style >
titleStyle作为该Style关键字,针对的控件类型为TextBlock,相当于Label
<Setter>就是设置各种属性了,这里就不多说了。
3、<DataTemplate> 数据模版
None.gif < DataTemplate  DataType ="{x:Type src:AuctionItem}" >
None.gif            
< Border  BorderThickness ="1"  BorderBrush ="Gray"
None.gif                    Padding
="7"  Name ="border"  Margin ="3"  Width ="500" >
None.gif                
< Grid >
None.gif                  
< Grid .RowDefinitions >
None.gif                    
< RowDefinition />
None.gif                    
< RowDefinition />
None.gif                    
< RowDefinition />
None.gif                    
< RowDefinition />
None.gif                  
</ Grid.RowDefinitions >
None.gif                  
< Grid .ColumnDefinitions >
None.gif                    
< ColumnDefinition  Width ="20" />
None.gif                    
< ColumnDefinition  Width ="86" />
None.gif                    
< ColumnDefinition  Width ="*" />
None.gif                  
</ Grid.ColumnDefinitions >
None.gif                      
None.gif                    
< Polygon  Grid.Row ="0"  Grid.Column ="0"  Grid.RowSpan ="4"
None.gif                             Fill
="Yellow"  Stroke ="Black"  StrokeThickness ="1"
None.gif                             StrokeLineJoin
="Round"  Width ="20"  Height ="20"
None.gif                             Stretch
="Fill"
None.gif                             Points
="9,2 11,7 17,7 12,10 14,15 9,12 4,15 6,10 1,7 7,7"
None.gif                             Visibility
="Hidden"  Name ="star" />
None.gif
None.gif                    
< TextBlock  Grid.Row ="0"  Grid.Column ="1"  Margin ="0,0,8,0"
None.gif                               Name
="descriptionTitle"
None.gif                               Style
="{StaticResource smallTitleStyle}" > Description: </ TextBlock >
None.gif                    
< TextBlock  Name ="DescriptionDTDataType"  Grid.Row ="0"  Grid.Column ="2"  
None.gif                        Text
="{Binding Path=Description}"  
None.gif                        Style
="{StaticResource textStyleTextBlock}" />
None.gif
None.gif                    
< TextBlock  Grid.Row ="1"  Grid.Column ="1"  Margin ="0,0,8,0"
None.gif                               Name
="currentPriceTitle"
None.gif                               Style
="{StaticResource smallTitleStyle}" > Current Price: </ TextBlock >
None.gif                    
< StackPanel  Grid.Row ="1"  Grid.Column ="2"  Orientation ="Horizontal" >
None.gif                        
< TextBlock  Text ="$"  Style ="{StaticResource textStyleTextBlock}" />
None.gif                        
< TextBlock  Name ="CurrentPriceDTDataType"  
None.gif                            Text
="{Binding Path=CurrentPrice}"  
None.gif                            Style
="{StaticResource textStyleTextBlock}" />
None.gif                    
</ StackPanel >
None.gif                
</ Grid >
None.gif            
</ Border >
None.gif            
< DataTemplate .Triggers >
None.gif                
< DataTrigger  Binding ="{Binding Path=SpecialFeatures}" >
None.gif                    
< DataTrigger .Value >
None.gif                        
< src:SpecialFeatures > Color </ src:SpecialFeatures >
None.gif                    
</ DataTrigger.Value >
None.gif                  
< DataTrigger .Setters >
None.gif                    
< Setter  Property ="BorderBrush"  Value ="DodgerBlue"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="descriptionTitle"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="currentPriceTitle"   />
None.gif                    
< Setter  Property ="BorderThickness"  Value ="3"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Padding"  Value ="5"  TargetName ="border"   />
None.gif                  
</ DataTrigger.Setters >
None.gif                
</ DataTrigger >
None.gif                
< DataTrigger  Binding ="{Binding Path=SpecialFeatures}" >
None.gif                    
< DataTrigger .Value >
None.gif                        
< src:SpecialFeatures > Highlight </ src:SpecialFeatures >
None.gif                    
</ DataTrigger.Value >
None.gif                    
< Setter  Property ="BorderBrush"  Value ="Orange"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="descriptionTitle"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="currentPriceTitle"   />
None.gif                    
< Setter  Property ="Visibility"  Value ="Visible"  TargetName ="star"   />
None.gif                    
< Setter  Property ="BorderThickness"  Value ="3"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Padding"  Value ="5"  TargetName ="border"   />
None.gif                
</ DataTrigger >
None.gif            
</ DataTemplate.Triggers >
None.gif        
</ DataTemplate >

DataType是数据类型,就是该模版要与AuctionItem类绑定,文件为AuctionItem.cs。
-------------------------------------
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="86"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
说明该网格分布为4行3列,其中第0列为20px,第1列为86px,第2列为*
<Polygon>多边形控件,这里是个星状体;<TextBlock>文本控件;可以看到每个控件都有属性Grid.Row和Grid.Column
Grid.Row是该网格分布第几行,Grid.Column是该网格分布第几列,如Grid.Row="0" Grid.Column="1"表示该控件属于第0行第1列;
-----------------------------------------
并且控件的属性Style,用到前面谈到的Style,如Style="{StaticResource textStyleTextBlock}",用到了关键字为textStyleTextBlock的Style;
-----------------------------------------
属性Text,表示显示的文本内容,如Text="{Binding Path=CurrentPrice}",绑定了前面说的AuctionItem.cs中的属性CurrentPrice
-----------------------------------------
<DataTemplate.Triggers>数据触发
None.gif < DataTemplate .Triggers >
None.gif                
< DataTrigger  Binding ="{Binding Path=SpecialFeatures}" >
None.gif                    
< DataTrigger .Value >
None.gif                        
< src:SpecialFeatures > Color </ src:SpecialFeatures >
None.gif                    
</ DataTrigger.Value >
None.gif                  
< DataTrigger .Setters >
None.gif                    
< Setter  Property ="BorderBrush"  Value ="DodgerBlue"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="descriptionTitle"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="currentPriceTitle"   />
None.gif                    
< Setter  Property ="BorderThickness"  Value ="3"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Padding"  Value ="5"  TargetName ="border"   />
None.gif                  
</ DataTrigger.Setters >
None.gif                
</ DataTrigger >
None.gif                
< DataTrigger  Binding ="{Binding Path=SpecialFeatures}" >
None.gif                    
< DataTrigger .Value >
None.gif                        
< src:SpecialFeatures > Highlight </ src:SpecialFeatures >
None.gif                    
</ DataTrigger.Value >
None.gif                    
< Setter  Property ="BorderBrush"  Value ="Orange"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="descriptionTitle"   />
None.gif                    
< Setter  Property ="Foreground"  Value ="Navy"  TargetName ="currentPriceTitle"   />
None.gif                    
< Setter  Property ="Visibility"  Value ="Visible"  TargetName ="star"   />
None.gif                    
< Setter  Property ="BorderThickness"  Value ="3"  TargetName ="border"   />
None.gif                    
< Setter  Property ="Padding"  Value ="5"  TargetName ="border"   />
None.gif                
</ DataTrigger >
None.gif            
</ DataTemplate.Triggers >
它的意思是绑定了AuctionItem.cs中的属性SpecialFeatures,实际上SpecialFeatures是个枚举类型,它包括None,Color,Highlight,上面代码得出,当SpecialFeatures为Color时,设置边框属性;当SpecialFeatures为Highlight时,设置边框属性并且加颗星星,这么做的目的是来区分拍卖级别。

        再来看看MainWindows.xaml做些什么
总的来说,其实真正用来呈现窗体给我们的就是这个类。
1 有这么一句代码
None.gif <CollectionViewSource 
None.gif              Source
= " {Binding Source={x:Static Application.Current}, Path=AuctionItems} "    
None.gif              x:Key
= " listingDataView "  />
它是绑定了当前应用程序入口的数据源,换句话说,就是它把DataBindingLabApp.xaml.cs中的的属性队列AuctionItems数据攘入其中,也就是各种拍卖信息了。
2
None.gif <ListBox Name = " Master "  Grid.Row = " 2 "  Grid.ColumnSpan = " 3 "  Margin = " 8 "
None.gif            ItemsSource
= " {Binding Source={StaticResource listingDataView}} " >
None.gif            <ListBox.GroupStyle>
None.gif                <GroupStyle 
None.gif                  HeaderTemplate
= " {StaticResource groupingHeaderTemplate} "
None.gif                  />
None.gif            </ListBox.GroupStyle>
None.gif        </ListBox>
绑定源就是上面定义的关键字listingDataView的数据源。至此,该ListBox就把各种拍卖信息显示出来了,如下图所示

3、其他问题
None.gif <CheckBox Name = " Grouping "  Grid.Row = " 1 "  Grid.Column = " 0 "  
None.gif            Checked
= " AddGrouping "  Unchecked = " RemoveGrouping "  
None.gif            Margin
= " 8 "  Style = " {StaticResource checkBoxStyle} " >Group by category</CheckBox>
None.gifdot.gifdot.gif
None.gif <Button Name
= " OpenAddProduct "  Grid.Row = " 4 "  Grid.Column = " 1 "  Content = " Add Product "  HorizontalAlignment = " Center "  Margin = " 8 "  
None.gif            Click
= " OpenAddProductWindow "  />
其中属性Checked,Unchecked,Click都一一对应的是一个方法AddGrouping,RemoveGrouping,OpenAddProductWindow,它在MainWindow.xaml.cs后台代码展出,这里就不一一叙述了。
整个运行界面为:


下载代码

结束语:对于xaml的评价,有这么几点:

灵活的平台级控件开发体系
更方便的控件布局能力
利用了图形加速能力的图像处理管道
灵活丰富的样式功能和样式模板
强大的声明式数据绑定

而对于XAML的使用将会使得windows应用程序很像现在的web开发。

以上是我今天学习WPF的心得,觉得有什么不对的地方请多多指教,小弟初入门,呵呵!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值