Silverlight开发基础答疑(5)

很好玩的是看到了Silverlight目前在国内受到了很多开发者的热情拥护,“自由、创新、研究、探索”先生在Google Groups里面创建了一个讨论组,开张不到一个月,就有176名成员参与。而Silverlight中文社区也很快就开张了,当然,到现在为止,我还不知道站长是哪位,如果是您,请您在Comments里面说一声。嘿嘿,我还得向你收小道消息费用,估计你之所以抢注到这个名字,和我这个贴子还是有一些关系的。

8. Silverlight为什么不支持中文?有没有别的途径可以解决这个问题呢?

问题描述:我相信凡是准备采用Silverlight技术或者正在使用Silverlight构建应用程序的开发者,很多人已经开始怨声载道了,为什么Silverlight不支持中文(严格来说,是中日韩等字体)?其实原因很简单,这是一个法律范畴的问题,因为每个字库都有其版权信息,而且大部分字库是不允许转移使用的(比如常见的将Vista中的微软雅黑字体复制到XP或者手机上使用应该是非法的)。

解决方案一:请参见http://blog.joycode.com/joy/archive/2007/04/06/100553.aspx中的第二项解答,即使用Glyph来代替TextBlock;但这种解决方案存在很多问题,即Glyph本身不支持换行等操作,意味着你只能把它当作标签字体来使用,而无法用其来显示正文。另外,每次浏览这个页面时,都需要下载完整的字体文件,请注意,仅微软雅黑字体(不含粗体部分)就有15M左右大小。虽然现在使用宽带的人员越来越多,但仍然是一个非常大的负担。

解决方案二:使用ODTTF文件,所谓的ODTTF文件,其实是XPS所带的嵌入式字体文件,这种字体会自动从原字体文件中提取所需要的字样,而不是简单的拷贝原字体的所有字样。操作方法如下:

  • 首先使用Word或者写字板应用程序,使用您中意的字体输入你的Silverlight中所需要的文字;
  • 然后在Word或者写字板当中选择“打印”功能,打印机选择Microsoft XPS Document Writer(在您安装了.NET 3.0 Framework)后会自动增加;
  • XPS Document Writer本身是一个打印到文件功能,在其文件选择框中选择文件路径,并且给出相应的文件名;
  • 打印完成后,在文件浏览器中找到完成的XPS文件,并且将其后缀名由”.xps”修改为”.zip”;(其实微软的好多文件格式目前都使用了ZIP格式,比如Office 2007中的DOCX、PPTX、XLSX等等,都可以将名字改为ZIP后缀名,并且使用WinZip或者其它文件压缩程序打开)
  • 直接找到这个压缩文件包中的“\documents\1\resources\fonts”中的文件,并且将其提取出来,这个文件名大部分为一个GUID加一个ODTTF后缀名;
  • 将提取出来的ODTTF文件再次使用ZIP格式打包成myfonts.zip文件,并且放在您的Silverlight应用程序的根目录中;
  • 假设您的XAML中的TextBlock的名字为textBlock1,那么在其后端所跟的JS文件中使用Downloader控件进行修改,大体如下:

function onLoaded(sender, eventArgs)
{
  var control = sender.getHost();

   var downloader = control.createObject(“downloader”);

   downloader.addEventListener(“Completed”, “onCompleted”);

   downloader.open(“GET”, “myfonts.zip”, true);//注意此处的myfonts.zip,根据您的实际情况进行更改

    downloader.send();

}
function onCompleted(sender, eventArgs)
{
var myTextBlock = sender.findName(“textBlock1”); //此处是TextBlock的名称

myTextBlock.setFontSource(sender);

myTextBlock.fontFamily = “Microsoft Yahei” ;//注意此处的字体名称,我这儿是使用的“微软雅黑”字体,您可以根据实际情况使用

myTextBlock.text = myTextBlock.text;
}

 

总结一下,这样的解决方案在目前应该是最有效的解决中文显示问题的,当然,在您使用部分字体时,您必须要注意一下相关的法律问题,是否取得了所使用的字体文件的跨平台授权。(该解决方案对于动态显示文本仍然无效)。

解决方案三:Silverlight产品团队目前正在致力于该问题,解决此问题目前主要的困难并不是技术问题,而主要是法律上的一些issues.

 

我已经为解决方案二编写了一个小型的Demo,如果您感兴趣,可以在留言中留下您的邮件,我可以发送给您。(由于本人工作繁忙,无法全部发送,所以我只会发送给前五位留下邮件地址的朋友,后来的朋友可以给这五位朋友写邮件索要)。

 

参考信息

http://blogs.msdn.com/webnext/archive/2007/05/25/silverlight-font-embedding.aspx

http://wpf-e.spaces.live.com/blog/cns!2B248D261D0E0035!122.entry

WPF/E开发基础答疑(1)

很多朋友可能已经开始尝试使用WPF/E来在网络上制作一些动画,在其中可能遇到了一些问题。尤其是当前公开版本还是CTP,所以有一些东西在互联网中得不到解答,本人不才,准备通过本博客系列为大家进行答疑解惑。(由于WPF/E的正式名称即将公布,所以在正式名称公布后,本系列教程也会进行更新)

1. WPF/E是否可以支持嵌入式字体?

问题描述:在设计HTML网页的时候,我们会碰到很多类似的问题。一个网页中的字体在设计期非常好看,但当我们发布之后,却发现用户体验惨不忍睹,这其中最大的原因就是字体的不同。比如设计师使用Windows Vista来进行设计,使用了微软雅黑字体。而此种字体在早期Windows版本以及其它操作系统当中并不存在,浏览器会按照自己的方式来使用替代字体(或者CSS中指定的替代字体),从而导致用户体验非常差。如何解决这种问题呢?

解答:我们可以使用FontUri这种方式来嵌入字体,从而解决此种问题,根据当前版本的SDK文档中,我们可以看到,FontUri属性可以应用于Glyphs标签。

示例:  把字体从你的Windows/Fonts目录中拷出(或者从其它地方获得),拷贝到您的WPF/E相应的目录当中,然后在您的XAML语句中按照以下方式进行撰写:

  <Canvas x:Name=”GlyphDisplayCanvas” Canvas.Left=”0″ Canvas.Top=”0″ >

    <Glyphs x:Name=”GlyphDisplay” Fill=”Black” FontUri=”./simhei.ttf” FontRenderingEmSize=”48″ UnicodeString=”Hello, WPF/E?” />

</Canvas>

2. WPF/E如何支持中文显示?

问题描述:在前段时间我的文章留言中,有一位朋友询问如何支持中文。可能很多朋友已经注意到了,在TextBlock或者其它元素当中,如果输入中文,那么在最终显示效果当中,您可能会注意到,这些汉字全部显示为了一个规矩的方框,而不是我们想像中的汉字,那么如何解决此问题呢?

解答:的确在当前版本的WPF/E应用程序当中,很多元素其实不支持中文或者更准确地说,是双字节语言(比如韩文以及日文),但解决也比较简单,查看前面的问题解答,您或者已经得到了解答,即使用UnicodeString方式对其进行设置。当然,如果您查看SDK文档也会发现,这个UnicodeString也只能应用于Glyphs。

示例:同上面问题的解答一样,只需要把应用程序代码中的UnicodeString替换为中文即可,如下:

<Canvas x:Name=”GlyphDisplayCanvas” Canvas.Left=”0″ Canvas.Top=”0″ >

    <Glyphs x:Name=”GlyphDisplay” Fill=”Black” FontUri=”./simhei.ttf” FontRenderingEmSize=”48″ UnicodeString=”生日快乐,开心就好” />

</Canvas>

 

以上问题解答得益于公司同事Laurence Moroney(其太太是华人,前段时间刚访问过中国)

实时监测机场的起降情况

经常坐飞机,有时候就想能不能有一个系统能够让我了解我所乘坐的飞机的具体情况,以及机场的准确位置。当然,目前我对首都机场的了解简直比我家还要熟悉。上海虹桥、深圳以及广州白云等机场也是比较了解的。但是当我第一次到达西雅图机场的时候,当时还真有一些昏头昏脑,实在太大了,呵呵。

在首都机场的网站上,我们可以查找到各航班的信息,比如是否晚点、计划时间等,而且是以图表方式给出的。但是能否以更加精确的方式来反应呢?想像一下,如果您能够以实时动画的方式查看各个航班的信息:是否满员、飞机实时的具体位置、方向、起飞降落时间、机型等等情况,那是多么爽的一件事情呀?如果您对这件事情比较感兴趣,那么请看左图。这是苏黎士机场的实际运营情况。当然为了“反恐大业”的需要,您可以看到的这个版本使用了一些历史数据,而没有接收实时的数据。

网站地址:

http://wpf.netfx3.com/direct/zurich/zeuswpf.xbap

软件需求:

操作系统必须是Windows XP+SP2、Windows Server 2003+SP1或者Windows Vista,前两者操作系统必须安装.NET Framework 3.0。

键盘操作:

Ctrl+鼠标右键:扩大视野范围(Zoom Out)

鼠标左键拖动:移动视野范围

鼠标右键拖动:缩小视野范围(Zoom In)

英文博客信息:http://blogs.msdn.com/tims/archive/2007/03/27/great-wpf-applications-13-z-rich-airport.aspx

我感觉国内的一些ISV软件厂商可以借助WPF的机遇,做一些富有创新的软件,比如股票软件、基金软件等等。可能基于原来的软件开发的难度,有很多创新我们无法付诸实施,但现在既然有了WPF这么强大的工具,我们还在等什么呢?:)

互联网上的WPF实例

Windows Vista已经正式发布了,其实这也意味着.NET 3.0也正式发布了。只不过可能很多开发人员并没有真正意味到此种含义,现在已经到了使用.NET 3.0开发的时代了。我这儿还是主要专注于.NET 3.0中的WPF(”我佩服”)这一部分,很多人可能并不清楚WPF到底能够实现什么,或者有人参加过TechEd,看到过一些Hello World的实例,但总觉得意犹味尽,那么今天开心带大家到互联网上来体验几个真真正正的实在运行的WPF实例。

首先向大家推荐的就是New York Times(《纽约时报》)的离线阅读器了,对于希望学习英文的朋友这应该是一个比较好的例子。不知道各位看官有多少在每天早上到办公室后先到纽约时报的网站上查看当天新闻的。毕竟基于互联网阅读可能还是不太习惯,那么,赶快下载这款离线阅读器吧。真正的物有所值。这款阅读器实现了Smart Client(智能客户端)的特性:

  • 在联机时自动下载最新的新闻信息到客户端;
  • 可以进行本地阅读,在阅读时可以根据需要改变字体大小,并且实现了自适应排版;
  • 根据排版中的留白大小,自动插入合适的广告信息;
  • 非常棒的导航功能,可以在各栏目,各条目之间进行自动导航;
  • 强大的批注功能,可以使用文本或者墨水功能对其进行批注,并且将批注信息通过邮件与朋友分享;
  • 支持打印,可以将当天的报纸进行打印;
  • 强大的搜索功能,除了按照关键词搜索罗列信息外,还可以使用Tag(标签)功能列举相互的关系;

 

其次向大家推荐的就是大英图书馆(http://www.bl.uk )的在线图书借阅工具,大家知道,大英图书馆提供了很多珍贵的书籍,包括莎士比亚著作的原始版本,很Image: Open book多都是羊皮书,非常珍贵,可能不能让大家频繁借阅,而这个工具解决了这个难题。另外如果大家听过开心讲WPF的课程,基本上罗列了WPF帮助我们解决日常开发中的两个矛盾的问题:第一个是开发人员与设计人员协作开发的矛盾;第二个则是B/S与C/S的两难选择的矛盾。而大英图书馆的这个在线阅读工具可以让我们体会到WPF在制作B/S界面上的强悍之处。当然,这个在线版本也实现了Click Once技术的应用(在线体验: http://ttpdownload.bl.uk ):

  • 强悍的3D特征,请注意在您翻看书页时的书的光影、质感;
  • 更加拟自然的方式来表现书的内容,模拟我们日常生活中的翻书效果;
  • 放大镜功能,如果对某些文字需要看得更清楚,可以使用此功能;
  • 移动翻转功能,可以将书进行随意的移动,或者进行翻转查看;
  • 注释功能,可以在羊皮书上撰写自己的注释;

 

日后我们会向大家推荐更多实例,其实中国的互联网行业不缺乏创意,但在2006年,一直出现一种跟风现象,就是Copy 2 China (C2C)现象。大家举眼望去,目前在国内有多少视频社区,而这些视频社区均是沿袭Youtube的创意。国外有别针换别墅,国内马上有人闻风而动。国外有百万格子网格,国内也立即出现。到了2007年,我们不能老是沿袭这些老路,应该有更多的自己创意了。

曾经在Cnbeta.com的网站留言中看到有朋友说:据说今年是Gadget年。我说错了,去年是Gadget年,而今年,将会是WPF以及WPF/e年。在不久的将来,相信会在国内看到很多WPF的应用。

而您,如果是互联网从业者,不妨与我们进行联系,我们将会为您开发WPF或者WPF/e应用提供相应的帮助。本站上的唐海洋(前Visual Studio产品市场经理,现在负责Expression产品线)也将会帮助您熟悉这款产品。

WPF年已经来了,您还在等待什么?fingerscrossed

关于“单击此处以激活控件”

自从使用了Windows Vista上的IE7来浏览网站的时候(其实从IE6 SP2开始),经常会发现一些视频或者Flash网站出现了“单击此处以激活控件”的现象。现象就是在某些视频播放控件(Windows Media Player或者Real Player),或者是Flash动画,或者是其它有可视化界面的ActiveX控件的周围有一个虚线框,当鼠标移上去后,会显示“单击此处以激活控件”,只有当你在该控件上用鼠标单击或者按一下空格键,这个虚线框才会去掉,该ActiveX控件才可以正常使用。

其实要解决此问题非常简单,如果我们去看一下这个控件的代码,所有的ActiveX控件是使用内嵌式写入的。那么解决它就需要调用一下Java Script代码来解决。在JS中调用document.write(“<object classid=’XXXXXXXX’…的方式来往页面上写ActiveX控件就不会解决此问题。

为什么会有这种提示呢?原理也很简单,目前Web 2.0的出现,使网民开始当家做主。所有的网民均可以使用HTML Editor控件往我们的网站中输入内容,如果有人心怀恶意,用这种方式种一个木马ActiveX,而客户在不知情的情况下下载使用了,可能会带来灾难性的后果。所以微软会在IE6 SP2以后,提供这种方式以便对这种ActiveX的行为进行限制,只有当用户确认了才会激活此控件,允许它进行操作。

所以一些大型网站目前需要更改一下它们的代码,不要再使用内嵌式方法写入ActiveX控件,而改用Java script动态加载。比如CSDN目前的视频栏目其实就有这个问题。上周末在厦门参加IDG VC互联网创投大会时,发现与会的很多Web 2.0视频分享网站也都有此问题,在此向各位提醒一下。

将进酒,杯莫停

闲来无事,在CSDN上闲逛了一下,看到孟岩、韩磊两位老兄所写的《这一天终于来了》以及《“这一天终于来了”》,还有孙辉先生发表的《WPF,一次洗牌…》。顿时感到这一天真的来了,随着无数传教士(Evangelist)在全球范围内的摇旗呐喊,大家逐渐从站在远观望而慢慢围拢,WPF从远观之物变为亵玩之物也。

孟夫子、韩老兄,将进酒,杯莫停! 与君歌一曲,请君为我侧耳听!beerbeer

在韩磊老兄的文中提到孟岩曾经说过:“战术上成功,战略上失败——以后谁还肯为Windows做应用……”。但开心有不同意见,因为要想开发WPF,或者想运行WPF,机器上必须有.NET 3.0,而可以安装.NET 3.0的机器只有Windows XP(SP2+)、Windows Server 2003(SP1+)、Windows Vista以及Windows “Longhorn” Server。所以随着WPF应用的普及,这些操作系统也会逐渐普及。从而维护Windows的霸主地位。其实慢慢琢磨一下也可以看出来,微软的全套开发产品均是服务于Windows以及Office两大产品线的。大旗一竖,无数英雄豪杰聚集在其下。如果将Linux看作Windows桌面端的竞争对手,那么现在Linux平台上的应用缺少是一个无法逃避的事实。窃以为:IBM投资Eclipse实在是一个明智之举。

另外,韩磊也提到了另外一个感想,即Expression套件的直接竞争对手是Adobe,这有些短视了(韩磊莫怪)。当然,不可否认,很多受众,包括开心自己,在第一次看到Expression的演示时,都会有这种感觉。这与Adobe的产品线实在是太平衡了,简单就是短兵相接。但研究越久,越会发现,这种观点实在是有些太小看Bill Gates了。Bill Gates创建微软时曾经有一个梦想,要让每家每户的桌子上都有一台电脑,而且这台电脑上运行微软的软件。从1975年开始,整个微软就在为这个观念而奋斗。历史发展到21世纪,软件从当初注重性能(硬件的限制)、功能(大而全的软件)而逐步发展到更加注重用户体验。之所以出现这种趋势,是因为软件已经逐渐走下神坛,成为人们日常生活中所不可或缺的。而人们对日用品的选择标准就是:价廉物美。价廉促使SaaS产生,而物美导致软件厂商对于用户体验的重视。

正是在这种大势之下,微软才会推出WPF对整个软件生态链催熟。WPF的出现解决了三个问题:

  1. 更快速的开发更丰富的用户体验:使用WPF,可以在更加快速的时间内开发出来更加丰富的界面,满足用户的需求。所以我感觉孙辉先生学习WPF有些误入歧途,长此以往,会走火入魔的。如果仅仅是使用控件,建议您还是使用GDI+或者ASP.NET或者MFC等等就够了。WPF之所以有那些控件,我个人认为主要是为了向下兼容。WPF的目标应该是消除控件,让您开发出来的软件根本看不出来控件的特征,软件世界再也不是由Button+Textbox组成的怪物了。请注意左图,此款使用WPF开发的应用程序,你还能看到哪部分是控件吗?
  2. 消除用户界面差异:也请注意左图,这就是一款使用WPF开发的应用程序,而且它是以IE为宿主的。如果只是看这部分截图,你可以区分它是Windows Application还是Browser Applicaiton吗?历史在1995进入一个鸿沟,开发人员突然变成了两大阵营:B/S开发人员以及C/S开发。而现在到了应该弥补这个鸿沟的时候了。WPF正是背负着这个历史责任;
  3. 软件开发团队的协作问题:软件开发团队的日常协作是一个非常大的问题,除了需求变更以外,第二个影响开发进度的就应该是团队协作性了。在软件团队中,我们比较熟悉Developer、DBA、Tester、IT Pro、Architect等。Designer可能往往被我们忽视,但实际上,Designer的工作成果才是与客户距离最近的。而且Designer与Developer如何配合工作,是很多团队所头疼的,而WPF正可以解决此问题。这儿对孙辉先生再说一句:XAML并不是WPF的另外一个名字,它是使用声明性编程方式实现WPF的一种文件格式。

我最近疯狂迷上了一些美国科幻剧:《24》、《Lost》、《Prison Break》、《Heros》、《The 4400》,在里面经常会有一些使用电脑软件的镜头,而且那些软件界面真的越炫(Lost中那个只能输入4 8 15 16 23 42的不计入内),曾经记得Jack Bauer的那个PPC与电脑同步的镜头,让我感觉在Redmond看研究院的同事做Demo一般。或者随着WPF的出现,这种炫界面的应用程序会很快进入我们的日常生活当中了!

孟夫子,韩老兄,将进酒,杯莫停!!

Sidebar Gadget开发教程(4)

今天继续讲Sidebar Gadget的开发。此篇将是本教程的最后一篇,因为了解了Gadget的大体情况后,接下来就需要大家自己进行练习了。只有勤于练习,而不是安心看教程,你才会积累丰富的开发经验。而且有些细节其实只需要点一下即可,不需要再详述。

从两周前开始,我们面对两个Partner进行了Gadget开发的Workshop。并且每个Partner均讲述了真实的Requirement,进行Job training。目前来看,这种效果非常不错,建议各位也可以在工作中进行学习。

在上一节教程当中,我们在最后给出了几个问题。现在一一回答该问题。

  • Gadget当中如何含有设置界面?即那个类似于小板手似的图标?

其实这个问题的答案很简单,只需要在主界面所关联的Javascript中加入一句:System.Gadget.settingsUI = “settings.htm”;即可,该语句中的settings.htm可以取代为其它名字.

  • 如何使Gadget出现Flyout界面?

这个问题如上所示,只需要加一句:System.Gadget.Flyout.file=”flyout.htm” 即可,同理,此句中的flyout.htm也可以换成其它的文件名。在需要显示Flyout界面时(比如某个超链接点击事件,或者某个图片控件的双击事件),调用System.Gadget.Flyout.show=true即可,不需要其它设置。当然,你可以在显示时进行一些其它的处理,那么可以调用它的事件函数即System.Gadget.Flyout.onShow(指向一个函数名),其对应的隐藏事件函数为System.Gadget.Flyout.onHide函数

  • 如何得到系统信息?

Sidebar为Javascript扩充了一些API,用于执行外部命令,或者得到系统信息,或者对于Gadget内部本身的调用(如上面的Flyout以及SettingsUI),关于这些API的详细信息,可以参阅:http://msdn.microsoft.com/library/default.asp?url=/library/en-us/sidebar/sidebar/reference/refs.asp 得到更加详细的信息。

  • 如何在没有使用ASP.NET AJAX框架的基础上出现局部刷新效果?

更加简单了,使用Microsoft XMLHTTP这个函数的异步调用方式,关于XMLHTTP的更加详细信息,可以参阅相关信息。其中有关于如何实现异步调用的。另外,在调用时,如果遇到IE缓存问题,可以使用setRequestHeader(“If-Modified-Since”,”0″)方式解决(感谢Symbio提供信息),而分析XML,可以使用Microsoft XMLDom来进行。

  • 有些Gadget当置放在Sidebar上显示样式是一种,而拖到桌面上会有另外一种显示方式,这是如何实现的?

这个更简单了,查看了下这些Gadget的源代码,可以知道,通过Gadget的System.Gadget.docked的属性可以得到其是否放置在Sidebar上(当为True时,是在Sidebar上),然后再调用JS来对于其CSS特性进行更改即可。

好了,Sidebar Gadget的教程到此结束。非常感谢大家。:)

Sidebar Gadget开发教程(3)

话说从前,书接上回。开心已经向大家提出了一个需求,并且给出解决技术难题的思路,不知道有多少位朋友已经开始尝试编写自己的第一个非“Hello World”的Sidebar Gadget了。那么今天开始,我们就开始逐步介绍开发Sidebar Gadget的具体方式。

使用Gadget.xml来定义Sidebar Gadget

就像计算机语言都会有一个入口函数一样,Sidebar Gadget在启动时也会有一个主入口,而这个主入口文件呢就是Gadget.xml。但该文件你可以存放在多个区域,即Gadget的根目录,或者Gadget的地区语言(如zh-cn, en-us等)目录。按照我的理解,Gadget应该先会找最适合地区语言目录下的Gadget.xml,其次再找根目录中gadget.xml,而一个典型的Gadget.xml文件结构如下所示(Vista自带的时钟Gadget的描述文件,文档中红色文字为开心的注释文字,而注释中的数字标识与附图中的数字标识一一对应):

<?xml version=”1.0″ encoding=”utf-8″?>
<gadget>
<name>时钟</name> 定义Gadget名称(1)            
<namespace>microsoft.windows</namespace> 定义Gadget的命名空间,与JS交互
<version>1.0.0.0</version> 版本信息(2)
<author name=”Microsoft Corporation”> 作者信息(3)
<info url=”http://go.microsoft.com/fwlink/?LinkId=55696″ text=”www.gallery.microsoft.com”/> 作者网站的链接地址(4)
<logo src=”logo.png”/>作者的Logo信息(5)
</author>
<copyright>? 2006</copyright> 版权信息(6)
<description>查看您所在时区或全球任何城市的时钟。</description> 功能描述信息(7)
<icons>
<icon height=”48″ width=”48″ src=”icon.png”/> 显示在小工具待选箱时的图标(8)
</icons>
<hosts>
<host name=”sidebar”>仅支持Sidebar,未来如果大一统了,可能Live.com或者Slideshow都会使用统一的方式
<base type=”html” apiVersion=”1.0.0″ src=”clock.html”/>type仅支持html,未来有可能会支持WPF,WPF/E或者AJAX;src用以指明主界面的HTML源文件
<permissions>full</permissions>目前仅可以设置Full,请参阅此文
<platform minPlatformVersion=”1.0″/>
<defaultImage src=”drag.png”/>在从小工具备选箱用鼠标拖到Sidebar时所显示的Logo
</host>
</hosts>
</gadget>

 通过上面的信息,Sidebar可以得到Gadget中的相关信息,但一个Gadget还不止如此,比如上面的这个时钟显示在Sidebar当中时,应该如 左图所示。在这个截图中,我们注意到有一个小扳手式的图标,使用它可以选择自己心爱的钟表外型或者进行其它的自定义设置,那么此部分是如何反应在源代码中的?

还有,有一些Gadget,比如自带的RSS Reader,当单击某文章标题时,会自动在左侧弹出来一个Flyout窗口,这个窗口的设置如何在源代码中反应呢?

还有,系统自带的那个CPU以及内存使用量的Gadget,类似于汽车的转速表,它又是如何得到这种实时的系统信息的呢?

还有,当把一个Gadget从Sidebar拖到桌面时,其页面大小会发生改变,这又是为什么呢?

还有,Gadget中有很多透明效果,比如那个表的周围就是透明的,呈一个圆形,或者其它类型,而不是我们常见网页的矩形,这又是为什么呢?

还有,Gadget中的服务器端与客户端交互实现局部刷新却又没有使用ASP.NET AJAX框架,这又是为什么呢?

呵呵,如果你感兴趣,欢迎继续阅读本教程,今天就先到这儿吧。

Sidebar Gadget开发教程(2)

由于近期在努力学习Sidebar Gadget开发技术,并且也与中国汽车网合作做了一个Sidebar Gadget,所以耽误了一些时间,但同时,也通过这个机会加深了学习印象。

很多朋友在学习新技术的时候,都喜欢做Hello World。我原来也是这种情况。其实我认为这种方式有百害而无一利,就类似于学英语开始背单词一样,背了十多年,还没有背到F开头的单词呢。因为Hello world就让你产生了一种虚伪的成就感,而稍微一深入进去,遇到一点挫折,就会有畏难情绪,再也坚持不下去了。最后产生的结果无非就是眼高手低,或者眼低手低。

所以本教程我想使用一个实际项目开始,这个项目就是为ChinaCars.com开发一个小型的Gadget,要完成的主要功能如下:

  1. 根据你选择的城市以及价格区间,以幻灯片形式来显示符合条件的车型图片;
  2. 图片切换可以实现Powerpoint中的那种幻灯片切换效果;
  3. 点击某个车型图片,可以显示该车型的详细信息。

功能需求很简单,但使用HTML+Javascript+CSS完成它,可能就需要时间了。因为:

  • 开发Gadget没有一个IDE,无非所见即所得;
  • 无法进行Debug,只能写Track信息来追踪;
  • 资料比较少,只能看Windows Vista自带的Gadget源代码,或者去看SDK
  • 用ASP.NET时间久了,Javascript与HTML知识忘光光了。

另外一点,中国汽车网没有提供API怎么办?不会让我自己来去分析HTML吧?没有关系,我把这个接口暴露给大家,大家可以自己尝试一下。使用接口1,你可以得到一个车型信息列表;使用接口2,你可以得到一个车型详细信息的RSS。简单吧?具体参数的使用说明,自己多试几下就知道了。

那么建立远程HTTP连接呢?在.NET中我们还有HttpRequest来使用,在Javascript中,我们就只能使用Microsoft.XmlHTTP这个ActiveX对象了,不过也非常好用,而且像异步呀、状态信息呀都一个不少的实现了。分析XML也不必使用XmlDocument这个.NET类,你完全可以使用Microsoft.XmlDom这个ActiveX对象。

我的Gadget其实已经完成了,现在来考考大家了。虽然我平常工作比较忙,但仍然使用三个晚上的时间完成了这部分代码。那么我留出一周的时间,如果大家感兴趣,先自己试着开发一下。一周后,我会公布我的源代码给大家的。如果您在一周内完成了,欢迎打包成.gadget文件,通过邮件发送给我,说不定会有神秘礼品呢。

另外,也号召一下各网站的开发高手,发挥你的创意,为你的网站增加Gadget。抢占完用户的桌面,霸占了用户的IE,现在到了抢占用户Sidebar的时候了!让客户接受你,你就要有好的创意。如果贵网站在国内按流量综合排名在前一百以上,或者是比较酷的网站,有应用Gadget的好创意的话,也可以与我联系。Microsoft将会选择一部分网站做相关的市场活动。

BTW: 如果您的公司在开发类似于Forums、Blog等相关Web通用系统的话,如果想应用Gadget,或者想迁移到ASP.NET,或者想与Microsoft作一系列的市场活动,也可以与我联系。(曾经给Discuz!发过一封邮件,但石沉大海)

BTW Again: 如果贵公司或者个人精通Gadget,Expression,AJAX,Card Space,也可以与我联系。我们需要合作伙伴,帮助我们的客户进行培训与实施,并且支付相关费用。

WPF, WPF/E释疑

什么是WPF,经常看博客堂以及博客园的朋友,我相信眼睛都快磨出茧子来了。WPF嘛,就是现在称之为Windows Presentation Foundation,小名叫Avalon的那个东东,为了更好的实现Windows Vista体验的基础层架构,是.NET 3.0的一部分。如果一句话以蔽之,就是一个更有生产力的、更统一的用来管理用户界面、文档及多媒体等的模型。再仔细说说,更有生产力就是指开发丰富实用外观不费劲,易于快速开发,而更统一则是指开发B/S以及C/S可XAML方式以统一知识域,不需要分而化之。

讲到WPF,就要提到XAML,XAML是WPF的声明性语言,提供对界面、文档以及多媒体等界面层逻辑的渲染。而且XAML可以直接在IE中打开(如右图)。同时,还有一种XBAP方式(如左图),也可以在IE中打开。两者会有一些异同,这在下面会做表述。

那么WPF/E呢,可能知道者就比较少了。这里面的E是指的Everywhere,也就是可以让WPF到处可以运行。我们知道,WPF本身是WinFX也就是现在的.NET 3.0的一部分,所以想要运行WPF,客户端必须安装.NET 3.0,而.NET 3.0的安装条件是Windows XP、Windows Vista、Windows Server 2003、Windows Longhorn Server之四大金钢。那么你如果想让WPF到处可以运行,就必须首先做到.NET可以到处安装。虽然说有专家预计在Windows Vista推出24月之内,全球会有2亿用户会使用上已经内置.NET 3.0的OS。但还有很多兄弟们仍然战斗在其它操作系统、其它浏览器、其它设备上,如何让这些兄弟们可以共享WPF之乐呢?这就是WPF/E。

而WPF/E,小名Jolt,目前正在紧锣密鼓的开发当中,一些细节尚未披露,目前可以知道的是它是使用Javascript来实 现,用来使其可以跨平台、跨浏览器、跨设备来使用。它也同样采用有些异构化的XAML来编写(主要添加了一些特殊的Javascript标记)。

对于开发人员来说,喜欢究根问底。这些方式,.EXE, .XAML,.XBAP还有WPF/E到底有何异同?在各种场合下面应该如何使用呢?我相信很多人会非常好奇。虽然看了很多DEMO,相信也有一些朋友在一些细节上还是有很多模糊。在青岛的时候,我做了下面这个表(当时展波兄也通过越洋电话提供免费支持),希望对大家有帮助。

.EXE XAML XBAP WPF/E
IE宿主运行 No Yes Yes Yes
支持其它浏览器 No No No Yes
支持其它操作系统 No No No Yes
跨设备 No No No Yes
支持业务逻辑 Yes No Yes Yes
需要.NET 3.0 Yes Yes Yes No

 

希望对大家理解这些概念有所帮助。

补记:关于.NET 3.0的命名,我个人总觉得是一个败笔,因为.NET 3.0必须依赖于.NET 2.0的存在,没有.NET 2.0,则无法使用.NET 3.0,所以可以说.NET 3.0=.NET 2.0+WPF+WCF+WWF+WCS+…。同时原计划中的3.0有可能会被命名为3.5,而3.5倒不必依赖于3.0了,不然就没完没了了。据说当初之所以改名字是怕别人混淆,怎么刚推完.NET,又开始推WinFX了?归纳到同一品牌下我没有异议,但突然直接升级为3.0,倒使得此事有些让人混淆了,甚至有些同事至今都分不清WinFX与.NET 3.0的区别。