
工具(控件集):
1.Contextmenu;2.ToggleSwitch;3.WrapPanel;4.DatAPIcker;
5.TimePicker;6.autocompletebox;7.NavigationTransition;
8.ListPicker;9.LongListSelector
1.Contextmenu:长按d出菜单;不能在容器控件中使用
<toolkit:ContextMenuService.ContextMenu>(需额外添加代码)
<toolkit:ContentMenu Height="400" margin="123,168,0" HorizontalAlignment="left" VerticalAlignment="top" WIDth="200" borderBrush="Red" borderThickness="5">
<toolkit:MenuItem header="Test1" Click="MenuItem_Click"/>
<toolkit:MenuItem header="Test2" Click="MenuItem_Click"/>
<toolkit:Separator/>//分隔符控件
<toolkit:MenuItem header="Test3" Click="MenuItem_Click"/>
</toolkit:ContentMenu>
</toolkit:ContextMenuService.ContextMenu>
---菜单增加图片---
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu Height="400" margin="123,0"
HorizontalAlignment="left" name="contextMenu1" VerticalAlignment="top" WIDth="200" borderBrush="Red" borderThickness="5">
<toolkit:MenuItem header="Test1" Click="MenuItem_Click"/>
<toolkit:MenuItem header="Test2" Click="MenuItem_Click"/>
<toolkit:Separator/>
<toolkit:MenuItem Click="MenuItem_Click">
<toolkit:MenuItem.header>
<StackPanel OrIEntation="Horizontal">
<Image WIDth="50" Height="50" Source="ApplicationIcon.png"/>
<TextBlock Text="Test3"/>
</StackPanel>
</toolkit:MenuItem.header>
</toolkit:MenuItem>
</toolkit:ContextMenu>
</toolkit:ContextMenuSeervice.ContextMenu>
2.ToggleSwitch:有两种状态Checked和UnChecked
<toolkit:ToggleSwitch header="ToggleSwitch" Content="是"
HorizontalAlignment="left" margin="74,106,0" name="toggleSwitch1" Height="116"VeiticalAlignment="top"
WIDth="271" Checked="toggleSwitch1_Checked" UnChecked="toggleSwitch1_UnChecked"/>
<toolkit:ToggleSwitch header="ToggleSwitch" Height="116" HorizontalAlignment="left" margin="74,0,0" name="toggleSwitch2" VerticalAllignment="top" WIDth="271" Checked="toggleSwitch2_Checked" UnChecked="toggleSwitch2_UnChecked"/>
(对于中文文字需代码改写)在代码中:
在Checked事件中:toggleSwitch2.Content="是";
在UnChecked事件中:toggleSwitch2.Content="否";
3.WrapPanel:包含在控件里的元素从左到右或从上到下一次安排位置,并会自动换行(子控件自动排列,如:颜色、日历)
<controlsToolkit:WrapPanel x:name="wp1" WIDth="35"
margin="15,15,201" Height="300" VerticalAlignment="Bottom" OrIEntation="Horizontal"/>
在页面加载时,代码:
for(int i=0;i<30;i++)
{
wp1.Children.Add(new Rectangle({Height=50,WIDth=50,
Fill=new SolIDcolorBrush(color.Yellow)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Purple)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Red)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Black)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.brown)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Cyan)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Green)});
wp1.Children.Add(new Rectangle({Height=50,
Fill=new SolIDcolorBrush(color.Gray)});
}
4.DatAPIcker:日期控件
<toolkit:DatAPIcker margin="41,121,0" Height="77"
name="datAPIaker1" VerticalAlignment="top" Foreground="White" HorizontalContentAlignment="Center"
ValueCahnge="datAPIcker1_ValueChanged">
<toolkit:DatAPIcker.Backgroung>
<ImageBrush ImageSource="Image/hkd16.jpg"/>
</toolkit:DatAPIcker.Background>
</toolkit:DatAPIcker>
属性:ValueStringFormat:设置显示时间格式
Description:Short data format(DatAPIcker default)
XAML:"{}{0:d}" Sample:9/20/2010
Description:Short data format(TimePicker default)
XAML:"{}{0:t}" Sample:4:00 PM
Description:Long data format
XAML:"{}{0:D}" Sample:Monday,September 20,2010
Description:Long time format
XAML:"{}{0:T}" Sample:4:00:00 PM
Description:Explicit month/day/year fromat
XAML:"{}{0:MM-dd-yyyy}" Sample:09-20-2010
Description:Explicit 24-hour time fromat with text
XAML:"{}The 24-hour time is {0:HH:mm}."
Sample:The 24-hour time is 16:00
对于日期下的两个按钮设置图片:
(1).需先添加一个文件夹,命名为:Toolkit.Content
(2).加载图片:对应的系统目录(注意对图片的属性的修改)
(3).Content/copy if New
5.TimePicker
<toolkit:TimePicker HorizontalAlignment="left" margin="92,275,0" name="timePicker1" WIDth="302" VerticalAlignment="top" ValueStringFormat="{}12小时{0:d}"
ValueCahnged="timePicker1_ValueChanged"/>
(工程中新建文件夹:Toolkit.Content,将两个ApplicationbarIconbutton的图片放进去,并加入到工程中)
在对应的事件的代码:(年月日和时间)
this.PageTitle.Text=e.NewDataTime.ToString();
6.autocompletebox:输入文字时,可以列出联想词
(不过需后台,加入词库!)
<phone:PhoneApplicationPage.Resources>//字库以资源方式载入
<data:LoremIpsum x:Key="words"/> //自定义资源
</phone:PhoneApplicationPage.Resources>
<toolkit:autoCompeleteBox HorizontalAlignment="left" margin="82,32,0" name="autocompletebox1" VerticalAlignment="top" WIDth="291" Height="72"
ItemSource="{StaticResourcewords}"/>
属性:
1.FilterMode:匹配方式
2.IsDropDownopen:下拉列表是否打开
3.IsTextCompletionEnable:自动完成匹配填写
4.MaxDropDownHeight:下拉列表的最大高度
5.MinimumPopulateDelay:最小匹配时间
6.MinimumPrefixLength:最短匹配长度
事件:
DropDownClosed/DropDownCloseing
DropDownopened/DropDownopening
在项目中,加一个文本,写入你的词库
7.NavigationTransition:实现页面的切换效果
将App.xaml.cs中InitializePhoneAppliction()函数里的RootFrame进行修改:RootFrame=new TransitionFrame();(注意)
五种动画效果:
-RollTransition
-RotateTransition
-SlIDeTransition
-SwivelTransition
-TurnstileTransition
//进入页面动画效果
<toolkit:TransitionService.NavigationInTransition>
<toolkit:NavigationInTransition>
<toolkit:NavigationInTransition.Backward>
//这是旋转动画效果
<toolkit:RotateTransition Mode="In180Clockwise"/>
</toolkit:NavigationInTransition.Backward>
<toolkit:NavigationInTransition.Forward>
<toolkit:RotateTransition Mode="In180Clockwise"/>
<toolkit:NavigationInTransition.Forward>
</toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>
//退出页面动画效果
<toolkit:TransitionService.NavigationOutTransition>
<toolkit:NavigationOutTransition>
<toolkit:NavigationOutTransition.Backward>
<toolkit:RotateTransition Mode="Out180Clockwise"/>
</toolkit:NavigationOutTransition.Backward>
<toolkit:NavigationOutTransition.Forward>
<toolkit:RotateTransition Mode="Out180Clockwise"/>
</toolkit:NavigationOutTransition.Forward>
</toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>
8.ListPicker:简单列表框
属性:Full Mode 完整页面的列表框
属性:ListPickerMode的使用
(对于本题的字符串需要一个字符串的命名空间:
xmlns:sys="clr-namespace:System;assembly=mscorlib")
<toolkit:ListPicker Height="220" name="ListPicker1"
HorizontalAlignment="left" margin="12,381,0" WIDth="438"
VerticalAlignment="top" header="Test1" SelectionChanged="ListPicker1_SelectionChanged">
<sys:String>Red</sys:String>
<sys:String>Green</sys:String>
<sys:String>Blue</sys:String>
</toolkit:ListPicker>
<toolkit:ListPicker ItemsSource="{Binding}" Height="88" name="ListPicker2" HorizontalAlignment="left" margin="6,513,0" VerticalAlignment="top" WIDth="444"
header="Test2" FellModeheader="colors">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel OrIEntation="Horizontal">
<Rectangle Fill="{Binding}" WIDth="24" Height="24"/>
<TextBlock Text="{Binding}" margin="12 0 0 0"/>
</StackPanle>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel OrIEntation="Horizontal">
<Rectangle Fill="{Binding}" WIDth="24" Height="24"/>
<TextBlock Text="{Binding}" margin="12 0 0 0"/>
</StackPanle>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
对于数据绑定:后台代码;
static Readonly string[] Accentcolors={"purple","blue","park","teal","red","dark"};
在构造函数中:this.DataContent=Accentcolors;
9.LongListSelector:是一个归类列表;把数据进行绑定和分类
<toolkit:LongListSelector HorizontalAlignment="left" margin="12,162,0" name="longListSelector1" Height="213"
VerticalAlignment="top" WIDth="438" ItemsSource="{StaticResource people}">
//设置以什么样的方式显示分类列表,如果没有这个设置,分类列表以直列显示
<toolkit:LongListSelector.GroupItemsPanel>
//分类列表内的item显示内容和方式
<toolkit:LongListSelector.GroupItemTemplate>
//设置列表分类的头的显示内容和方式
<toolkit:LongListSelector.GroupheaderTemplate>
//设置列表里的内容的显示方式
<toolkit:LongListSelector.ItemTemplate>
UserControl:UserControl类;同样基于UIElement
对于便于打开和关闭使用Popup控件,放在最外面
<Popup x:name="WaitingWnd" IsOpen="Falsh">
<GrID x:name="LayoutRoot" Background="transparent">
<TextBlock Height="44" HorizontalAlignment="left" margin="0,144,0" name="textBlock1" Text="请等待。。。"
VerticalAlignment="top" Foreground="Gray" WIDth="200" FontSize="32" TextAlignment="Center"/>
<Image Height="150" HorizontalAlignment="left" margin="22,6,0" name="image1" Stretch="Fill" WIDth="150"
VerticalAlignment="top"/>
</GrID>
</Popup>
后台代码:声明变量
dispatcherTimer Timer=null;//定时器
int Count=1;
public double Speed{get;set;}
在load事件中:
Timer=new dispatcherTimer();
Timer.Interval=Timspan.FranFillireconds(Speed);
Timer.Tick=new EventHndler(Timer_Tick);
在Timer_Tick事件中://动态加载
this.image1.source=new BitmAPImage(new Uri("Arrets/Loading00"+Count+".png",UriKind.relative));
Count=(Count==0?1:Count+1);
public voID WaitingBegin()
{
Timer.Start();
WaitingWnd.IsOpen=true;
}
public voID WaitingEnd()
{
Timer.Stop();
WaitingWnd.IsOpen=false;
}
写好后,就可使用,直接放到窗体上 在页面加载时; 调用WaitingBegin()方法
总结以上是内存溢出为你收集整理的Silverlight Tookit控件集全部内容,希望文章能够帮你解决Silverlight Tookit控件集所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)