在页面上传递参数给Silverlight插件

简介:

最近一直在做Silverlight插件,用来在页面上展示一些动画效果和视频播放,有关如何通过页面传递参数给Silverlight插件已经是一个老生常谈的话题了,不过我还是想在这里重新做下记录,方便新人学习,也方便自己日后查阅。

  大家都知道,我们在页面上使用Silverlight插件一般都采用下面这种标记,当然你也可以在aspx页面中使用silverlight标记,不过这种方式用得很少,而且只限于在aspx页面上使用。

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

   与flash插件类似,在页面上使用的也是一个object标记,我们可以通过已有的param参数来修改silverlight插件的一些属性,例如我们可以使用source来要求silverlight插件使用不同的xap文件,使用onError设置Silverlight加载出错时要执行的脚本,使用background参数设置silverlight插件的背景色,以及使用minRuntimeVersion参数要求客户端运行Silverlight插件的最小版本号,使用autoUpgrade参数要求是否允许客户端的Silverlight浏览器插件自动升级等等。除此之外,你还可以自定义参数,我们可以使用initParams来命名参数,通过该参数我们可以同时传递多个值给Silverlight,如下面的代码:

复制代码
< object  data ="data:application/x-silverlight-2,"  type ="application/x-silverlight-2"  width ="100%"  height ="100%" >
  
< param  name ="source"  value ="ClientBin/SilverlightTest.xap" />
  
< param  name ="onError"  value ="onSilverlightError"   />
  
< param  name ="background"  value ="white"   />
  
< param  name ="minRuntimeVersion"  value ="3.0.40624.0"   />
  
< param  name ="autoUpgrade"  value ="true"   />
  
< param  name ="initParams"  value ="programmer=Jaxu, blog=http://www.cnblogs.com/jaxu, title=silvelight"   />
  
< href ="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0"  style ="text-decoration:none" >
      
< img  src ="http://go.microsoft.com/fwlink/?LinkId=108181"  alt ="Get Microsoft Silverlight"  style ="border-style:none" />
  
</ a >
</ object >
复制代码

   我们通过name/value对来设定initParams参数的值,如上例中就传递了三个不同的参数programmer、blog和title。在服务器端如何接收这些值呢?看下面的示例,首先我们需要在App.xaml.cs文件的Application_Startup事件中加载这些参数的值。

复制代码
private   void  Application_Startup( object  sender, StartupEventArgs e)
{
  
if  ( e.InitParams  !=   null  )
  {
    
foreach  ( var item  in  e.InitParams )
    {
      
this .Resources.Add( item.Key, item.Value );
    }
  }
      
  
this .RootVisual  =   new  Page();
}
复制代码

   通过遍历InitParams,我们将参数以键-值对的形式加载到Silverlight全局资源集合中,最后一行代码是Silverlight默认的代码。使用的时候我们可以通过参数名从Silverlight全局资源集合中取出相应的值,可以写成一个函数方便调用。

复制代码
private   string  GetParam( string  p)
{
  
if  ( App.Current.Resources[p]  !=   null  )
  {
    
return  App.Current.Resources[p].ToString();
  }
  
else
  {
    
return   string .Empty;
  }
}
复制代码

   这样我们就可以轻松地获取到页面上传递过来的参数了。如果需要传递的参数过多,除了采用name/value对的形式外,我们还可以将参数写到xml里,如大家比较熟悉的playList,将视频播放要使用的参数写到playList xml里,然后在Application_Startup事件中解析xml并加载参数的值,使用xml的形式便于组合和管理参数。

  另外,有时候我们也需要在Silverlight中实现与页面DOM之间的交互。在Silverlight中,我们可以通过HtmlPage.Plugin来获取页面上用来呈现Silverlight插件的object标签,通过HtmlPage.Plugin.Parent.Id就可以得到父容器的id,如div或者td。除此之外,还可以通过HtmlPage.Document.GetElementById("elementID")来得到一个页面上的控件,该方法返回HtmlElement对象,通过该对象的SetProperty("PropertyName")方法可以修改控件的属性值,通过GetProperty("PropertyName")方法可以得到控件的属性值。这样,我们就可以实现Silverlight插件和页面元素之间的交互了。

  有时候我们会碰到一些小问题,例如我们想让页面上的元素(如div)浮动到Silverlight元素之上,默认情况下Silverlight总会呈现在所有页面元素之上,这时你可以给页面上的object对象传递一个参数Windowless,将值设为true,让Silverlight插件以“无窗体”的形式呈现就可以了。

  还有一种情况,就是当Silverlight插件在执行一个动画时,动画所控制的元素会超出Silverlight插件本身的范围,这时如果Silverlight插件周围存在页面上的其它容器控件(如div),而Windowsless的值又为true,此时超出去的部分就会被旁边的容器挡住。这时我们就需要通过程序来动态控制Silverlight父容器控件的大小和ZIndex值,同时还需要将Silverlight插件的背景色设置为透明。下面的代码展示了这一点技巧。

复制代码
public   partial   class  MainPage : UserControl
{
    
private   string  divID  =   string .Empty;
    
private  HtmlElement element;
    
private   double  originalWidth  =   0 ;
    
private   double  originalHeight  =   0 ;
    
private   double  naturalWidth  =   865 ;
    
private   double  naturalHeight  =   410 ;
    
private   int  state  =   0 ;

    
public  MainPage()
    {
        
//  Required to initialize variables
        InitializeComponent();

        divID 
=  HtmlPage.Plugin.Parent.Id;
        element 
=  HtmlPage.Document.GetElementById(divID);
        originalWidth 
=  Convert.ToDouble(element.GetProperty( " offsetWidth " ));
        originalHeight 
=  Convert.ToDouble(element.GetProperty( " offsetHeight " ));
    }

    
//  Zoom in.
     private   void  videoToggleButton_Checked( object  sender, RoutedEventArgs e)
    {
        SetPropertiesBeforeZoomedIn();
        videoZoomInStoryboard.Begin();
    }

    
//  Zoom out.
     private   void  videoToggleButton_Unchecked( object  sender, RoutedEventArgs e)
    {
        videoZoomOutStoryboard.Begin();
    }

    
private   void  ZoomOutStoryboard_Completed( object  sender, EventArgs e)
    {
        
if  (state.Equals( 0 ))
        {
            SetProperitesAfterZoomedOut();
        }
    }

    
private   void  SetPropertiesBeforeZoomedIn()
    {
        element.SetStyleAttribute(
" width " , naturalWidth.ToString()  +   " px " );
        element.SetStyleAttribute(
" height " , naturalHeight.ToString()  +   " px " );
        element.SetStyleAttribute(
" zIndex " " 100 " );
    }

    
private   void  SetProperitesAfterZoomedOut()
    {
        element.SetStyleAttribute(
" width " , originalWidth.ToString()  +   " px " );
        element.SetStyleAttribute(
" height " , originalHeight.ToString()  +   " px " );
        element.SetStyleAttribute(
" zIndex " " 0 " );
    }
}
复制代码

  一开始程序会把Silverlight父容器的高和宽记录下来,事件videoToggleButton_Checked和事件videoToggleButton_Unchecked会分别执行一个放大和缩小的动画过程,在放大过程执行前程序会将容器的高和宽设定为预期的值并同时修改ZIndex,这时Silverlight插件就会显示在所有页面容器的最上面并且不会被周边的容器挡住;在缩小过程执行完后程序再将容器的高和宽设定为最初的值并同时修改回ZIndex,此时Silverlight插件就会恢复到最初的状态。你可能会问为什么我们不能只设定容器的ZIndex值而还要同时修改它的大小呢?这是因为当Silverlight插件被放大或缩小时它的父容器的大小并不会随之一起改变,这时即使你将父容器的ZIndex值改成最大Silverlight插件还是会被父容器本身挡住。

  在进行Silverlight插件和页面元素之间交互时还会有许多的技巧,其实只要认真研究下,应该不会有什么问题不能解决!


本文转自Jaxu博客园博客,原文链接:http://www.cnblogs.com/jaxu/archive/2010/01/22/1654052.html,如需转载请自行联系原作者

相关文章
|
前端开发 .NET 开发框架
Silverlight页面在兼容/高速模式下出现滚动条的解决办法
在asp.net web项目中承载Silverlight项目的页面,在搜狗高速模式下正常,在兼容模式下出现竖直滚动条,如何去除? 将承载Silverlight的测试页中的以下标识进行修改。
711 0
|
.NET 索引 开发框架
asp.net 图片批量上传预览,在Silverlight页面中读取并滚动显示
Silverlight动态读取图片并滚动显示 asp.net页面中图片上传并预览   ...
654 0
|
JavaScript 前端开发 .NET
aspx页面中点击按钮传递给Silverlight,并且页面不刷新
function onSilverlightError(sender, args) { var ap...
657 0
|
JavaScript 前端开发
框架页中Silverlight和Web页面之间跳转和返回
      在用Silverlight框架结构中,Silverlight的页面中的一个按钮将当前页面跳转到一个Web页面,这个web页面还是在这个框架也之中,也就是说跳转的时候的Target是为_self。
730 0
|
JavaScript 前端开发 Java
在Silverlight中嵌入HTML或aspx页面
有好几次遇到有的同志们问,怎么在Silverlight中嵌入其他页面如:html,aspx或jsp页面,这里写一个简单的使用方法,供大家参考: 下载第三方控件的dll,这里提供一个下载地址: http://download.csdn.net/source/3231944 下面是这个工具的的介绍:Silverlight 下面是配置步骤: 1):将下载资源中的dll(Divelements.SilverlightTools.dll ),添加到Silverlight项目的引用中去。
840 0
|
前端开发 JavaScript C#
aspx页面上传递参数给Silverlight插件的方法
在做Silverlight和asp.net web应用程序中,常常会遇到将用户登录的相关信息从aspx页面传递到Silverlight应用程序中,如何才能实现呢?   一是总结一下,便于备忘,另一方面是给后来学Silverlight的同志们,一个可供查询的方法。
890 0
|
数据库 .NET 开发框架
Silverlight调用自定义的Web Service从数据库获取数据进行页面绑定
    Silverlight调用WebService只能使用异步方式调用。所谓异步方式调用就是让调用方法的主线程不必同步等待在这个函数调用上,从而允许主线程继续执行它下面的代码。
611 0
|
.NET 开发框架
asp.net页面调用silverlight
在Asp.net 调用 silverlight并不是很难,只是在aspx中添加script调用xap即可.例如:(1)、SL3中已经找不到System.Web.Silverlight.dll文件了,到这里下载,然后将其添加到项目引用中去.   (2)、需要首先注册,在asp.net页面的aspx页面的头部加上如下语句:    (3)、然后进行调用        (4)、你自己按照上面测试下就OK了。
667 0