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,Silverlight获取URL传递参数
- 这个比较简单,主要用了HtmlPage.Document.QueryString[key],key就是参数的名字了
3,silverlight 捕获一些常用的浏览器信息
- <pre class="brush:csharp;collapse:true;"> 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);
- </pre>
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;这个命名空间