技术开发 频道

WPF学习之路:从HelloWorld到WPF World

    【IT168 评论】有人说到,学习任何一种编程最困难的部分是“Hello World”。这一看似乎很可笑,仔细想来却未必。平时很多我们自认为很简单的东西也许恰恰是最困难的东西,比如C#中的一些基本概念,我们天天都在用,可你真的都理解他们吗?!对很多人来说恐怕要打个问号了。

  最近开始学习使用WPF,WPF是什么?网上有很多文章,在此就不赘述了。

  一切还是从“Hello World”开始,然而因为有了上面的经历,一切真的都变得不同了。

  Hello World

  如题,在优秀的IDE环境中,做一个简单的Hello World应用程序是如此的简单,仅仅用鼠标拖一个控件,在属性栏中输入“Hello World”,然后F5,OK,一切都完成了。

1
 

  这一切真的太简单了,就跟当年学习VB或C#一样,看起来没有任何不同,然而现在你还会说VB的Hello World与C#的Hello World是一回事么?!答案很显然。

  什么是Hello World

  有个笑话讲到,一个退休的程序员,退休后练习书法,提笔一挥,纸上赫然出现一行字——Hello World。第一个写“Hello World”的人也许是个天才。一粒沙中看世界,这个简单到一行代码甚至没有代码就能实现的程序向初学编程的人打开了一道便捷之门,给初学者足够的空间去思考有限的问题,一窥其后万千变化的世界。

  Hello World有什么

  Shift+F5,停止程序运行,让我们一起看看这个程序中有什么。先看文件结构:

1
 

  在解决方案资源管理器中,我们不难发现与WinForm相比,WPF程序多出了一种文件Xaml。先打开我们熟知的.cs代码文件,发现里面空无一物,

  甚至看不到承载Hello World的控件,结合Asp.Net的经验,我们在Xaml中发现了

<Grid>      <TextBlock Text="Hello World" />   </Grid>

 

  由此我们可以认为微软通过结合Asp.Net与WinForm的优点打造了全新的,而相比二者,WPF最核心的部分便是Xaml。

  发现Xaml

  那么什么是Xaml呢?MSDN中解释到:可扩展应用程序标记语言 (XAML) 是声明性应用程序编程标记语言,WPF提供对可扩展应用程序标记语言 (XAML) 语言支持,使WPF得以实现,这个解释有点抽象。事实上,如果有Asp.Net基础,我们则可以简单的认为WPF是以Asp.Net方式开发WinForm;如果有标记语言的基础,则可以简单认为Xmal以标记语言的方式实现WPF中的UI,然后由微软把UI和代码联系起来;如果什么都没有,那就把看到的网页关了,好好学习吧^_^。

  开启WPF World

  元素树

  我们知道,WPF的核心是Xaml。Xaml想做网页一样,将UI分割为不同大小的块,以一定方式组合,便成了我们看到UI基本框架,然后在通过美工的合作,成为最终呈现在我们面前的用户交互界面。Xaml中的每种元素代表UI上的一个基本元素,那么Xaml是以何种方式组织这些元素,并最终构成向用户交付的UI呢?看下图。

1
 

  如图所示,WPF以有序的方式按树形结构组合每个界面元素。界面中每个元素都有唯一的父节点,并可能有多个子节点。图中第3部分就是Hello World示例的树结构示意图。当然,WPF文档结构远比例子中复杂的多,不过作为入门,这些不在今天的讨论范围呢。 

  基元素

  现在改动一下程序,我们添加一个按钮,点击该按钮,显示一个消息框。

1

1

 

  在上面我们了解到WPF中Xaml负责UI,cs负责实现逻辑(显示消息框)。那么它们是如何关联起来的呢(请注意图中蓝线)?原来在WPF中,凡是与UI元素类均从一个基元素继承—— DependencyObject而来,这些类分别在cs和xaml中有相同签名的实现。我们在开发过程中只需要取相同的名字,WPF会自动替我们完成关联工作。

  注意:如果在C#代码中将button1_Click改为OnBtnClick,Xaml中不会自动改

  属性

  现在仔细观察一下IDE自动生成的代码,如果Asp或HtmlXml一样,我们会发现每个元素标签,除了标签名外都包含一些属性。除了在C#中我们熟知的Text="Hello World",Name="button1"外还包含Asp.NET中常见的Margin属性(用于说明Button在父容器中与其他元素的间隔距离)。前者与C#中的属相相同,后者则不属于对象本身,依赖于父元素,在WPF中成为附加属性(比如,如果Button不在一个父元素(Grid)中,那么它与其他元素就无所谓相对距离了)。

  在上小节中,我们知道WPF负责将Xaml元素与C#中的类一一对应起来,在Xmal中改变Button.Height的值时,cs中同样会做相应的改动,那么它们是如何实现的呢?原来WPF提供了一套属性系统,该系统提供一种方法来基于其他输入的值计算属性值。有了这套系统,我们在Xmal与cs之间访问属性时WPF会自动通知彼此,支持这些服务的属性通常称为依赖属性。

  样式和模板  想象一下我们继续修改Hello World程序,如果需要添加10个或100个相同Button,这些Button针对不同的用户有不同的样式。那么我们该如何支持这些样式呢?是在xmal中一个一个的写吗?当然不可能。既然Xaml类似于Asp.Net,那么我们不难想到网页中常用的CSS,在WPF中同样有属于Xaml的Css,并且更强大,那就是样式和模板。

  WPF样式设置和模板提供了一套功能(样式、模板、触发器和演示图板),让我们能够使用这些功能创建更好的视觉效果,也可以为创建统一外观,并且能够在应用程序内部和应用程序之间共享这些样式和模板,从而提供工作效率。

  资源

  在上小节中,我们提到了样式和模板,这些在WPF中属于资源。除此之外,WPF中的资源也包括C#中我们通常理解的文件,多媒体,数据等。只是在WPF中资源可分为静态资源和动态资源。从名字上很好理解它们的区别,一个性能好点,一个更灵活。做为入门,在使用时,是否需要实时更新资源可作为我们选择静态资源和动态资源的依据。

  总结

  学到了什么  通过上面一系列描述,我们发现了WPF中的一些基本概念:Xaml,元素树,基元素,属性,样式和模板,资源。这些都是初学WPF时最早接触到的内容。因篇幅所限,只能对这些内容做一个大概的介绍,使得我们能够从中一窥WPF的样貌。但做为初学者,充分理解把握这些内容是进一步学好WPF的关键。

  如何学习

  在上面的学习过程中,我们不难发现,学习任何一门技术都要从最简单的地方开始,然后通过仔细观察,发现问题,思考问题,并最终解决问题。其中最重要的是要勤于思考,而不是浮于表面。

  下一步该做什么

  今天我们从整体上对WPF有个粗略的了解,并发现了一些基本概念。虽然还有很多重要的内容如数据绑定,事件路由,线程模型等没有涉及到,但是本着贪多嚼不烂的原则,下一步我们应该对今天所涉及到的每个概念做深入的学习,然后经过反复的联系,最终能真正了解它们。

3
相关文章