|
概述
Silverlight 2 Beta 1版本發布了,無論從Runtime還是Tools都給我們帶來了很多的驚喜,如支持框架語言Visual Basic, Visual C#, IronRuby, IronPython,對JSON、Web Service、WCF以及Sockets的支持等一系列新的特性。《一步一步學Silverlight 2系列》文章將從Silverlight 2基礎知識、數據與通信、自定義控件、動畫、圖形圖像等幾個方面帶您快速進入Silverlight 2開發。
Silverlight中內置了對于HTML、客戶端腳本等的支持。上一篇介紹在Silverlight中調用JavaScript,本文我將介紹在Silverlight中如何用JavaScript調用.NET代碼。
使用RegisterScriptableObject
在Silverlight 2中提供了如下兩個類型:
ScriptableMemberAttribute:允許我們在Silverlight把成員暴露給Script。
ScriptableTypeAttribute:允許我們在Silverlight把類型暴露給Script。
同時HtmlPage提供了RegisterCreateableType和RegisterScriptableObject方法,用來注冊可被腳本使用的類型或者對象實例。有了上面這些,就可以做到在JavaScript中調用Silverlight。
看一個簡單的示例,在這個示例中,我們期望通過JavaScript傳遞兩個參數給Silverlight中的方法,由該方法計算出結果后顯示在Silverlight中,如圖所示:
首先我們編寫在Silverlight中的界面布局:
<StackPanel Background="#CDFCAE" Orientation="Horizontal"> <Border CornerRadius="10" Width="100" Height="40" Margin="50 10 0 0"> <TextBlock Text="結果顯示:" FontSize="20" Foreground="Red"></TextBlock> </Border> <Border CornerRadius="10" Background="Green" Width="300" Height="40"> <TextBlock x:Name="result" FontSize="20" Foreground="White" Margin="20 5 0 0"></TextBlock> </Border></StackPanel>
private void UserControl_Loaded(object sender, RoutedEventArgs e){ HtmlPage.RegisterScriptableObject("Calculator", this);}
編寫一個Add方法,該方法將在JavaScript中被調用,必須為public,用ScriptableMember特性暴露給腳本。
[ScriptableMember]public void Add(int x, int y){ int z = x + y; this.result.Text = String.Format("{0} + {1} = {2}", x, y, z);}
現在編寫測試頁中的內容,提供輸入的input控件:
<div class="main"> <input id="txt1" type="text" /> <input id="txt2" type="text" /> <input id="Button1" type="button" value="確 定"/></div>
編寫JavaScript調用Silverlight中的方法,獲取Silverlight插件,Calculator就是我們剛才所注冊的實例:
<script type="text/Javascript"> function callSilverlight() { var slPlugin = $get('Xaml1'); slPlugin.content.Calculator.Add($get('txt1').value,$get('txt2').value); }</script>
在按鈕單擊事件中調用該方法
<input id="Button1" type="button" value="確 定" onclick="callSilverlight()" />
運行后結果:
輸入兩個數后顯示出結果:
使用RegisterCreateableType
現在我們再看一下如何使用RegisterCreateableType。對上面的示例做一些簡單的改動,在Silverlight項目中添加一個Calculator類,需要給它加上ScriptableType特性:
[ScriptableType]public class Calculator{ [ScriptableMember] public int Add(int x, int y) { return x + y; }}
在頁面加載時修改為如下代碼,指定一個別名和要注冊的類型:
HtmlPage.RegisterCreateableType("calculator", typeof(Calculator));
這樣在JavaScript中就可以這樣進行調用了,先創建一個之前注冊為ScriptableType的實例,再調用它的相關方法:
<script type="text/Javascript"> function callSilverlight() { var slPlugin = $get('Xaml1'); var cal = slPlugin.content.services.createObject("calculator"); alert(cal.Add($get('txt1').value,$get('txt2').value)); }</script>
運行結果如下,沒有問題:
結束語
本文介紹了如何在JavaScript中調用Silverlight,通過前面幾篇文章的介紹,如對DOM的操作、在Silverlight中調用JavaScript、在JavaScript中調用Silverlight等,可以看到,Silverlight與瀏覽器之間交互有著很好的支持,后面將繼續介紹其它內容。
NET技術:一步一步學Silverlight :在Silverlight中如何用JavaScript調用.NET代碼,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。