Silverlight 中一些必须知道的技巧(zhuan tie)

1,在Silverlight获取初始化参数
页面上XAML代码如下:

  
  
< Grid x:Name ="LayoutRoot" Background ="White" >
< ListBox Margin ="76,68,0,197" x:Name ="listBox" HorizontalAlignment ="Left" Width ="226" />
</ Grid >

 用了listBox控件,为了显示多个参数值
前台HTML代码如下:

 

  
  
< object data ="data:application/x-silverlight," id ="XamlObject" type ="application/x-silverlight-2"
width
="100%" height ="100%" >
< param name ="source" value ="ClientBin/SilverlightTest11.0.xap" />
< param name ="onerror" value ="onSilverlightError" />
< param name ="background" value ="white" />
< param name ="minRuntimeVersion" value ="3.0.40818.0" />
< param name ="autoUpgrade" value ="true" />
< param name ="initparams" value ="id=12343,name=silverlight学习" />
< a href ="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style ="text-decoration: none;" >
< img src ="http://go.microsoft.com/fwlink/?LinkId=108181" alt ="获取 Microsoft Silverlight"
style
="border-style: none" />
</ a >
</ object >

 

 

 

 注意:name=initParams 这个节点,后面的value 他就是sl中要获取的参数,value中的参数一般定义为value="key=value,key=value..."
C#获取初始化参数.在App.xaml的 初始化方法Application_Startup写上如下代码:

private void Application_Startup(object sender, StartupEventArgs e)
		{
            MainPage main = new MainPage();
            this.RootVisual = main;

            foreach (string item in e.InitParams.Keys)
            {
                main.listBox.Items.Add(new TextBlock()
                {
                    Text = String.Format("网页参数:{0} = {1}", item, e.InitParams[item])
                });
            }
           
}

OK, 效果图我就不演示啦,大家自己试试...

2,sl获取URL传递参数

   这个比较简单,主要用了HtmlPage.Document.QueryString[key],key就是参数的名字了

3,silverlight 捕获一些常用的浏览器信息

            BrowserInformation brow = HtmlPage.BrowserInformation;
            this.txtBlock1.Text = string.Format("浏览器名称:{0}",brow.Name);
            txtBlock1_Copy.Text = string.Format("浏览器版本:{0}", brow.BrowserVersion);
            txtBlock1_Copy1.Text = string.Format("浏览器操作系统名称:{0}", brow.Platform);
            txtBlock1_Copy2.Text = string.Format("代理字符串:{0}",brow.UserAgent);

4,silverlight操作HTML元素
  XAML代码省略
C# 代码:

   private void Button_Click(object sender, RoutedEventArgs e)
        {
            HtmlElement img = HtmlPage.Document.GetElementById("img11");

            img.SetAttribute("width",txtwidth.Text);
            img.SetAttribute("height", txtheight.Text);
        }

前台HTML代码:

  
  
< div >
< img id ="img11" src ="silverlight.jpg" /></ div >

 

通过sl代码 来动态改变前台img的尺寸

5,HTML元素操作Silverlight对象

 XAML代码如下: 

 

  
  
< Ellipse x:Name ="elipse" Fill ="White" Stroke ="Black" Height ="138" Margin ="136,0,302,88" VerticalAlignment ="Bottom" />
< TextBlock x:Name ="txtState" Height ="20" Margin ="136,0,317,53" VerticalAlignment ="Bottom" TextWrapping ="Wrap" />

 

 

C# 代码:

public HtmlAndSilverlightDemo()
		{
			// 为初始化变量所必需
			InitializeComponent();
            HtmlElement select = HtmlPage.Document.GetElementById("sel1");

            select.AttachEvent("onchange", new EventHandler<HtmlEventArgs>(Select_onChange));
		}

        public void Select_onChange(object sender, HtmlEventArgs e) 
        {
            HtmlElement select = sender as HtmlElement;
            string value = select.GetAttribute("value");
            txtState.Text = value;
            switch (value)
            {
                case "红色":
                    this.elipse.Fill = new SolidColorBrush(Colors.Red);
                    break;
                case "绿色":
                    this.elipse.Fill = new SolidColorBrush(Colors.Green);
                    break;
                case "蓝色":
                    this.elipse.Fill = new SolidColorBrush(Colors.Blue);
                    break;
                default:
                    break;
            }
        }

HTML代码:

  
  
< div > 请选择: < select id ="sel1" >
< option value ="红色" > 红色 </ option >
< option value ="绿色" > 绿色 </ option >
< option value ="蓝色" > 蓝色 </ option >
</ select ></ div >

 

主要思路是,是通过前台的一个下拉列表的更改, 来改变silverlight中椭圆的颜色. 大家可以根据这个思路开扩展.

6,使用HttpUtility类

 UrlEncode 和UrlDecode 还有HtmlEncode和HtmlDecode 都是大家在做 Asp.net时候常用到的编码类.  在silvelight中 他在HttpUtility类中可调用 具体的调用和在asp.net中一样,这里就不做具体介绍了.

7,使用Document.Cookies读写Cookie

 为了操作简单,我写了一个CookieHelp类    c#代码如下:

 #region Cookie操作

        /// <summary>
        /// 添加cookie
        /// </summary>
        /// <param name="key"></param>
        /// <param name="value"></param>
        public static void SetCookie(string key, string value)
        {
            DateTime expire = DateTime.UtcNow + TimeSpan.FromDays(30);
            string cookie = string.Format("{0}={1};expires={2}", key, value, expire.ToString("R"));
            HtmlPage.Document.SetProperty("cookie", cookie);
        }

        /// <summary>
        /// 获取cookie
        /// </summary>
        /// <param name="key"></param>
        /// <returns></returns>
        public static string GetCookie(string key)
        {
            key += '=';
            string[] cookies = HtmlPage.Document.Cookies.Split(';');
            foreach (string cookie in cookies)
            {
                string cookieStr = cookie.Trim();
                if (cookieStr.StartsWith(key,StringComparison.OrdinalIgnoreCase))
                {
                    //分隔出key的值
                    string[] vals = cookieStr.Split('=');
                    if (vals.Length >=2)
                    {
                        return vals[1];//返回值
                    }
                    return string.Empty;
                }
            }
            //没有找到就返回空字符串
            return string.Empty;
        }

        #endregion

8,使用 HtmlPage.Window类 页面导航

           
string url = "www.baidu.com";
            Uri uri = new Uri(url,UriKind.RelativeOrAbsolute);
            HtmlPage.Window.Navigate(uri);

消息提示:

  三种弹出窗口:

            
HtmlPage.Window.Alert("alert");
            HtmlPage.Window.Confirm("你确定吗?");
            HtmlPage.Window.Prompt("请输入密码");

9,在silverlight中调用javascript

XAML代码:

 

  
  
< Canvas Height ="74" Margin ="8,129,48,0" VerticalAlignment ="Top" >
< TextBlock Height ="18" Width ="159" Canvas.Left ="8" Canvas.Top ="8" Text ="2,在Silverlight调用Javascript" TextWrapping ="Wrap" />
< Button Height ="28" Width ="111" Canvas.Left ="19" Canvas.Top ="39" Content ="Invoke" Click ="Button_Click_2" />
< Button Height ="28" Width ="111" Canvas.Left ="151" Canvas.Top ="39" Content ="InvokeSelf" Click ="Button_Click_3" />
</ Canvas >

 

 

 

C#:

  private void Button_Click_2(object sender, RoutedEventArgs e)
        {
            HtmlPage.Window.Invoke("calljs","Invokes");
        }

        private void Button_Click_3(object sender, RoutedEventArgs e)
        {
            //创建脚本
            ScriptObject calljs = (ScriptObject)HtmlPage.Window.GetProperty("calljs");
            calljs.InvokeSelf("InvokeSelf");
        }
   private void UserControl_Loaded(object sender, RoutedEventArgs e)
        {
            //js脚本
            string jsText = "function calljs(msg){alert(msg);}";
            //创建脚本
            HtmlElement element = HtmlPage.Document.CreateElement("Script");
            element.SetAttribute("type","text/javascript");
            element.SetProperty("text",jsText);
           
            //添加脚本到页面中
            HtmlPage.Document.Body.AppendChild(element);

        }

这里用了两种方法来调用js脚本.其效果一样的. 两个方法分别是 Invoke 和InvokeSelf.

10,在javascript 调用Silverlight

通过创建一个矩形来演示操作  C#;

public UserControl1()
		{
			// 为初始化变量所必需
			InitializeComponent();

            HtmlPage.RegisterScriptableObject("Builder",this);
		}

//定义这个方法为脚本成员
        [ScriptableMember]
        public void CreateRect(int width,int height) 
        {
            Rectangle rect = new Rectangle();
            rect.Width = width;
            rect.Height = height;
            rect.Fill = new SolidColorBrush(Colors.Blue);
            this.canvase.Children.Clear();
            this.canvase.Children.Add(rect);
        }

javascript: 

<script type="text/javascript"> function createRect() { var xamlObj = document.all("XamlObject"); xamlObj.content.Builder.CreateRect(document.all("txtWidth").value, document.all("txtHeight").value); } </script> 

HTML:

 

  
  
< div >
宽度:
< input type ="text" id ="txtWidth" />
高度:
< input type ="text" id ="txtHeight" />
< input type ="button" value ="改变" onclick ="createRect()" />
</ div >

 

 

 

效果. 大家ctrl+c --Ctrl+v 可以试试... 

注:以上代码需要引用System.Windows.Browser;这个命名空间 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值