Silverlight(Code name WPF/E)体验

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 >
< 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 >
</ 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 你可以开始探索了 试着加一些图片 修改一下文字的定位之类的
 
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值