WPF/E是微软2007年推出的新技术 事先已经有不少评论了 (什么flash终结者之类的)
这几天看到它有了正式的新名字Silverlight
不管它是新时代的开始 还是只是昙花一现的过渡技术 让我们一起对它say hello~!
1.准备工作
下载浏览器插件 去微软的网站下一个WPF/E的插件
http://www.microsoft.com/downloa ... f3270%2finstall.msi
下载WPF/E实例包
http://download.microsoft.com/do ... 7/FebCTPSamples.zip
安装好了插件 打开看看吧 效果的确是不错的
2.开始Silverlight之旅
本来vs2005里有用于WPF/E web开发的插件的 8过我还是比较喜欢自己动手 工具只有记事本和浏览器
a.首先建立一个文件夹 一会把我们写的文件全放进去
b.之后 在里面建立一个空的html文件 起名为helloworld.html 当然 应该写好基本元素
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
>
<
html
>
<
head
>
<
title
></
title
>
</
head
>
<
body
>
</
body
>
</
html
>
c.好了 现在该考虑如何把Silverlight控件加入到我们的页面中了
Silverlight兼容ie ff opera(不兼容ns 试过了) 在ie中 它作为ActiveX控件 在ff op中是嵌入式对象
听起来似乎有点困难 但是好在这些东西不用我们操心了 微软已经把他封装好了
接下来就让我们偷点懒 从任何一个演示包中的例子里把 js文件aghost.js考出来 放到我们的目录里
最好新建一个文件夹js 然后把aghost.js复制进去
之后编辑前面创建的html文件 把aghost.js加进去 因为aghost.js是用来被调用的 所以放到head里
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
>
<
html
>
<
head
>
<
title
></
title
>
<
SCRIPT
src
="js/aghost.js"
type
="text/javascript"
></
SCRIPT
>
</
head
>
<
body
>
</
body
>
</
html
>
c.把aghost.js添加进来后 可以开始建立对象了
首先创建一个div作为对象的容器 随便起个名字
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
>
<
html
>
<
head
>
<
title
></
title
>
<
SCRIPT
src
="js/aghost.js"
type
="text/javascript"
></
SCRIPT
>
</
head
>
<
body
>
<
div
id
="silverlight"
></
div
>
</
body
>
</
html
>
然后创建一个agHost对象 参考实例包里的使用和注释 加入代码
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
>
<
html
>
<
head
>
<
title
></
title
>
<
SCRIPT
src
="js/aghost.js"
type
="text/javascript"
></
SCRIPT
>
</
head
>
<
body
>
<
div
id
="silverlight"
></
div
>
![](https://i-blog.csdnimg.cn/blog_migrate/a41954a27d6ad96fa2c2cf816e677448.gif)
<
script
type
='text/javascript'
>
...
new agHost("silverlight", // hostElementID (HTML element to put WPF/E
// ActiveX control inside of -- usually a <div>)
"wpfeobj", // ID of the WPF/E ActiveX control we create
"100%", // Width
"100%", // Height
"#FF999999", // Background color
null, // SourceElement (name of script tag containing xaml)
"xaml/Hello world.xaml", // Source file
"false", // IsWindowless,
"24", // MaxFrameRate
null, // OnError handler (method name -- no quotes)
0, // Minimum major version required
8, // Minimum minor version required
5); // Minimum build required
</
script
>
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
</
body
>
</
html
>
d.现在html里的工作完成了
我的代码里Source file随便写了个xaml/Hello world.xaml 你也可以使用别的名字
但是我们还没有建立这个文件
建立文件夹xaml 再建立文件Hello world.xaml
用记事本编辑
<
Canvas
xmlns
="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
Loaded
="javascript:downloadAssets"
x:Name
="root"
>
<
TextBlock
TextWrapping
="NoWrap"
>
Hello world!Hello Silverlight!
</
TextBlock
>
</
Canvas
>
保存之后 再打开网页看看 出现Hello world!Hello Silverlight!字样了吧^^
从hello world 你可以开始探索了 试着加一些图片 修改一下文字的定位之类的
这几天看到它有了正式的新名字Silverlight
不管它是新时代的开始 还是只是昙花一现的过渡技术 让我们一起对它say hello~!
1.准备工作
下载浏览器插件 去微软的网站下一个WPF/E的插件
http://www.microsoft.com/downloa ... f3270%2finstall.msi
下载WPF/E实例包
http://download.microsoft.com/do ... 7/FebCTPSamples.zip
安装好了插件 打开看看吧 效果的确是不错的
2.开始Silverlight之旅
本来vs2005里有用于WPF/E web开发的插件的 8过我还是比较喜欢自己动手 工具只有记事本和浏览器
a.首先建立一个文件夹 一会把我们写的文件全放进去
b.之后 在里面建立一个空的html文件 起名为helloworld.html 当然 应该写好基本元素
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
c.好了 现在该考虑如何把Silverlight控件加入到我们的页面中了
Silverlight兼容ie ff opera(不兼容ns 试过了) 在ie中 它作为ActiveX控件 在ff op中是嵌入式对象
听起来似乎有点困难 但是好在这些东西不用我们操心了 微软已经把他封装好了
接下来就让我们偷点懒 从任何一个演示包中的例子里把 js文件aghost.js考出来 放到我们的目录里
最好新建一个文件夹js 然后把aghost.js复制进去
之后编辑前面创建的html文件 把aghost.js加进去 因为aghost.js是用来被调用的 所以放到head里
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
c.把aghost.js添加进来后 可以开始建立对象了
首先创建一个div作为对象的容器 随便起个名字
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
然后创建一个agHost对象 参考实例包里的使用和注释 加入代码
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/1327ab569c1ae82736693a50b8e33378.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0196c3df5ea9e936f21e9932cca91014.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
d.现在html里的工作完成了
我的代码里Source file随便写了个xaml/Hello world.xaml 你也可以使用别的名字
但是我们还没有建立这个文件
建立文件夹xaml 再建立文件Hello world.xaml
用记事本编辑
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
保存之后 再打开网页看看 出现Hello world!Hello Silverlight!字样了吧^^
从hello world 你可以开始探索了 试着加一些图片 修改一下文字的定位之类的