zoukankan      html  css  js  c++  java
  • 2.0Tip/Trick之Silverlight.js, Silverlight.supportedUserAgent.js, 自定义启动界面, 响应鼠标滚轮事件

    介绍
    Silverlight 2.0 提示和技巧系列
    • Silverlight.js - 一些 js 帮助函数,用于嵌为入 Silverlight 插件以及自定义安装体验等提供帮助
    • Silverlight.supportedUserAgent.js - 就一个函数,用于判断 Silverlight 是否支持用户的浏览器
    • 自定义启动界面 - 三个参数的综合应用:splashScreenSource, onSourceDownloadProgressChanged, onSourceDownloadComplete 
    • 响应鼠标滚轮事件 - 响应并处理鼠标的滚轮事件


    在线DEMO
    http://www.cnblogs.com/webabcd/archive/2008/10/09/1307486.html


    示例
    1、Silverlight.js 和 Silverlight.supportedUserAgent.js 的常用函数的演示和说明
    SilverlightDotJsDemo.html
    <!--
    详解 Silverlight.js 

    Silverlight.js - 一些 js 帮助函数,用于嵌为入 Silverlight 插件以及自定义安装体验等提供帮助,其最新版本在如下地址下载
    http://code.msdn.microsoft.com/silverlightjs

    Silverlight.supportedUserAgent.js - 就一个函数,用于判断 Silverlight 是否支持用户的浏览器,其最新版本在如下地址下载
    http://code.msdn.microsoft.com/SLsupportedUA
    -->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        
    <title>Silverlight.js</title>

        
    <script type="text/javascript" src="../Silverlight.js"></script>

        
    <script src="../Silverlight.supportedUserAgent.js" type="text/javascript"></script>

    </head>
    <body>
        
    <div id="container">
            
    <href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
                
    <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"
                    style
    ="border-style: none" />
            
    </a>
        
    </div>

        
    <script type="text/javascript">

            
    // Silverlight.createObject() - 生成一个嵌入了 Silverlight 插件的 object 元素
            Silverlight.createObject(
                
    "../ClientBin/Silverlight20.xap"// .xap 的地址
                document.getElementById('container'), // 包含此 object 元素的父元素
                "slPlugin"// object 元素的 id
                {
                     
    "100%",
                    height: 
    "100%",
                    minRuntimeVersion: 
    "2.0.31005.0"
                }
    // Silverlight 插件的属性数组
                {
                    onLoad: onSLLoad,
                    onError: onSLError,
                    onSourceDownloadComplete: onSourceDownloadComplete
                }
    // Silverlight 插件的事件处理程序数组
                "key1=value1,key2=value2"// 为 Silverlight 程序传递初始化参数(key=value的形式)。用“,”分隔
                "myContext" // 上下文信息,可以在插件的 onLoad 事件中获取
            );

            
    function onSLLoad(plugin, userContext, sender) {
                alert(plugin.id 
    + " - " + userContext + " - " + sender.toString());
            }


            
    function onSLError(sender, args) {
                
    // args - Sys.UI.Silverlight.ErrorEventArgs 类型
                // ErrorEventArgs.errorType - 错误类型
                // ErrorEventArgs.errorMessage - 错误信息
                // ErrorEventArgs.errorCode - 错误代码

                
    // 程序 throw 出的异常可以在此处捕获到
                alert(args.errorType + "\n" + args.errorMessage + "\n" + args.errorCode);
            }


            
    function onSourceDownloadComplete(sender, args) {
                alert(
    "SourceDownloadComplete");
            }



            
    // Silverlight.createObjectEx(params) - 将所有参数放入一个数组中传入,其内部会解析这个数组中的参数,然后调用 Silverlight.createObject()

            
    // Silverlight.default_error_handler = function (sender, args){} - onError 事件的默认处理程序,不需要的话可以将其置为 null
                
        
    </script>

        
    <script type="text/javascript">

            window.onload 
    = function() {

                
    // getSilverlight() - 尝试下载指定的版本,如果指定空字符串 "" 则为尝试下载最新版本
                // Silverlight.getSilverlight("2.0.31005.0");

                
    // isInstalled() - 判断是否安装了指定的 Silverlight 版本
                alert(Silverlight.isInstalled("2.0.31005.0"));

                
    // Silverlight.onSilverlightInstalled - 使用 Silverlight.js 时,如果客户端没有安装 Silverlight 插件,则会自动安装,然后调用此方法以刷新浏览器,可以重写此方法以自定义行为(比如在此通过 createObject() 来使新安装的插件生效,而无需刷新)。注意:如果是 Silverlight 升级,则不会调用此方法,必须重启浏览器(只刷新是不行的)

                
    // supportedUserAgent(version, userAgent) - 判断 Silverlight 是否支持用户的浏览器,省略 userAgent 则为当前浏览器
                alert(Silverlight.supportedUserAgent("2.0"));
            }

        
        
    </script>

    </body>
    </html>


    2、自定义 Silverlight 程序的启动界面,并显示加载进度
    启动界面的 xaml 文件
    SplashScreen.xaml
    <Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
          xmlns:x
    ="http://schemas.microsoft.com/winfx/2006/xaml"
          Background
    ="Bisque"
    >
        
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
            
    <TextBlock Text="Loading" Margin="3" />
            
    <TextBlock x:Name="percent" Text="0%" Margin="3" />
        
    </StackPanel>
    </Grid>

    Silverlight 程序全部加载完成前,显示启动界面并显示加载进度
    SplashScreen.html
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        
    <title>SplashScreen</title>
        
    <style type="text/css">
            html, body
            
    {
                height
    : 100%;
                overflow
    : auto;
            
    }

            body
            
    {
                padding
    : 0;
                margin
    : 0;
            
    }

            #silverlightControlHost
            
    {
                height
    : 100%;
            
    }

        
    </style>
    </head>
    <body>
        
    <div id="silverlightControlHost">
            
    <object id="xaml1" data="data:application/x-silverlight-2," type="application/x-silverlight-2"
                width
    ="100%" height="100%">
                
    <param name="source" value="../ClientBin/Silverlight20.xap" />
                
                
    <!--下载 source 指定的 xap 的过程中所显示的 xaml 的地址-->
                
    <param name="splashScreenSource" value="SplashScreen.xaml" />
                
                
    <!--下载 source 指定的 xap 的过程中所持续调用的事件-->
                
    <param name="onSourceDownloadProgressChanged" value="onSourceDownloadProgressChanged" />
                
                
    <!--souce 指定的 xap 被完全下载后所触发的事件-->
                
    <param name="onSourceDownloadComplete" value="onSourceDownloadComplete" />
            
    </object>
            
    <iframe style='visibility: hidden; height: 0;  0; border: 0px'></iframe>
        
    </div>

        
    <script type="text/javascript">
        
            
    function onSourceDownloadProgressChanged(sender, args) {
                
    // progress 属性 - 下载进度(0 - 1 之间)
                sender.findName("percent").Text = Math.round(args.progress * 10000/ 100 + "%";            
            }


            
    function onSourceDownloadComplete(sender, args) {
                sender.findName(
    "percent").Text = "100%";
            }


        
    </script>

    </body>
    </html>


    3、响应并处理鼠标的滚轮事件
    Wheel.xaml
    <UserControl x:Class="Silverlight20.Tip.Wheel"
        xmlns
    ="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x
    ="http://schemas.microsoft.com/winfx/2006/xaml">
        
    <StackPanel>
            
    <TextBox x:Name="lblMsg" />
        
    </StackPanel>
    </UserControl>

    Wheel.xaml.cs
    /*
     * 如何响应鼠标滚轮事件,可以参看 Deep Zoom Composer 生成的 MouseWheelHelper.cs
     
    */


    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;

    using System.Windows.Browser;

    namespace Silverlight20.Tip
    {
        
    public partial class Wheel : UserControl
        
    {
            
    public Wheel()
            
    {
                InitializeComponent();

                
    this.Loaded += new RoutedEventHandler(Wheel_Loaded);
            }


            
    void Wheel_Loaded(object sender, RoutedEventArgs e)
            
    {
                HtmlPage.Window.AttachEvent(
    "DOMMouseScroll", OnMouseWheel);
                HtmlPage.Window.AttachEvent(
    "onmousewheel", OnMouseWheel);
                HtmlPage.Document.AttachEvent(
    "onmousewheel", OnMouseWheel);
            }


            
    private void OnMouseWheel(object sender, HtmlEventArgs args)
            
    {
                args.PreventDefault();

                
    double mouseDelta = 0;
                ScriptObject eventObj 
    = args.EventObject;

                
    // Mozilla and Safari  
                if (eventObj.GetProperty("detail"!= null)
                
    {
                    mouseDelta 
    = ((double)eventObj.GetProperty("detail"));
                }


                
    // IE and Opera   
                else if (eventObj.GetProperty("wheelDelta"!= null)
                
    {
                    mouseDelta 
    = ((double)eventObj.GetProperty("wheelDelta"));
                }


                
    // IE浏览器:mouseDelta == 120 向上滚动;mouseDelta == -120 向下滚动
                
    // FF浏览器:mouseDelta == -3 向上滚动;mouseDelta == 3 向下滚动
                lblMsg.Text += mouseDelta.ToString();
            }

        }

    }


  • 相关阅读:
    Java 理论与实践: 正确使用 Volatile 变量
    VS2005 C++,断点无法命中的解决办法
    IndexWriterConfig的各个配置项说明(转)
    LINQ&Entity Framework
    CDN
    德鲁克之沟通的四原则
    项目管理过程之项目团队
    OOAD & OOP
    双线接入(全网路由)简单介绍
    唐僧为什么可以领导孙悟空
  • 原文地址:https://www.cnblogs.com/bingyun84/p/1499187.html
Copyright © 2011-2022 走看看