对于想了解Silverlight中的Silverlight.js的用法学习的读者,本文将提供新的信息,我们将详细介绍silverlight用处大不大,并且为您提供关于MySilverlight系列(1
对于想了解Silverlight中的Silverlight.js的用法学习的读者,本文将提供新的信息,我们将详细介绍silverlight用处大不大,并且为您提供关于My Silverlight系列(10)—— Silverlight中的InkCanvas、Silverlight 2学习教程(二):开发简单的Silverlight 2应用程序、Silverlight 2学习教程(六): Silverlight托管代码调用Javascript中的JSON对象、Silverlight 2学习教程(十):Silverlight 2.0 URL 访问策略的有价值信息。
本文目录一览:- Silverlight中的Silverlight.js的用法学习(silverlight用处大不大)
- My Silverlight系列(10)—— Silverlight中的InkCanvas
- Silverlight 2学习教程(二):开发简单的Silverlight 2应用程序
- Silverlight 2学习教程(六): Silverlight托管代码调用Javascript中的JSON对象
- Silverlight 2学习教程(十):Silverlight 2.0 URL 访问策略
Silverlight中的Silverlight.js的用法学习(silverlight用处大不大)
Silverlight.js: 文件提供一些 JavaScript 帮助器函数,这些函数用于将 Silverlight 插件嵌入某一网页和用于自定义 Silverlight 安装体验。
常用函数:
函数原型:
Silverlight.createObject(source,parentElement,id,properties,events,initParams,userContext);
source:Xap文件的地址
parentElement:要加载到JHTML的节点,若为null则返回创建此对象的HTML字符串,否则无返回值,直接加载到节点上.
id:生成此对象的ID
properties:数组,包括{background:"red",enableHtmlAccess:true,maxFrameRate:30,windowless:false,version:"4.0",alt:"" }等,//至少要在此属性中指定一个版本,否则会报JS错误,但不保证生成正确的SL对象(SL3.0)
events:数组,包括onLoad和onError等
initParams:字符串,如 "arg1=val1,arg2=val2"
userContext:它在事件发生时传递到您的 onLoad 事件处理程序。可以使用些参数确认多个中的那个SL对象加载完成
使用些方法会用SL生成的HTML替换 parentElement.innerHTML
在MSDN上并没有查阅到相关定义数组信息,但是通过调试:
createObjectEx直接调用creatObject方法.
参数为 var obj = new Object();
obj["source"]="ClientBin/MySilverlight.xap"
obj["parentElement"]
obj["id"]
obj["properties"] //至少要在此属性中指定一个版本,但不保证生成正确的SL对象(SL3.0)
obj["events"]
obj["initParams"]
obj["context"]
Silverlight.onGetSilverlight = function()
{
alert("您将马上安装Silverlight插件,请稍候...");
}
指示在加载网页时是否已安装 Silverlight 插件,并且如果升级插件则要求浏览器重新启动。
返回值:如果已安装 Silverlight 插件并且在升级后要求浏览器重新启动,则为 true;否则为 false。
Silverlight.isInstalled ("2.0"),测试是否安装2.0或以上的版本SL
Silverlight.onSilverlightInstalled = function() {
alert("要做什么?");
}
WaitForInstallCompletion 函数在它检测到已安装 Silverlight 时将调用 onSilverlightInstalled 函数。但在用户从以���的版本升级 Silverlight 时,将不会发生上述调用。在这种情况下,用户必须重新启动浏览器。
您通常将使用 isbrowserRestartrequired 函数确定是否需要升级,然后显示相应消息。
默认 onSilverlightInstalled 函数将刷新浏览器窗口。您可以在网页的 onLoad 事件的处理程序中替换此行为。可以通过将该函数设置为 null,禁用自动刷新;或者,可以将其设置为您自己的函数。例如,代替刷新浏览器,您可以使用 createObject 或 createObjectEx 将新的 HTML object 元素直接插入您的网页。这样,无需浏览器刷新便可以嵌入新安装的插件。
新的 Silverlight 安装要求浏览器刷新,以便网页可以加载 Silverlight 插件。但是,Silverlight 升级要求浏览器重新启动,而不仅是刷新。
在您使用 Silverlight.js 时,如果该页面加载并且用户尚未安装 Silverlight,则默认调用 WaitForInstallCompletion 函数。在新的 Silverlight 安装完成后,WaitForInstallCompletion 函数将调用 onSilverlightInstalled 函数来刷新浏览器。您可以使用自己的函数替换 onSilverlightInstalled,以便禁用或自定义此行为。
MSDN:http://msdn.microsoft.com/zh-cn/library/cc838126(VS.95).aspx
My Silverlight系列(10)—— Silverlight中的InkCanvas
有许多人喜欢手写板或者涂鸦板之类的东西,而并不怎么喜欢输入法,因此Microsoft专门有Ink这个东西用于处理鼠标画图。不得不说这个东西功能十分的强大,也让许多用户使用起来非常方便,用微软开发出来的很多Ink与Bitmap结合的API,即使不会用Photoshop的人也能轻松打开一张图片,然后在自己喜欢的地方写上一段话或者签个名什么的。这个功能,Winform上面有,WPF上面也有,当然Silverlight上也有,只不过作为起步不久的Silverlight版Ink,功能尚不够强大,目前能够开放给我们使用的,只有InkPresenter这一个控件。
也许开发WPF的人都没怎么听说过这个控件而只听说过InkCanvas——那是一个在WPF上对Ink功能封装得非常完善的控件,我们可以使用它进行画图和橡皮擦等一系列的事情。当然,如果你去研究过这个控件,你就可以发现其实它其实是通过DataBinding在InkPresenter上进行了进一步的封装。由于WPF与Silverlight不同的继承结构,恐怕在Silverlight上很难照搬WPF上那一套,即我们不能对其进行一对一的Port,所以如果要在Silverlight上实现一个InkCanvas,就要另辟蹊径。
如果你使用过WPF的InkCanvas控件,你将会发现它支持EraseByPoint,EraseBystroke,Ink三种模式,而且支持复制、粘贴,而且可以轻松地扩展出撤销与重做两个功能。但是后面的一系列功能,不是InkCanvas的核心功能,只要前三者得以实现,那么这个InkCanvas就可以正常的运作了。那么,我们首先从这三种模式中用于画图的Ink模式说起。
InkCanvas的核心,其实在于它内部的InkPresenter,在Silverlight中InkPresenter仅仅是Canvas的子类,只不过它多了strokes这么一个属性用于存储和展示画上去的所有stroke。因此,它把如何生成一个stroke的问题完全留给了我们。先来看一下stroke的定义:
其中DrawingAttributes这个属性是用于描述画笔的颜色的,而StylusPoints描述了stroke内点的集合。学过数学的人都知道,线是由点组成的,因此只要我们找到了应该插入到这个stroke中所有的点,那么生成一个新的stroke不在话下。所幸MouseEventArgs中,有一个StylusDevice只读属性,而它的一个公共方法public StylusPointCollection GetStylusPoints(UIElement relativeto)可以在鼠标事件触发的时候,得到这些“点”的集合。我们只需要为InkPresenter加上MouseLeftButtonDown,MouseMove,MouseLeftButtonUp三个handler,那么我们就可以在鼠标进行轨迹上把那些点加到线上,并将这条线加入到InkPresenter这个“面”里。代码比较多,最后我会把工程放在下面,就不一段一段的贴了。
其实这个Ink模式,不算什么难点,而后面这个EraseBystroke也相对简单,最笨的方法就是遍历InkPresenter内所有的stroke,然后一一检验它是否与我们的"Eraser"有交叉,如果有,则将它Remove。但是,最后这个EraseByPoint可没那么容易了,因为当橡皮将一条线拦腰截断的时候,不但要把擦掉的部分去掉,还要把余下的两段保留在strokes这个strokeCollection中,这才能达到一分为二的效果。我最初在实现这个功能的时候,由于设计的算法时间复杂度居高不下,造成如果相交的线过多,或者橡皮拖动太快,就会出现卡死的现象。在与微软silverlight开发小组的stefan swick交流之后,他决定实现这一功能,并且将其做成一个Custom Control。昨天他告诉我他把这个东西做好了,要我去他的Blog上下载。今天我仔细研究了他的算法,发现这个算法与我的算法有一个最大的不同之处就是:我在将一条线一分为二的过程中,完全是按照从前向后的顺序,将每个点一一挎贝并缓存,从前向后判断这个点是否被橡皮擦中,如果被擦中的话,马上生成一个新的stroke,把旧的加入strokes内,并对新的stroke进行上述相同的操作。而stefan的算法则分为了两个部分,首先从前向后把前面没有被擦中的点取出来存到一个新的stroke中,然后停止,再从后往前寻找后面的点,将没有被擦中的点加入到一个新的stroke中,直到遇到被擦中的点停止。这样的话,可以保证一个stroke可以被一分为二。
经过我的测试,执行并没有什么问题。但是由于我们向stroke中插入点,完全依赖于MouseMove事件,如果我们的鼠标移动速度过快,那么被插入的这些本就离散的点,它们之前的间隔会变得更大。这在Ink模式下不会有什么问题,但是在EraseByPoint模式下,就会因被去掉的点附近没有其他的点,而一次性擦掉很大的一段,这是由于我们在插入点和擦除的时候没有做任何的优化造成的,希望这个问题能得到解决。
大家可以到http://blogs.msdn.com/swick/archive/2008/11/30/erasing-ink-in-silverlight-2.aspx去看stefan的原文,那里提供工程原件的下载,我就不再多此一举把它上传到博客园来浪费空间了。至于上面提到的问题,如果大家有什么优化的方式和算法,希望可以告诉我们,谢谢!
Silverlight 2学习教程(二):开发简单的Silverlight 2应用程序
准备工作做好了之后,下面就可以开始进行Silverlight 2的应用程序的开发了。
启动VS2008,“新建项目”,可以看到“项目类型”下面有“Silverlight”,选择“Silverlight”,在右边的模板里面可以看到“已安装的模板”列出了“Silverlight Application”和“Silverlight Class Library”两种类型的模板。
选择“Silverlight Application”模板,出现下面的对话框:
由于Silverlight应用程序目前还无法单独运行,它必须嵌入页面里面,通过object标签元素来启动它,所以,在创建“Silverlight Application”的时候,VS会提示你选择一种运行Sliverlight程序的方法。如果选择“Add a new Web to the solution for hosting the control”,此时需要创建一个Web站点:既可以创建Web网站,也可以创建Web Application类型的项目。
如果选择“Generate an HTML test page to host Silverlight within this project”的方法,则会在项目文件夹的ClientBin下创建一个TestPage.html文件,以用来运行Silverlight程序。
下面,我们选择“Web Application Project”的方法来做一个简单的例子。
可以通过上下箭头切换设计区和代码区的位置,也可以通过右边蓝色框里面的按钮隐藏区域和横向、纵向切分窗口。
在XAML代码区的<Grid></Grid>标记之间,输入下面的代码:
在XAML代码区,单击鼠标右键,可以从右键菜单上选择“查看代码”,切换到代码区域,以处理用户单击按钮执行的任务。也可以在事件名称上选择“导航到事件处理程序”来进入代码输入界面。
当前XAML的所有成员都可以从右边的下拉列表中进行查找到。
在Button_Click的事件处理函数内,输入以下的内容:
{
}
{
}
整个Hello World的开发过程到现在就完成了。单击F5健,在文本输入框里面输入你的名字。
几点说明:
1,工具箱中的控件只能拖放到XAML代码区域,不能拖放到设计区域,该界面布局带来很多的不方便【WPF应用程序里面有效】;
2,文档大纲的预览和属性框都不可用,估计是Beta版还没有完成吧。
3,元素定位需要放在Canvas里面,具体介绍参见:
http://dotnet.aspx.cc/SilverlightSDK/Silverlight/conceptual/c_Silverlight_positioning.htm
Silverlight 2学习教程(六): Silverlight托管代码调用Javascript中的JSON对象
xmlns
xmlns:x
Width
{
{
{
InitializeComponent();
}
{
{
UserInputContent = "Hello Silverlight World!";
}
{
UserInputContent = "你好,
}
HtmlWindow win = HtmlPage.Window;
win.Alert("Silverlight 里面弹出的对话框。
Object[] args = { "将此参数传递给
win.Invoke("getArrayTest", args);