0831在浮山

August 31st, 2009 § 0

设备 Sony A300 Kit
位置 青岛 浮山

青岛浮山

青岛浮山

青岛浮山

青岛浮山

青岛浮山

青岛浮山

Popularity: 1% [?]

Silverlight 3 OOB (2)

August 29th, 2009 § 1

Silverlight 3 OOB (1)

前文对原理做了简要分析,该篇将针对做部分应用。

总述

在Silverlight 3正式版发布之前,开启该功能,需要修改Properties文件夹下的AppManifest.xml文件。

代码如下:

  1. <Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
  2.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  3.     <Deployment.Parts>
  4.     </Deployment.Parts>
  5.      <Deployment.OutOfBrowserSettings> 
  6.     <OutOfBrowserSettings 
  7.       ShortName="oob"> 
  8.       <OutOfBrowserSettings.WindowSettings> 
  9.         <WindowSettings Title="I support OOB" /> 
  10.       </OutOfBrowserSettings.WindowSettings> 
  11.       <OutOfBrowserSettings.Blurb> 
  12.         Saving your Silverlight offline. 
  13.       </OutOfBrowserSettings.Blurb>
  14.     </OutOfBrowserSettings> 
  15.   </Deployment.OutOfBrowserSettings> 
  16. </Deployment>

可设置的OutOfBrowerSettings属性。

ShortName – 程序在桌面或开始菜单中的显示名称。
Title – 程序运行时标题栏的现实内容。
Blurb – 程序的备注内容。

当F5运行该程序时,可以看到下面的菜单:

选择第二项。选择添加到开始菜单或者同时安装到桌面,默认选择开始菜单:

移除离线程序也很简单。右键单击运行中的离线程序,选择第二项:

silverlight-oob-3

在Silverlight离线程序中同样可以自定义桌面图标,开始菜单图标等。需要创建四个不同尺寸的PNG文件,16X16、32X32、64X64、128X128。把它们添加到项目中并指定路径,设置图标文件的Build Action的属性为Content。

  1. <OutOfBrowserSettings.Icons> 
  2.         <Icon Size="16,16">Images/sl16.png</Icon> 
  3.         <Icon Size="32,32">Images/sl32.png</Icon> 
  4.         <Icon Size="64,64">Images/sl64.png</Icon> 
  5.         <Icon Size="128,128">Images/sl128.png</Icon> 
  6.       </OutOfBrowserSettings.Icons> 
  7. </OutOfBrowserSettings.Icons>

现在就可以得到自定义图标了。

完整的AppManifest.xml文件。

  1. <Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
  2.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  3.       EntryPointAssembly="silverlight-oob" 
  4.   EntryPointType="silverlight-oob.App" 
  5. >
  6.     <Deployment.Parts>
  7.     </Deployment.Parts>
  8.      <Deployment.OutOfBrowserSettings> 
  9.     <OutOfBrowserSettings 
  10.       ShortName="silverlight-oob"> 
  11.       <OutOfBrowserSettings.WindowSettings> 
  12.         <WindowSettings Title="I support OOB" /> 
  13.       </OutOfBrowserSettings.WindowSettings> 
  14.       <OutOfBrowserSettings.Blurb> 
  15.         Saving your silverlight offline 
  16.       </OutOfBrowserSettings.Blurb>
  17.         <OutOfBrowserSettings.Icons> 
  18.         <Icon Size="16,16">Images/sl16.png</Icon> 
  19.         <Icon Size="32,32">Images/sl32.png</Icon> 
  20.         <Icon Size="48,48">Images/sl48.png</Icon> 
  21.         <Icon Size="128,128">Images/sl128.png</Icon> 
  22.       </OutOfBrowserSettings.Icons> 
  23.     </OutOfBrowserSettings> 
  24.   </Deployment.OutOfBrowserSettings> 
  25. </Deployment>

Silverlight 3 的OOB并不支持对窗体的修改。

在Silverlight 3 以及 Expression Studio 3 (Expression Blend 3)正式发布时,这个OOB设置方式进行了简化。无需设置Appmanifest.xml,你可以在Properties看到OutOfBrowserSettings.xml文件。

  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <OutOfBrowserSettings ShortName="silverlight-oob" EnableGPUAcceleration="True">
  3.  
  4.     <OutOfBrowserSettings.Blurb>
  5.         A short description of the application.
  6.     </OutOfBrowserSettings.Blurb>
  7.     <OutOfBrowserSettings.WindowSettings>
  8.         <WindowSettings Height="600" Width="800" Title="silverlight-oob" />
  9.     </OutOfBrowserSettings.WindowSettings>
  10. </OutOfBrowserSettings>

在Expression Blend 3中,选择Project->Silverlight Projects Options->Enable Application Outside Browser。

Demo

联系人管理器(由微软提供)

Popularity: 8% [?]

(译)在Silverlight中播放YouTube HD视频

August 27th, 2009 § 0

译:Silverlight tutorial: Play HD YouTube videos with Silverlight

当Silverlight 3 宣布支持 H.264格式,即可以在Silverlight程序中创建媒体播放器并直接播放YouTube的高质量视频。

准备

1.第一步取得HD格式视频的地址。YouTube对所有的视频进行了不同格式的编码,该教程中使用到的是HD MP4格式。

2.取得YouTube HD视频的地址有很多方式。我使用的是Firefox插件YouTube HD Ultimate script。基本的想法是该脚本允许你下载不同格式的YouTube视频,其中会包含HD MP4。

继续
3.现在取得了视频的地址:

  1. http://www.youtube.com/get_video?
  2. video_id=8yuIw_0ejLs&amp;t=vjVQa1PpcFPrX3tFoahhu4DbniDIqTLkwybdm8xuCt8%3D&amp;fmt=22

4.复制地址到MediaElement的Source属性,F5运行后即可以看到HD视频。

5. 这是相关的XAML代码:

  1. <MediaElement HorizontalAlignment="Left"
  2. VerticalAlignment="Top"
  3. Source="http://www.youtube.com/get_video?
  4. video_id=8yuIw_0ejLs&t=vjVQa1PpcFPrX3tFoahhu4DbniDIqTLkwybdm8xuCt8%3D&fmt=22"/>

锦上添花

6.用MediaPlayer控件替换MediaElement,你可以在Expression Blend 3 的Assets面板中找到。(译注:需要完整安装Expression Studio,此控件由Expression Encoder3驱动支持。)

7.可以在设计面板的操作设置视频来源地址。

8. 点击Properties选项卡找到Media部分,可以看到Playlist标签。通过点击New按钮,Items(colletion)…增加新的PlayerlistItem。

9. 相关的XAML代码:

  1. <ExpressionMediaPlayer:MediaPlayer >
  2. <ExpressionMediaPlayer:MediaPlayer.Playlist>
  3. <ExpressionMediaPlayer:Playlist>
  4. <ExpressionMediaPlayer:Playlist.Items>
  5. <ExpressionMediaPlayer:PlaylistItem
  6. MediaSource="http://www.youtube.com/get_video?
  7. video_id=euwBiiiWcYE&amp;t=vjVQa1PpcFP0qThbkuhvZDM_uyxS8zusQuz1JvlPhyo=&amp;fmt=22"
  8. Title="Star Trek Trailer" VideoHeight="800" VideoWidth="600"/>
  9. </ExpressionMediaPlayer:Playlist.Items>
  10. </ExpressionMediaPlayer:Playlist>
  11. </ExpressionMediaPlayer:MediaPlayer.Playlist>
  12. </ExpressionMediaPlayer:MediaPlayer>

10. F5运行后会是这样子滴:

11.延伸阅读:Adam Kinney MediaPlayer control included in Silverlight 3

Popularity: 3% [?]

Silverlight 3 OOB (1)

August 26th, 2009 § 5

名词解释

OOB (Out of Browser): Silverlight 3新特性之一。在浏览器中运行的Web应用界面与传统桌面软件比起来总是死板,不够灵活的。因此,人们就产生了需求,想在浏览器之外运行web应用。Adobe的Air可以实现这个功能,而Google的解决方案是Chrome里的shortcuts。给Web应用建立了shortcuts之后,就可以按照人们习惯的方式启动这个应用,而界面也很传统软件非常接近了。微软的解决方案则是Mesh,或者最新的Silverlight OOB功能。

原理简析

分离程序

当用户第一次浏览应用程序可能是在浏览器的某个位置。当你的程序支持out-of-browser(OOB)体验时,用户可以通过引起事件分离程序。接着会出现下面的情况:

detach

该动作捕获浏览器(例子中虚拟地址 http://foo.com/mysloob.xap)并创建一个OOB程序。

  • 程序(XAP)需要再一次通过浏览器请求数据。
  • 当XAP下载时,在低信任区域中取得本地存储的元数据,包括XAP的原始URI元数据以及重要的ETag信息(本质上是时间戳)。

首次运行OOB

如果我们关闭程序并再次在桌面上运行程序:

launch1

在这种情况下程序会检查它的元数据XAP的原始URI并进行一次请求。对比HTTP的响应数据(代码以及Etag)。如果程序没有更新,程序会正常运行。事实上,程序的检查请求基本上会是这样:

  1. GET /silverlight/oob/ClientBin/OutOfBrowser.xap HTTP/1.1
  2. If-Modified-Since: Thu, 19 Mar 2009 03:52:35 GMT
  3. User-Agent: Silverlight
  4. Host: timheuer.com
  5. X-P2P-PeerDist: Version=1.0
  6. Accept-Encoding: peerdist
  7.  
  8.  
  9. HTTP/1.1 304 Not Modified
  10. Last-Modified: Thu, 19 Mar 2009 03:52:15 GMT
  11. Accept-Ranges: bytes
  12. ETag: "f2e3a81746a8c91:445"
  13. X-Powered-By: ASP.NET
  14. Date: Thu, 19 Mar 2009 03:55:18 GMT

需要注意的是HTTP 304 Not Modified的响应。没有更新信息发送时我们可以看到没有传递信息。程序不会发生变化。在API层,作用于改变DetachedUpdatesAvailable状态的Application.Current.ExecutionState没有被触发。

用户从桌面运行,程序升级

现在我们更新程序并上传到服务器。用户下一次运行程序时,同样的请求出现:

launch2

再一次,请求发送元数据信息。不过这次,有更新了。过程也是加倍的。连同响应发送了新时间戳/ETag,请求同样包括了更新程序。请求会是这样的:

  1. GET /silverlight/oob/ClientBin/OutOfBrowser.xap HTTP/1.1
  2. If-Modified-Since: Thu, 19 Mar 2009 03:52:35 GMT
  3. User-Agent: Silverlight
  4. Host: timheuer.com
  5. X-P2P-PeerDist: Version=1.0
  6. Accept-Encoding: peerdist
  7.  
  8.  
  9. HTTP/1.1 200 OK
  10. Content-Length: 15557
  11. Content-Type: application/x-silverlight-app
  12. Last-Modified: Thu, 19 Mar 2009 03:56:29 GMT
  13. Accept-Ranges: bytes
  14. ETag: "ce39d0ae46a8c91:445"
  15. X-Powered-By: ASP.NET
  16. Date: Thu, 19 Mar 2009 03:56:45 GMT  17: <data>

“data”之上的部分事实上是更新XAP的数据(注意Content-Length与Content-Type headers)。

  • Application.Current.ExecutionState改变为DetachedUpdatesAvailable 状态。
  • 本地存储的XAP更新了数据。

当前还没有选项可以拒绝更新数据。如果程序已更新,用户就会获得它们。这是开发团队考虑到不同使用环境的设定。同样的,不能强制用户关闭程序或者阻止程序继续使用。在某种意义上,你或许可以通过更新程序使下次运行时屏蔽UI。再次运行程序(从本地机器)会进行数据更新,更新请求会跟首次相近:

  1. GET /silverlight/oob/ClientBin/OutOfBrowser.xap HTTP/1.1
  2. If-Modified-Since: Thu, 19 Mar 2009 03:56:49 GMT
  3. User-Agent: Silverlight
  4. Host: timheuer.com
  5. X-P2P-PeerDist: Version=1.0
  6. Accept-Encoding: peerdist
  7.  
  8.  
  9. HTTP/1.1 304 Not Modified
  10. Last-Modified: Thu, 19 Mar 2009 03:56:29 GMT
  11. Accept-Ranges: bytes
  12. ETag: "ce39d0ae46a8c91:445"
  13. X-Powered-By: ASP.NET
  14. Date: Thu, 19 Mar 2009 03:57:12 GMT

上述是Silverlight 3 OOB的基本原理。当程序被分离,与app相关元数据被存储。每一次运行时检查一次元数据,确认升级是否可用。如果程序离线,也不会阻止程序运行。这与部署.NET Framework的ClickOnce观念类似。

延伸阅读
微软 Google云计算基础技术的比较
silverlight 3 offline update framework

Popularity: 8% [?]

在Expression Blend 3中快速创建图像笔刷

August 25th, 2009 § 1

之前在Blend中创建一个图像笔刷需要很多步骤。Blend3中对此进行了改进。

复制一个图像到剪贴板

粘贴图像到Resource Dictionary

打开Blend 3 并选择 Resource标签,选择可定义图像笔刷的资源区域。右键点击App.xaml文件并选择粘贴Paste。

clipblend-paste-resource

增加下列xaml代码到App.xaml文件中Application.Resources部分

  1. <ImageBrush x:Key="Image" ImageSource="Image.jpg"/>
  2. <!-- Image.jpg为图像文件名 -->

Popularity: 2% [?]

Where am I?

You are currently viewing the archives for August, 2009 at Mdong·s Space (小气的神).