用XAML做网页！！—开篇

原文:用XAML做网页！！—开篇

这几日一直没发表新文章，一来是因为事比较多，二来就是我在研究使用XAML挑战传统HTML来做网页，这很可能是在全球的首次尝试，至少我从未找到任何可供参考的相关资料。

我对这次挑战的结果打7分：

XAML在页面布局、图形、动画及可控性方面的表现堪称完美，我甚至根本想不出来有什么能与之平分秋色；

兼容性方面，XAML通吃所有Windows平台的各种浏览器，它实际上都是由后台的那个叫“Windows 演示基础主机”来解析和呈现的，所以只要是装有.Net 3.0的系统，不管什么浏览器都可以看，而且看起来都一样(非IE7的话会自动加一个导航条用来控制前进和后退)；

对于XAML功能性测试不在本次挑战的范围内，因为我为挑战HTML而完全使用XAML来创制，没有加入任何程序代码，但WPF浏览器应用程序的功能性之强大是显而易见的，说白了它就是一个套着浏览器马甲的Windows桌面程序，这显然比JS等脚本语言能实现的功能要多得多；

XAML的呈现速度相比HTML来说存在差距，这主要体现在页面的载入和刷新时的等待上，不需要任何测试工具，你就能了解到它们的载入所需时间差异，但好在延迟不算太大，且对于XAML卓著的功能来讲，这是完全可以接受的；

XAML明显的不足来自于文本布局，曾以为流文档可以完全胜任这方面的工作，谁知它和页面布局的接合能力简直可以用“一团糟”来形容，我认为这些是设计上的重大缺陷，在后面我会对此进行总结。

我会在接下来的文章中重现我的创制步骤，在此之前先来展示一下最终实现的效果：



完整尺寸页面抓图

运行在Vista系统IE7中的抓图

运行在XP系统FireFox中的抓图（未安装微软雅黑字体，所以字体看起来比较难看）

此示例所呈现的内容除了正文中那个外链的小插图外，所有均使用XAML描述，未使用任何点阵图、Flash动画及程序代码，最终用于浏览的文件只有下面这些XAML文件：



其中default.xaml是主页面，Info.xaml是嵌入到内容区域的流文档，其余均为由 Microsoft Expression Design 设计的图形资源。

此示例所产生的布局是液态的。页面宽度可随浏览器宽度伸展，我设定了页面最小宽度为1000；页面高度是随其内容而变化的。

创作步骤请待下篇。