为你的博客边栏增加Silverlight内容

开心相信很多朋友都已经建立了自己的博客,而且也从其它网站上寻找各种各样的边栏小插件来丰富自己的博客内容,目前大部分都是使用Javascript或者Flash来构建,而现在,我们可以直接使用Silverlight了。下面介绍一个方案,可以在不占用自己空间,也不编写代码的情况下为您的博客添加相应的媒体内容。

1. 下载Microsoft Expression Media Encoder八月社区预览版以及Silverlight 1.0 RC版

EME(Expression Media Encoder)可以从http://www.microsoft.com/expression上进行下载,请注意,我们下载的Expression Media Encoder,而非Expression Media。然后再到http://www.silverlight.net下载Silverlight 1.0 RC版,以及Silverlight 1.1 Alpha Referesh版本。

2. 使用EME制作您的Silverlight媒体

imageEME可以帮助我们制作Silverlight相关的多媒体内容,其主要功能就是可以将我们的录播或者直播的视频内容以Silverlight方式向外界分发,其界面截图如右图所示(这是显示的将现有视频转换为VC-1编码,并且再通过Silverlight模板发布的视图,您也可以选择直播,即Live视图,通过摄像头及麦克风直播)。

EME主要有以下功能:

1)将现有视频根据需要转化为VC-1编码的WMV格式;

2)对视频进行编辑,包括分割、组合、视口大小裁剪、压制水印等;

3)在视频格式转化时,可以启用A/B Compare模式,在转化过程中实时对比转化的效果;

4)根据选择的时间点进行截图,制作为DVD Index模式;

5) 在视频内容中添加脚本代码等;

6) 添加各种嵌入式的Meta data;

7) 根据所选择的模板,为视频添加Silverlight互动内容,可以直接发布到现有网站上;

EME的使用非常简单,也很直观,您可以直接下载,估计通过不到半小时的学习时间,您就可以成为EME高手了。我们在这儿,所需要做的就是选择一个现有的视频文件(当然,您也可以直接录制一个自我介绍),使用EME进行编辑后,选择一个输出模板将其转化为Silverlight内容。

3. 将其上传到Streaming Live上,与大家分享

 微软为了推广Silverlight,在http://streaming.live.com上为各位网友提供了免费的5G空间,上传Silverlight内容。每个Silverlight作品不大于22M,这意味着您可以上传10分钟左右的700Kbs质量的视频(由于我们想放在博客边栏上,所以我们其实只需要选择200Kbs质量就可以了)。您现在可以先去申请这个空间。申请完成后,可以简单看看其示例代码,下面就开始进行上传。

在上传前,转到EME的输出文件夹,找到我们刚才制作的内容所在的子文件夹,在其中新建一个名称为Manifest.xml的文件,将以下的内容放在这个XML文件中,

<SilverlightApp>
 <version>1.0</version>
 <loadFunction>StartWithParent</loadFunction>
 <jsOrder>
   <js>MicrosoftAjax.js</js>
   <js>BasePlayer.js</js>
   <js>PlayerStrings.js</js>
   <js>player.js</js>
   <js>StartPlayer.js</js>
 </jsOrder>
</SilverlightApp>

 保存完毕后,选择此文件夹中所有的”.xml”,”.js”,”.wmv”,”.jpg”,”xaml”文件,以标准ZIP方式将这些文件(不含文件夹)压缩到一个包中。请注意,不要选择压缩比,否则不保证在服务器端一定可以解压。

然后到Streaming Live网站中,登录后在右侧主菜单中选择“Manage Your Application”,然后您可以看到一个“Upload Your Application”的链接,点击它后,再出现的文本框中为您的应用程序起一个名字,然后在下面的文件选择框中选择我们刚压好的ZIP包,就可以进行上传了.image

4. 将Streaming Live上的内容显示在您的博客边栏上

最后一步就比较简单了,在上传完毕后,会显示一个详细指示,告知您如何在现有网站中添加上传的内容,另外,还有一个预览链接,您可以先预览一下,以确认上传的内容正确,如左图所示。

这里面提供的第三步其实有些画蛇添足,因为它是特意再生成另外一个JS文件,把一些代码放在哪里面,其实你完全可以把这里面的代码提取出来,直接放在第二步里面,然后再与第一步的内容合成一个代码段,然后插入到你的博客侧边条当中。

由于默认的大小是500*400的,你可以修改这个DIV的大小,即可以改变您的Silverlight显示内容的大小,我就已经修改了200*150。就是您在我的博客右侧所看到的。

 

在您上传完毕后,可以把您的邮件地址,以及您的博客地址放在留言中,我会选择前四位将Silverlight内容显示在其博客侧边栏的朋友赠送Popfly邀请权,让您可以体验Popfly制作Mash Up的能力。

打赏作者

“为你的博客边栏增加Silverlight内容”的10个回复

  1. 洪超老师我整了一晚啊~可是我的EME里面没有silverlight模板,不知道为什么?我反复安了好几遍,也没搞明白,于是没选择模板直接Encode了~然后上传,但是貌似不行,没有任何反应,于是把你的那段视频加载到了我的页面~看在辛苦上给我发个Popfly邀请吧~对于silverlight一直很感兴趣!希望可以好好研究一下
    演示地址:http://www.miaozhuangcast.cn/
    邮箱 : mz121star#Gmail.com
    如果有时间可不可以帮我解答一下,为什么我的没有模板?

  2. 我在网页上使用微软的Media Player的时候, 有这样一种所谓SAMI的技术, 不知道在Silverlight里面是否也可以实现, 还有WMV文件有可能有两个视频流, 例如一个视频流显示摄像头, 一个视频流用于桌面, 在Silverlight里面可以同时播放这两个流吗? 该如何实现呢?Silverlight里面可以显示HTML吗? 是否可以使用GDI之类作简单的作图操作, 例如线, 椭圆之类的. 希望能得到帮助, [email protected]

发表评论