与众不同 windows phone (2) - Control(控件)
原文:与众不同 windows phone (2) - Control(控件)
作者:webabcd
介绍
与众不同 windows phone 7.5 (sdk 7.1) 之控件
- Panorama - 全景图控件
- Pivot - 枢轴控件
- Map - bing 地图控件
- WebBrowser - 内嵌浏览器控件
- Other - 其他可用控件
示例
1、Panorama 的 Demo
Panorama.xaml
<phone:PhoneApplicationPage
x:Class="Demo.Controls.Panorama"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="False" xmlns:sys="clr-namespace:System;assembly=mscorlib"> <Grid x:Name="LayoutRoot">
<!--
Panorama - 全景图控件
Title - Panorama 的标题
Background - Panorama 的背景
-->
<controls:Panorama x:Name="panorama" Title="Title"> <controls:Panorama.Background>
<ImageBrush ImageSource="/Controls/Assets/diandian.jpg"/>
</controls:Panorama.Background> <!--
PanoramaItem - Panorama 的项
Header - PanoramaItem 的标题
Orientation - PanoramaItem 中的内容的排列方向(Vertical 或 Horizontal),默认值为 Vertical
-->
<controls:PanoramaItem Header="Item 01">
<Grid>
<StackPanel>
<TextBlock Text="我是文本,太长了的话会自动换行" Style="{StaticResource PhoneTextLargeStyle}" TextWrapping="Wrap"/>
<TextBlock Text="我是文本,太长了的话不会自动换行" Style="{StaticResource PhoneTextLargeStyle}" TextWrapping="NoWrap"/>
</StackPanel>
</Grid>
</controls:PanoramaItem> <controls:PanoramaItem Header="Item 02" Orientation="Horizontal">
<Grid>
<Border BorderBrush="{StaticResource PhoneForegroundBrush}"
BorderThickness="{StaticResource PhoneBorderThickness}"
Background="#80808080">
<TextBlock Text="我是一段文本,我的显示区域很宽很宽"
Style="{StaticResource PhoneTextExtraLargeStyle}"
HorizontalAlignment="Center" VerticalAlignment="Center" >
</TextBlock> </Border>
</Grid>
</controls:PanoramaItem> <!--
如果需要 PanoramaItem 中的内容支持左右拖动的话,需要将 Orientation 设置为 Horizontal
以下 PanoramaItem 中的内容可以左右拖动,其中的 ListBox 可上下拖动
-->
<controls:PanoramaItem Header="Item 03" Orientation="Horizontal">
<StackPanel Orientation="Horizontal">
<ListBox FontSize="{StaticResource PhoneFontSizeLarge}" Width="480">
<sys:String>a</sys:String>
<sys:String>b</sys:String>
<sys:String>c</sys:String>
<sys:String>d</sys:String>
<sys:String>e</sys:String>
<sys:String>f</sys:String>
<sys:String>g</sys:String>
<sys:String>h</sys:String>
<sys:String>i</sys:String>
<sys:String>j</sys:String>
<sys:String>k</sys:String>
<sys:String>l</sys:String>
<sys:String>m</sys:String>
<sys:String>n</sys:String>
<sys:String>o</sys:String>
<sys:String>p</sys:String>
<sys:String>q</sys:String>
<sys:String>r</sys:String>
</ListBox>
<TextBlock Text="webabcd" />
</StackPanel>
</controls:PanoramaItem> </controls:Panorama>
</Grid> </phone:PhoneApplicationPage>
Panorama.xaml.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 Microsoft.Phone.Controls; namespace Demo.Controls
{
public partial class Panorama : PhoneApplicationPage
{
public Panorama()
{
InitializeComponent(); this.Loaded += new RoutedEventHandler(Panorama_Loaded);
} void Panorama_Loaded(object sender, RoutedEventArgs e)
{
/*
* Panorama - 全景图控件
* DefaultItem - 指定 Panorama 控件的第一项内容
* SelectionChanged - 选中项发生改变时所触发的事件(左右滑动 Panorama,切换 item 则触发此事件)
* SelectedIndex - 选中项的索引
* SelectedItem - 选中项
*/ panorama.DefaultItem = panorama.Items[];
}
}
}
2、Pivot 的 Demo
Pivot.xaml
<phone:PhoneApplicationPage
x:Class="Demo.Controls.Pivot"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True" xmlns:sys="clr-namespace:System;assembly=mscorlib"> <Grid x:Name="LayoutRoot" Background="Transparent">
<!--
Pivot - 枢轴控件
Title - Pivot 的标题
Background - Pivot 的背景
-->
<controls:Pivot Title="Title"> <!--
PivotItem - Pivot 的项
Header - PivotItem 的标题
-->
<controls:PivotItem Header="Item 01">
<Grid>
<TextBlock TextWrapping="Wrap" Style="{StaticResource PhoneTextLargeStyle}">
<Run>webabcd</Run>
<LineBreak/>
<Run>windows phone</Run>
</TextBlock>
</Grid>
</controls:PivotItem> <controls:PivotItem Header="Item 02">
<Border BorderBrush="{StaticResource PhoneForegroundBrush}" BorderThickness="{StaticResource PhoneBorderThickness}">
<Grid>
<TextBlock TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"
Text="wp7" />
</Grid>
</Border>
</controls:PivotItem> <controls:PivotItem Header="Item 03">
<Grid>
<ListBox FontSize="{StaticResource PhoneFontSizeLarge}">
<sys:String>a</sys:String>
<sys:String>b</sys:String>
<sys:String>c</sys:String>
<sys:String>d</sys:String>
<sys:String>e</sys:String>
<sys:String>f</sys:String>
<sys:String>g</sys:String>
<sys:String>h</sys:String>
<sys:String>i</sys:String>
<sys:String>j</sys:String>
<sys:String>k</sys:String>
<sys:String>l</sys:String>
<sys:String>m</sys:String>
<sys:String>n</sys:String>
<sys:String>o</sys:String>
<sys:String>p</sys:String>
<sys:String>q</sys:String>
<sys:String>r</sys:String>
</ListBox>
</Grid>
</controls:PivotItem> </controls:Pivot>
</Grid> </phone:PhoneApplicationPage>
3、Bing Map 的 Demo
Map.xaml
<phone:PhoneApplicationPage
x:Class="Demo.Controls.Map"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
shell:SystemTray.IsVisible="True" xmlns:my="clr-namespace:Microsoft.Phone.Controls.Maps;assembly=Microsoft.Phone.Controls.Maps"> <Grid x:Name="LayoutRoot" Background="Transparent">
<StackPanel Orientation="Vertical"> <!--
Map - bing 地图控件
-->
<my:Map x:Name="map" /> <Button x:Name="btnZoomIn" Content="放大" Click="btnZoomIn_Click" />
<Button x:Name="btnZoomOut" Content="缩小" Click="btnZoomOut_Click" />
<Button x:Name="btnRoad" Content="平面图" Click="btnRoad_Click" />
<Button x:Name="btnAerial" Content="卫星图" Click="btnAerial_Click" /> </StackPanel>
</Grid>
</phone:PhoneApplicationPage>
Map.xaml.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 Microsoft.Phone.Controls;
using Microsoft.Phone.Controls.Maps; namespace Demo.Controls
{
public partial class Map : PhoneApplicationPage
{
public Map()
{
InitializeComponent(); this.Loaded += new RoutedEventHandler(Map_Loaded);
} void Map_Loaded(object sender, RoutedEventArgs e)
{
/*
* Map - bing 地图控件
* Center - 地图的中心点坐标
* Mode - 地图模式。RoadMode: 平面图,AerialMode:卫星图
* ZoomLevel - 地图的放大级别
*/ map.Center = new System.Device.Location.GeoCoordinate(39.9, 116.3);
map.ZoomLevel = ;
} private void btnRoad_Click(object sender, RoutedEventArgs e)
{
map.Mode = new RoadMode();
} private void btnAerial_Click(object sender, RoutedEventArgs e)
{
map.Mode = new AerialMode();
} private void btnZoomIn_Click(object sender, RoutedEventArgs e)
{
map.ZoomLevel++;
} private void btnZoomOut_Click(object sender, RoutedEventArgs e)
{
map.ZoomLevel--;
}
}
}
4、WebBrowser 的 Demo
WebBrowser.xaml
<phone:PhoneApplicationPage
x:Class="Demo.Controls.WebBrowser"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent">
<StackPanel Orientation="Vertical"> <!--
WebBrowser - 内嵌浏览器控件
Source - 需要浏览器解析的页面地址
-->
<phone:WebBrowser x:Name="webBrowser" Width="480" Height="480" Source="http://webabcd.cnblogs.com/" IsScriptEnabled="True" /> <Button x:Name="btnNavigateRemoteUrl" Content="导航到一个互联网页面" Click="btnNavigateRemoteUrl_Click" />
<Button x:Name="btnNavigateLocalUrl" Content="导航到一个项目内页面" Click="btnNavigateLocalUrl_Click" />
<Button x:Name="btnScript" Content="脚本交互" Click="btnScript_Click" /> </StackPanel>
</Grid> </phone:PhoneApplicationPage>
WebBrowser.xaml.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 Microsoft.Phone.Controls;
using System.Windows.Resources;
using System.IO; namespace Demo.Controls
{
public partial class WebBrowser : PhoneApplicationPage
{
public WebBrowser()
{
InitializeComponent(); webBrowser.ScriptNotify += new EventHandler<NotifyEventArgs>(webBrowser_ScriptNotify);
} private void btnNavigateRemoteUrl_Click(object sender, RoutedEventArgs e)
{
/*
* WebBrowser - 内嵌浏览器控件
* Source - 需要浏览器解析的页面地址
* Navigate() - 导航到指定的地址,并解析(需要在 WebBrowser 控件 Loaded 之后才能调用此方法,否则会报错)
* LoadCompleted - WebBrowser 中的页面加载完成后所触发的事件
* NavigateToString() - 解析指定的字符串
* SaveToString() - 获取当前 WebBrowser 所显示的 HTML 内容,返回一个字符串类型
* IsGeolocationEnabled - 指定是否可使用设备的位置服务
* IsScriptEnabled - 指定是否需要支持脚本
* InvokeScript() - 调用当前 WebBrowser 所加载的 HTML 内容中的 JavaScript 脚本
* ScriptNotify - 当 WebBrowser 内的 JavaScript 以 “window.external.notify(string);” 的方式发送信息到 windows phone app 时所触发的事件
* NotifyEventArgs - ScriptNotify 事件的事件参数
* NotifyEventArgs.Value - JavaScript 发送到 windows phone app 中的信息,即 “window.external.notify(string);” 中的字符串
*/ webBrowser.Source = new Uri("http://msdn.microsoft.com/");
// webBrowser.Navigate(new Uri("http://msdn.microsoft.com/"));
} private void btnNavigateLocalUrl_Click(object sender, RoutedEventArgs e)
{
// 注意 WebBrowser 不能直接解析类似如下地址的项目内资源,因为对于 WebBrowser 来说这样的相对地址指向的是独立存储(Isolated Storage)
// webBrowser.Navigate(new Uri("Controls/readme.html", UriKind.Relative)); StreamResourceInfo sr = Application.GetResourceStream(new Uri("Controls/readme.html", UriKind.Relative));
using (BinaryReader br = new BinaryReader(sr.Stream))
{
byte[] data = br.ReadBytes((int)sr.Stream.Length);
webBrowser.NavigateToString(System.Text.Encoding.UTF8.GetString(data, , data.Length));
}
} private void btnScript_Click(object sender, RoutedEventArgs e)
{
webBrowser.Navigate(new Uri("http://localhost:15482/ForWebBrowser.html"));
} void webBrowser_ScriptNotify(object sender, NotifyEventArgs e)
{
// 显示 JavaScript 发来的信息
MessageBox.Show(e.Value); // 显示 WebBrowser 调用 JavaScript 函数后返回的结果
MessageBox.Show((string)webBrowser.InvokeScript("hello", "webabcd"));
}
}
}
ForWebBrowser.html
<script type="text/javascript">
// 此函数用于演示:windows phone app 中的 WebBrowser 调用 JavaScript 函数
function hello(name) {
return "hello: " + name;
}
// 此方法用于演示:JavaScript 发信息给 windows phone app 中的 WebBrowser
try {
window.external.notify('哈哈哈');
} catch (err) { }
</script>
5、其他可用控件的 Demo
Other.xaml
<phone:PhoneApplicationPage
x:Class="Demo.Controls.Other"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent">
<TextBlock TextWrapping="Wrap">
<Run>其他可用控件如下:(具体演示参考《稳扎稳打 Silverlight 系列文章》)</Run>
<LineBreak />
<Run>Border</Run>
<LineBreak />
<Run>Buton</Run>
<LineBreak />
<Run>Canvas</Run>
<LineBreak />
<Run>CheckBox</Run>
<LineBreak />
<Run>Grid</Run>
<LineBreak />
<Run>HyperlinkButon</Run>
<LineBreak />
<Run>Image</Run>
<LineBreak />
<Run>InkPresenter</Run>
<LineBreak />
<Run>ListBox</Run>
<LineBreak />
<Run>MediaElement</Run>
<LineBreak />
<Run>PasswordBox</Run>
<LineBreak />
<Run>MultiScaleImage</Run>
<LineBreak />
<Run>PasswordBox</Run>
<LineBreak />
<Run>ProgressBar</Run>
<LineBreak />
<Run>RadioButton</Run>
<LineBreak />
<Run>RichTextBox</Run>
<LineBreak />
<Run>ScrollViewer</Run>
<LineBreak />
<Run>Slider</Run>
<LineBreak />
<Run>StackPanel</Run>
<LineBreak />
<Run>TextBlock</Run>
<LineBreak />
<Run>TextBox</Run>
<LineBreak />
</TextBlock>
</Grid> </phone:PhoneApplicationPage>
OK
[源码下载]
与众不同 windows phone (2) - Control(控件)的更多相关文章
- [深入浅出Windows 10]QuickCharts图表控件库解析
13.4 QuickCharts图表控件库解析 QuickCharts图表控件是Amcharts公司提供的一个开源的图表控件库,这个控件库支持WPF.Silverlight.和Windows等 ...
- 在VC++中使用Tab Control控件
系统环境:Windows 7软件环境:Visual Studio 2008 SP1本次目的:在模态或非模态对话框中使用Tab Control控件,及引申在单/多文档中使用 查阅MSDN文档,对于创建T ...
- MFC Month Calendar Control 控件使用
在上层软件编程中,往往须要提供一个月历控件让用户选择对应日期或者用此月历控件来强调特定的一天. MFC的 Month Calendar Control 控件自系统升级到 Windows 7 之后,对于 ...
- 通过编写串口助手工具学习MFC过程——(七)添加Tab Control控件
通过编写串口助手工具学习MFC过程 因为以前也做过几次MFC的编程,每次都是项目完成时,MFC基本操作清楚了,但是过好长时间不再接触MFC的项目,再次做MFC的项目时,又要从头开始熟悉.这次通过做一个 ...
- windows下注册ocx控件
OCX 是对象类别扩充组件(Object Linking and Embedding (OLE) Control Extension):是可执行的文件的一种,但不可直接被执行: 是 ocx 控件的扩展 ...
- MFC编程 | tab control控件的使用
因为课程需要,会用到MFC编程,所以讲一些经验总结下,以便日后使用查询. // tab control控件的使用 // 建立一个Cluster窗口,通过tab可以切换成C-Means和Fuzzy C- ...
- [深入浅出Windows 10]分屏控件(SplitView)
4.18 分屏控件(SplitView) 分屏控件(SplitView)是Windows 10新增的控件类型,也是Windows 10通用应用程序主推的交互控件,通常和一个汉堡按钮搭配作为一种抽屉式菜 ...
- OpenCV 2.2版本号以上显示图片到 MFC 的 Picture Control 控件中
OpenCV 2.2 以及后面的版本号取消掉了 CvvImage.h 和CvvImage.cpp 两个文件,直接导致了苦逼的程序猿无法调用里面的显示函数来将图片显示到 MFC 的 Picture Co ...
- 深入Windows窗体原理及控件重绘技巧
之前有学MFC的同学告诉我觉得Windows的控件重绘难以理解,就算重绘成功了还是有些地方不明白,我觉得可能很多人都有这样的问题,在这里我从Windows窗体的最基本原理来讲解,如果你有类似的疑惑希望 ...
随机推荐
- 给刚通过51入门的新人讲讲S12(MCS12XS128)与51的差别
MCS51是keil也对应地做好了非常多,也就是有非常多对你而言是透明的,是你不必关心的,你所要接触的寄存器数量也非常小,在这个时候你很多其它是写函数,仅仅只是针对这个平台写C程序比在PC上写C控制台 ...
- MAMP:在 OSX 中搭建 Apache, MySQL, PHP 环境并本地安装、调试 WordPress
MAMP 这个名字来源于 Macintosh Apache MySQL PHP,显然专门用来在 Mac 环境下搭建 Apache.MySQL.PHP 平台. 虽然 OSX 中已经预装了 Apache ...
- ZOJ 3829 Known Notation 乱搞
乱搞: 1.数字的个数要比*的个数多一个,假设数字不足须要先把数字补满 2.最优的结构应该是数字都在左边,*都在右边 3.从左往右扫一遍,遇到数字+1,遇到*-1,假设当前值<1则把这个*和最后 ...
- Swift Error fatal error: unexpectedly found nil while unwrapping an Optional value
致命的错误: 对一个为空的optional值进行解包. 强制解包(forced unwrapping): 在optional后面加叹号. 比如 "value!" 错误代码: le ...
- python3.4 尝试 py2exe
第一次成功将python3.4脚本生成 exe文件. 测试环境:win8.1 32位,python3.4,pyside py打包成exe的工具我所知道的有三种 cx-freeze , py2exe , ...
- BZOJ 2588: Spoj 10628. Count on a tree( LCA + 主席树 )
Orz..跑得还挺快的#10 自从会树链剖分后LCA就没写过倍增了... 这道题用可持久化线段树..点x的线段树表示ROOT到x的这条路径上的权值线段树 ----------------------- ...
- Ch02 从零开始实例学习4
演练2-4 添加视图 原文链接:http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-vi ...
- Linux入门:文件权限、用户、用户组(比较清楚)
单个文件名或目录名长度不超过255字符: 文件或目录的绝对路径长度不超过4096字符: 一.文件所有者与用户组 一个文件有很多属性,包括文件类型.文件权限.文件隐藏权限.文件所有者.用户组 ...
- encode_utf8 把字符编码成字节 微信例子
##µ¼Èë encode_json decode_json use JSON qw/encode_json decode_json/; print "1111111111111111-\$ ...
- 基于visual Studio2013解决C语言竞赛题之1015日期计算
题目 解决代码及点评 /* 15. 已知某年不是闰年,给定该年某一天的月份和日期, 求这一天是该年的第几天. */ #include <stdio.h> #incl ...