JS调用Silverlight方法拾遗

在最近做的物联网项目中，需要利用封装过的Silverlight刻度控件显示温度，湿度，二氧化碳浓度等值。由于最新的数据是通过js ajax获取的，所以需要把这些数据传递给silverlight显示，这就涉及到js和silverlgiht交互的问题。由于这里我们需要通过js来调用silverlight方法，这里我就做一下调用说明。

首先，在Silverlight项目中，我们把需要被JS调用的方法置为public类型，以便于公布方法。

然后，在被调用方法上加上[ScriptableMember]属性说明，以便于让此方法支持外部调用。

?

[ScriptableMember]

public void InitTemperature(string airte="0",string airhi="0",string earthte="0",string earthhi="0",string ph="0")

{

    var data = new DataNotify();

    data.MaxData = 30;

    data.MinData = -15;

    data.MinRange = -15;

    data.MaxRange = 75;

    data.CurrentData = double.Parse(airte);

    data.Title = "空气温度";

    data.Unit = "℃";

    data.ThemeSet = Theme.Red;

 

    var uc = new TemperatureControl(data);

    uc.Margin = new Thickness(-980, 0, 10, 10);

    Test.Children.Add(uc);

 

    //...........中间省略代码..........

 

    var data4 = new DataNotify();

    data4.MaxData = 10;

    data4.MinData = 0;

    data4.MinRange = 0;

    data4.MaxRange = 10;

    data4.CurrentData = double.Parse(ph);

    data4.Title = "酸碱度";

    data4.Unit = "PH";

    data4.ThemeSet = Theme.Yellow;

 

    var uc4 = new TemperatureControl(data4);

    uc4.Margin = new Thickness(683, 0, 10, 10);

    Test.Children.Add(uc4);

}

之后,在App.xaml中,需要对被调用的方法赋予对外公布的方法调用别名:

?

private void Application_Startup(object sender, StartupEventArgs e)

 {

     var dict = e.InitParams;

     this.RootVisual = new MainPage(dict);

 

     HtmlPage.RegisterScriptableObject("LoadLatest",this.RootVisual);

 }

从这里我们看出,我定义了一个别名为”LoadLastest”的方法名称，JS如果进行调用的时候，就会通过调用LoadLastest来触发InitTemperature方法。

这样，我们的Silverlight端就配置完毕了，下面来看看网页端设置：

首先，定义js方法：

?

var slCtl = null;

function pluginLoaded(sender, args) {

    slCtl = sender.getHost();

}

function CallSilverlight() {

    slCtl.Content.LoadLatest.InitTemperature(lineAirTeGO, lineAirHiGO, lineEarthTeGO, lineEarthHiGO, linePHGO);

}

然后，在需要调用的地方，调用CallSilverlight即可。

======================================

加一点不相干的东西。

如果在页面上使用了easyui的combobox，如果silverlight和其挨得太近，那么当点击下拉列表的时候，列表会被silverlght给遮挡住，解决这个问题的方法就是在网页端加上这么一句:

   <!--解决菜单被silverlight盖住问题-->
   <param name="background" value="transparent" />