目录
Silverlight历史 1
Silverlight应用程序 2
XAML 2
Dependency Property(DP)/Attached Property(AP) 3
Control继承树 4
Resource & Style 5
Layout 6
Transform 7
Shape 8
结语 8
Silverlight历史微软推出Silverlight的初衷是为了提供跨平台跨浏览器的开发框架,从去年开始基本放弃该计划,而着重将其打造成windows Phone 7的开发平台,个人觉得这个是正确的,毕竟微软自己并没有多大的动力去在其它 *** 作系统上发展,而且事实证明它还没有这个能力来一家说了算,毕竟未来还是HTML5的。
从2007年推出以来,每年都有一个新的版本,我想应该是2010年开始作为WP7开发平台后,才慢慢真正被人重视。
figure 1 Silverlight历史
Silverlight应用程序Silverlight应用程序可以以以下三种方式进行运行:
浏览器插件的方式运行 作为独立应用程序运行(一般以ClickOnce的方式进行发布) 作为windows Phone应用程序运行不管应用程序以那种方式运行,应用程序都已XAP的方式进行打包,XAP的文件格式即Zip文件格式(类似于新的Office内容格式,都是以Zip文件格式进行打包),内包含了Dll,Content(如jpg,avi),AppManifest等。Silverlight应用程序都是通过相应的装载程序进行加载XAP文件,然后通过AppManifest入口文件说明找到相应的启动类或页面进行加载,程序加载后运行在Silverlight托管的Runtime之上。
XAML学好Silverlight,必须要对XAML有深刻理解。对于XAML,个人总结两句话:
用XML的方式来声明对象figure 2 XML映射到对象
在XAML中,几乎每个XML节点(Element)都是声明一个对象(Object),即上图的XML Element映射到Object,对于每个XML的属性(Attribute)都映射到一个对象的属性(Property)或者事件(Event)。因此XAML只是利用XML的方式来声明内存对象而已,和用C#代码的作用是一样的,只是采用XML作为书写的方式而已。
用XML的方式来定义对象树figure 3 从Logical Tree到Visual Tree
用XML的方式来声明对象不仅仅在设置属性上比较方便,XML本身的树形结构就和GUI的Render树形结构非常一致,因此利用XML天生的嵌套能力可以非常直观和有效的定义界面层级结构。在Silverlight里面,大家在XAML Designer上定义的为Logical Tree,Runtime在加载XAML后根据Control Template和控件的Visual的定义转化成Visual Tree而最终Render出来,如果你需要对系统生成的Visual Tree感兴趣的话,可以使用我在之前文章中提到的Silverlight Spy这个工具来进行UI Visual Element的探测。
Dependency Property(DP)/Attached Property(AP)对于界面描述语言XAML来说,我想其它开发平台也有类似的东西,AndroID有XML UI,iOS有xib,Qt有QML,有些甚至比XAML灵活。Silverlight Framework之所以强大,应该说离不开Dependency Property(DP)的存在,关于DP有以下两点事实:
DP是建立在C# Property基础之上的(简单理解有点类似JavaScript等动态语言,具有一个字典表来存储属性的值,把默认值存储在Class Level/Static的字典表中,见@L_403_14@详细分析原理) DP是Silverlight的脊椎骨,几乎所有的UI Element的属性都是DP这么玄乎,那DP到底有什么用? 只有属性是DP,才能实现以下功能
Resources: 在Resource中设置属性值 Data binding: 支持该属性成为Binding的Target Styles: 支持使用Style来设置该属性值 Animations: 支持利用Animation来Animate该属性 Metadata overrIDes: 支持对属性元数据的重写 Property value inheritance: 支持属性值从逻辑树基层 WPF Designer integration: 支持对编辑器设计时Attached Property(AP)是基于Dependency Property之上更高级的使用方法,即在某一个Dependency Object之上设置另外一个Dependency Object的Dependency Property属性的值. 打个比方就是公司的笔记本电脑上面贴了公司Asset的标签,Asset标签本身不是笔记本携带的属性,而是公司IT部门强行加上去的,对于笔记本本身没有意义,但是对于公司有意义,需要通过这个Asset标签来进行管理.
最常见的Attached Property就是GrID.Column和GrID.Row.
<TextBox GrID.Row="0" …>
Control继承树我引用一篇文章中的一张控件继承图来阐述Silverlight/WPF核心类的结构。
Controls为包含了ControlTemplate来设定其Visual展示,如TextBox ContentControl是定义了单一Content属性的控件,可以通过ContentTemplate来设置其内容值,如button ItemsControl为列表类型,通过ItemTemplate来控制每个Item的Visual,如ListBox如果更加具体分析的话,下图为从中抽取最为重要的几个类,并解释其在整个Silverlight框架中起的作用。
DependencyObject是所有Silverlight控件的最基础类,因为在DP必须定义在DependencyObject内。 UIElement提供了关于transform的支持,正式Rendertransform是可以在Composite线程上运算和绘画的 FrameworkElment定义了三个非常重要的元素:DataContext,Resources,Style。它们构建了Silverlight框架的核心至于Silverlight有那些常用控件,大家可以直接参考MSDN。
Resource & StyleResource即为一个哈希表(Dictionary),可以存放任何类型的对象,通过key来进行索引。
X:key<Application.Resources>
<Style x:Key="GreenbuttonStyle">
<Setter Property="Control.Background" Value="Green"/>
</Style>
</Application.Resources>
根据之前的内容,我们知道所有的FrameworkElement都定义了Resource属性。
Style有点类似CSS中的Style,但比CSS的Style强大很多,Silverlight中的Style不仅仅为设置显示的样式,可以设置任何UIElement的属性的值,通过targettype来定义在Style中能够设置的Propertyname,这在编译时就会进行检查。
Style产生效果有两种模式:
自动应用模式,即在定义样式时仅指定targettype而不指定Key,则将自动应用该样式到所有该类型的控件上。 手工应用模式,即在定义样式时指定targettype同时设定Key,要用该种样式,必须在控件上手动加上引用Resource<Style targettype="button" x:Key="buttonStyle">
<Setter Property="Background" Value="Green" />
<Setter Property="FontSize" Value="24" />
</Style>
…
<button Style="{StaticResource buttonStyle}" Content="B" />
LayoutSilverlight中常用的Layout方式主要包括:
GrID: 表格的方式来进行排版(偏移通过margin实现) StackPanel: 横向或者竖向层叠进行排版 Canvas:通过x,y绝对定位坐标的方式进行控件排版 GrID | StackPanel | Canvas |
<GrID> <GrID.RowDeFinitions> <RowDeFinition/> <RowDeFinition/> <RowDeFinition/> <RowDeFinition/> </GrID.RowDeFinitions> <GrID.ColumnDeFinitions> <ColumnDeFinition/> <ColumnDeFinition/> <ColumnDeFinition/> </GrID.ColumnDeFinitions> <my:Key GrID.Row="0" GrID.Column="0" .../> <my:Key GrID.Row="0" GrID.Column="1" .../> ... </GrID> | <StackPanel OrIEntation="Horizontal"> <Image ... /> <Image ... /> <Image ... /> ... </StackPanel> | <Canvas...> <TextBlock Canvas.left="20" Canvas.top="30" Text="Silverlight eCard" .../> </Canvas> |
可以看到GrID.Row或者Canvas.left即为我们之前提到的Attached Property,在儿子控件设置该属性,其父亲控件对其值感兴趣,根据其值来进行排版。
transform利用Silverlight的transform可以非常方便地进行控件变形、位移、二维旋转、三维旋转,transform经常用在Animation当中,利用Expression Blend可以方便地生成变形以及录制动画。
二维变换
figure 4 Render transform
三维旋转
ShapeXAML也提供了类似于SVG的定义二维矢量图的方式,包括Rectangle,line,polygon,Path等各种简单或复杂的图形,定义方式也非常容易。
结语XAML是Silverlight乃至WP7开发的最基本功,因此需要对XAML的各个方面非常熟悉,并且尽可能地对其原理了解,可以大大加快日后的开发速度。
总结以上是内存溢出为你收集整理的[T1 Silverlight Training] Day 1全部内容,希望文章能够帮你解决[T1 Silverlight Training] Day 1所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)