您的位置:知识库 » .NET技术

Silverlight与HTML双向交互

作者: Leon Weng  来源: 博客园  发布时间: 2010-12-21 16:18  阅读: 1778 次  推荐: 2   原文链接   [收藏]  
摘要:HTML和Silverlight之间的双向交互可以更灵活的使用Silverlight进行开发,上午摸索了一下,记录在此。

  Silverlight具备很好的用户体验,但有时需要在页面的布局上进行特殊处理,比如作为webpart集成到Sharepoint中等等。

  HTML和Silverlight之间的双向交互可以更灵活的使用Silverlight进行开发,上午摸索了一下,记录在此。

  一,向Silverlight传递数据,实现个性化加载

  Silverlight在HTML中的引用是:

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
          
<param name="source" value="ClientBin/VideoCenter.xap"/>
          
<param name="onError" value="onSilverlightError" />
          
<param name="background" value="white" />
          
<param name="minRuntimeVersion" value="4.0.50401.0" />
          
<param name="autoUpgrade" value="true" />
                    
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0" style="text-decoration:none">
              
<img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
          
</a>
</object>

  这种引用插件的方式提供了一系列的参数来实现个性加载,上面的代码中我们加了一行参数

<param name="initParams" value="CategoryId=1" />

  我们可以在Silverlight中处理这些参数,打开Silverlight应用程序的App代码文件,加上接收参数的代码

private void Application_Startup(object sender, StartupEventArgs e)
        {
            
if (e.InitParams.Count != 0)
            {
                foreach(var item in e.InitParams)
                {
                    this.Resources.Add(item.Key, item.Value);
                }
            }
            this.RootVisual
= new MainPage();
        }

  我们看到对e.InitParams的处理,即可得到了HTML中传进来的参数,实现个性化加载:

if(App.Current.Resources["CategoryId"]!=null)
            {
                
int cateId = int.Parse(App.Current.Resources["CategoryId"].ToString());
                CategoryItem c
= new CategoryItem();
                c.CategoryID
= cateId;
                this.gridOfList.Children.Add(c);
            }

  二,Silverlight调用HTML中的脚本资源,实现自身的样式等修改

        首先我们可以在加载Silverlight组件的页面上编写一段Javascript脚本

function InvokePlayer(videoId) {
            document.getElementById(
"divCategory").style.display = "none";
            var player
= document.getElementById("divPlayer");
            player.style.width
= "100%";
            player.style.height
= "600px";
}

  怎么在Silverlight中调用这个脚本呢?我们可以在某个事件中调用Silverlight提供的类方法

System.Windows.Browser.HtmlPage.Window.Invoke("InvokePlayer", videoId);

  当然类似的方法还有几个:

(HtmlPage.Window.GetProperty("InvokePlayer") as ScriptObject)InvokeSelf("Good Function!");HtmlPage.Window.Eval("document.getElementById('result')") as HtmlElement…

  即可实现调用脚本。经过以上的两个方法即可实现HTML和Silverlight之间双向传递数据的功能。

2
0

.NET技术热门文章

    .NET技术最新文章

      最新新闻

        热门新闻