谈谈XAML前端开发

GUI的发展

在图形用户界面的操做系统(Windows,MAC)出现以前,计算机软件是命令行界面的程序,用户和程序的交互是经过输入命令,查看命令运行结果进行的。固然很不友好。后来出现了文本图形界面的程序,即用制表符等特殊文本拼接出图形界面的效果,来使程序以图形界面的方式和用户交互。出现了菜单项,状态栏等概念,当时在DOS下流行的QBASIC,TurboC等IDE就是典型的文本图形界面程序。前端

随着Windows操做系统的普及,GUI(图形界面)程序的交互方式成为了用户和计算机交互的标准方式。Windows从操做系统层面上对GUI程序进行支持,从当时较为成功的Windows95至今已经有了20年的时间。期间出现了无数的Window桌面应用程序,也就是所谓的exe程序。程序员

计算机硬件的形式和用户和图形界面程序交互的方式也在不断发生着变化,大约能够分为三代。传统的PC桌面设备和程序时代,计算机的形式是台式电脑和笔记本电脑,放在桌子面上使用,用户使用键盘和鼠标进行交互,因此程序被叫作桌面程序。至今在桌面操做系统中,Windows仍然占90%以上的份额,因此桌面程序仍然是Windows的天下。数据库

第二代就是所谓的移动手持设备和触控程序时代,这时的计算机就不只是放在桌面上使用了。而是拿在手上,可在移动中随时使用,用户使用触摸屏和电磁手写笔和程序进行交换。智能手机,平板电脑属于这种设备。目前的移动程序被iOS和Android程序占据了大部分份额,微软正力图经过Windows10改变这种局势。咱们现在还处在这两个时代之中,还有一些设备是融合了两个时代的特色的,如触控变形超级本,大屏幕触控一体机等。设计模式

将来的可穿戴设备则属于下一个时代,可穿戴设备指如手表,腕带,眼镜等便于穿戴在身上的设备,这时的图形用户界面可不必定是简单的2D界面了,有多是3D界面。用户和程序的交互方式也不必定是触摸,还有多是手势,语音,甚至眼神。微软的Windows10打出的就是大一统跨全部设备的牌,甚至包括将来设备,可见雄心之大。浏览器

本文中咱们主要讨论桌面时代和移动时代的2D图形用户界面程序,当前的3D游戏通常也采用2D界面加3D场景的方式。服务器

CS和BS

上文中提到的GUI程序指客户端程序,即CS程序。与之相对的还有浏览器应用程序,即BS程序。最初时浏览器是为了呈现互联网上的网站用的,网站数据是静态数据,服务器只是存储和返回数据。这些网站数据的标准就是HTML语言。架构

后来随着用户需求的增加,网站数据变为了动态数据,服务器就不只仅是存储静态网站数据了,而是变为了一个Web应用程序服务器。浏览器中显示的数据也变得形式丰富和富于交互,标准随之发展为HTML,CSS和Javascript。使用这些技术能够搭建起之内容呈现为主的网站,也能够搭建起富于业务逻辑的应用程序。这种在浏览器中运行的应用程序被称为BS程序。框架

在HTML5出现以前,BS程序的表现力和交互性都不是很好,因此出现了RIA程序,经过在浏览器中安装插件的方式来提升表现力和交互性,典型表明是Flash和Silverlight。因为已经不是HTML了,这种方式更像是客户端程序,而不是BS程序。因为RIA自己的局限性和HTML5的快速发展,RIA程序成为了过分方案,正在淹没在HTML5的大潮中。工具

以HTML5,CSS3做为表现层的BS技术拥有不错的前景,但我的认为BS技术适合的领域和CS是不冲突的。BS程序适合面向大众的互联网程序,在浏览器端之内容呈现为主,拥有不太复杂的界面和交互以及业务逻辑,在服务器端能够很复杂甚至用到了云计算。CS客户端程序从早期的两层CS(客户端直接链接数据库),发展为三层CS(客户端链接应用程序服务器),其实和BS程序的架构已经很是类似。区别只是在于和用户交互的程序一个是浏览器中的跨平台Javascript程序,一个是操做系统平台原生支持的客户端程序。客户端程序能够和操做系统更为接近,并且性能更好,因此CS程序适合面向专业用户的局域网程序,在客户端能够拥有复杂的界面和复杂的交互逻辑以及业务逻辑,在服务器端能够复杂也能够不太复杂,视需求而定。布局

对于界面,交互和业务逻辑都很复杂的程序,例如大型的平台级程序,甚至复杂到VS,PS等大型生产力工具,显然更适合用客户端程序,不能片面地认为基于HTML5的BS程序会彻底取代CS程序。还有一种折中的方案,程序主体界面框架使用客户端方案,其中部分界面,尤为是之内容呈现为主的部分使用HTML方案。可能某些类型的程序,这样作更好,能使二者优点互补。

咱们下文要讨论的XAML是为CS程序服务的,BS程序使用HTML5,CSS3和Javascript。

Windows平台客户端程序开发

Windows的主要版本包括面向桌面的95,98,2000,XP,Vista,7,面向桌面和平板的8,8.1,面向手机的Windows phone 7,8,8.1。也就是说目前桌面和平板是统一的,和手机是割裂的。(Android平板和手机是统一的,苹果平板和手机是统一的,和桌面是割裂的。)微软意识到了这个问题,因此即将推出的Windows10是大一统全设备的。Windows各类平台的客户端的开发平台发展过程以下。

Windows桌面平台经历了Win32 SDK,MFC,VB6(Delphi,PB),Windows Form,WPF(AIR,JavaFX)等几个阶段。

微软RIA平台为Silverlight

Windows平板平台经历了Windows Store App 8(8.1),Universal Windows App,Windows 10 App三个阶段。

Windows手机平台经历了Silverlight for Windows Phone 7,Silverlight for Windows Phone 8(8.1),Universal Windows App,Windows 10 App四个阶段。

上述标为粗体的平台使用XAML技术,目前桌面平台的WPF和大一统的Windows 10 App具备较好的前景。WPF适合构建大型桌面平台,如生产力工具,VS,Blend,SQL Server客户端就是使用WPF开发的。Windows 10 App微软提出自适应控件的方案,适合跨设备应用程序开发。

前端开发的产生

早期把从事静态网页设计和实现的人员叫作网页工程师,他们使用table布局。随着时间的推移,DIV加CSS的方式成为了主流。再后来,静态网站已经不能知足需求,变成了BS程序,网页工程师变成了Web前端开发工程师,他们要使用Javascript语言和各类各样的框架,固然也须要HTML和CSS。因为BS程序在浏览器端通常没有较多的业务逻辑,因此Web前端开发工程师通常只负责表现层逻辑,若是存在较多的业务逻辑如GIS系统,可能由专门的Javascript程序员负责完成业务逻辑开发。

客户端前端开发的概念是从Web前端开发移植来的,指客户端表现层的开发,不包括客户端的业务逻辑层。早期的客户端平台好比Win32 SDK,既没有专门的表现层开发工具又没有开发语言,使用C/C++等程序设计语言开发,要想让学美术的人完成开发基本不太可能,只能采用出效果图,而后交由程序员实现的方式完成开发,效率和效果都不会很好。后来的平台好比Windows Form有了表现层开发工具,但没有开发语言,而且没有较好的机制和设计模式支持表现层和业务逻辑层分离,因此尽管美术人员能够参与部分表现层开发工做,但实施起来存在不少问题。

现代的客户端开发平台继承和发扬了Web的HTML语言的方式来构建表现层开发平台,其中有表明性的是XAML,Flex,JavaFX,Android几个平台。他们都使用基于XML的描述性语言做为开发语言,而且提供可视化的开发环境,使用一种强类型的程序设计语言做为背后支撑。完成表现层开发工做的前端开发人员只须要熟练掌握表现层开发语言极其机制,熟练使用表现层开发工具,少许掌握背后的程序设计语言就能够很好地完成表现层开发工做。因此美术人员转行作客户端前端开发成为了可能。其中我的认为微软的XAML技术作得较好,经过MVVM模式能够作到表现层和业务逻辑层较好的分离,Blend开发环境也作得很好。前端开发人员基本不须要会太多的C#,就能够完成大部分的工做。XAML前端开发人员完成表现层设计和开发,C#程序员完成业务逻辑层开发,这样配合效率和效果都会变得很好。

客户端前端开发的特色

网页通常采用固定宽度的纵向延伸的方式布局,而客户端程序通常是须要根据窗口大小自适应的,某些类型的BS程序也是须要自适应的。因此客户端前端开发和网页设计最大的区别就是自适应布局。网页设计习惯的先设计效果图,再裁图构建页面的方式可能并不适合客户端前端开发,由于效果图只能表明界面的一个状态的效果,而设计时就须要考虑在不一样窗口大小下的界面自适应布局。而且对于XAML这样的基于矢量的平台而言,不该该使用位图拼凑的方式构建界面,而应该从一开始就使用矢量的方式构建界面。因此XAML前端开发人员直接在Blend中完成基于矢量的自适应布局的表现层设计和开发是更好的方式。

客户端前端开发和Web前端开发的一个重要区别是控件封装,HTML首先是给浏览器解析使用的,而后才是给设计人员使用的,但只限于在网页设计的范围内。若是扩展到BS程序的范围就会出现问题,由于程序设计须要封装外观和功能,以便于复用,就是所谓的控件。而HTML并不能扩展,因此各类框架提供的控件只能经过Javascript来表达,并不能在HTML中以声明式的方式表达。这对于美术人员转行过来的前端开发人员来讲不是好事。XAML平台从最开始就被设计成为了客户端程序表现层开发服务。因此加入了控件封装,模板等重要机制,而且控件能够经过自定义的方式无限扩展,能够直接在XAML中使用,还能够在XAML中任意改变控件的外观。XAML平台可谓是为客户端前端开发人员量身定作的。其余客户端开发平台,如Flex,JavaFx和Android和XAML平台有不少的类似之处,Flex和JavaFx平台也使用MVVM模式,Android平台使用MVC模式,我的以为MVVM模式更能作到前端和业务逻辑分离。Flex的应用呈降低的趋势,JavaFx目前应用不是很广,因此XAML前端开发人员能够考虑同时学习一下Android平台,二者的类似之处仍是不少的,并且客户端的设计理念也类似。苹果的iOS平台和XAML,Android平台的区别较大,并且界面背后的XML语言不对开发人员开放,OC相对C#和Java而言难学,因此要想把前端开发人员独立出来较难。

XAML前端开发之路

我想象的前端开发人员的职业规划路线多是这样的,

1. 平面位图和矢量设计人员

2. 网页设计人员(可选)

3. 初中级WPF前端开发人员

4. 高级WPF前端开发人员,可进行表现层逻辑开发。

5. 多平台XAML前端开发人员,可进行Win10前端开发。

6. 多平台前端开发人员,兼作Android前端开发。

7. 全平台前端开发人员,也会iOS开发。

8. 跨平台UI交互设计师。

9. 资深用户体验专家。