1、 Canvas、StackPanel、Grid
Width、Height的可选值:Auto,自动:*,表示百分号时为:0.3*
2、Button在Grid中占两列的代码:Grid.ColumnSpa
n="2"
3、点击Button在StackPanel中动态添加元素:
TextBox tb=new TextBox(); tb.Text=DataTime.Now.ToString(); StackPanel.Children.Add(tb);
4、在Button的Click事件中动态生成元素
1 private void btn1_Click(object sender, RoutedEventArgs e) 2 { 3 for (int row = 0; row < 3; row++) 4 { 5 for (int column = 0; column < 3; column++) 6 { 7 TextBox tb = new TextBox(); 8 tb.Text = row + "," + column; 9 Grid.SetRow(tb,row); //在Grid下设置行,相当于XAML中设置tb的Grid.Row属性 10 Grid.SetColumn(tb, column); 11 grid1.Children.Add(tb);//动态添加到grid1中TextBox的子元素 12 } 13 } 14 }
5、连连看,随机生成并显示图片
1 protected override void OnNavigatedTo(NavigationEventArgs e) 2 { 3 //定义10行8列 4 for (int i = 0; i < 10; i++) 5 { 6 RowDefinition rowdf=new RowDefinition(); 7 grid1.RowDefinitions.Add(rowdf); 8 } 9 for (int i = 0; i < 8; i++) 10 { 11 ColumnDefinition coldf = new ColumnDefinition(); 12 grid1.ColumnDefinitions.Add(coldf); 13 } 14 //在定义好的行列中添加图片来显示进行连连看 15 //随机生成代码一定要写在for循环外面 16 Random rd = new Random(); 17 for (int row = 0; row < 10; row++) 18 { 19 for (int column = 0; column < 8; column++) 20 { 21 Image img = new Image(); 22 //随机生成6个图片,取不到上限值所以上限值为7 23 int sum = rd.Next(1, 7); 24 //通过代码来为Image赋值,如果图片位于项目中,则需要添加“ms-appx:///” 25 string filename = "ms-appx:///Images/" + sum + ".png"; 26 // img.Source=new Windows.UI.Xaml.Media.Imaging.BitmapImage(new Uri(filename)); 27 //任何一个类型都不能强转string类型,因为任何类都没有继承于string,string是密封类。Source为ImageSource类型 28 //img.Source的类型为ImageSource类型,BitmapImage继承于BitmapSource,BitmapSource继承于ImageSource 29 img.Source = new BitmapImage(new Uri(filename)); 30 grid1.Children.Add(img); 31 Grid.SetColumn(img, column); 32 Grid.SetRow(img, row); 33 } 34 } 35 }
注意: //通过代码来为Image赋值,如果图片位于项目中,则需要添加“ms-appx:///”,如果不添加的话会出现以下错误信息:“Invalid URI:The format of the URI could not be determined”
6、Button
想在Button中添加多个控件,需要加上StackPanel容器
7、画刷(Brush)
实心颜色画刷:SolidColorBrush
渐变画刷:LinearGradienBrush
图片画刷:ImageBrush
Brush类型的属性都可以指定各种Brush,例如Button的Foreground、Rectangle的Fill
Brush在Button中设计的代码:
1 <Button Content="Button" > 2 <Button.Background> //渐变画刷 3 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> //去掉 EndPoint="0.5,1" StartPoint="0.5,0"后,显示出来的是横向渐变 4 <LinearGradientBrush.RelativeTransform> //相对转换格式 5 <CompositeTransform CenterY="0.5" CenterX="0.5" SkewX="-3"/> //复合型转换格式 6 </LinearGradientBrush.RelativeTransform> 7 <GradientStop Color="Black" Offset="0"/> //Offset:抵消 8 <GradientStop Color="Yellow" Offset="0.7"/> 9 <GradientStop Color="red" Offset="1"/> 10 </LinearGradientBrush> 12 </Button.Background> 13 </Button>
8、歌词动态显示
(1)实现字体的瞬间变化
1 <TextBlock Text="我有一只小毛驴,从来也不骑。。。" Margin="105,302,0,0"> 2 <TextBlock.Foreground> 3 <LinearGradientBrush> 4 <GradientStop Color="Yellow"></GradientStop> 5 <GradientStop x:Name="gds1" Color="Yellow" Offset="0.38"></GradientStop> 6 <GradientStop x:Name="gds2" Color="Red" Offset="0.38"></GradientStop> 7 <GradientStop Color="Red" Offset="1"></GradientStop> 8 </LinearGradientBrush> 9 </TextBlock.Foreground> 10 </TextBlock>
(2)实现歌词的动态显示
1 protected override void OnNavigatedTo(NavigationEventArgs e) 2 { 3 //asp.net中有Timer控件来指定随时间变化发生的事情,在win8中用的是DispatcherTimer 4 DispatcherTimer timer = new DispatcherTimer(); 5 timer.Interval = TimeSpan.FromMilliseconds(200); //Interval:间隔、间距、幕间休息,TimeSpan:时间间隔 6 timer.Tick += timer_Tick; 7 timer.Start(); 8 } 9 void timer_Tick(object sender, object e) 10 { //Offset之间间隔0.05来更改颜色的变化,满值为 1 11 gds1.Offset += 0.05; 12 gds2.Offset += 0.05; 13 }
9、变换和投射
以Button为例:
(1)变换Transform:旋转变换(RotateTransform)、缩放变换(ScaleTransform)、平移变换(TranslateTransform)
<Button.RenderTransform> //Render:致使、打底、交纳 //混合变换 <CompositeTransform CenterY="20" CenterX="10" Rotation="11.978" ScaleX="1.5" SkewX="4" SkewY="2" TranslateX="12" TranslateY="33" /> <RotateTransform Angle="19" CenterX="12" CenterY="25"/> <ScaleTransform ScaleX="1.7" ScaleY="1.5"/> <TranslateTransform X="12" Y="20"/> </Button.RenderTransform>
(2)投射Projection:
<Image HorizontalAlignment="Left" Height="400" Margin="544,260,0,0" VerticalAlignment="Top" Width="552" Source="Assets/1.png" Stretch="Fill"> <Image.Projection> <PlaneProjection x:Name="pp1" RotationY="12"/> </Image.Projection> </Image>
10、页面导航
(1)缓存
wp中回退的页面的值是自动保存的缓存,而win8中的缓存是不存在的,可以自动添加
public BlankPage1() { this.InitializeComponent(); //启用缓存,当回退到该页面时之前做的修改仍存在,必须写在构造函数中 NavigationCacheMode = Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled; }
(2)导航、传参、返回
<1> Frame.Navigate(typeof(BlankPage1), 1); //导航到BlankPage1页面,并传参 <2> protected override void OnNavigatedTo(NavigationEventArgs e) { //e.Parameter 为导航到这个页面(此时页面为BlancPage1页面)时传入的参数 int i =(int) e.Parameter; if (i==1) { this.tbx1.Text = "我是一"; } else if (i==2) { this.tbx1.Text = "我是二"; } } <3> Frame.GoBack(); //返回上一个页面
(3)判断该页面是否是新页面(New)、前进页面(Forward)、后退页面(Back)或者是自身页面的导航(Refresh)
if (e.NavigationMode==NavigationMode.New) { }
如图:
11、样式
在silverlight中,微软定义的就是 属性等同于样式,win8中的样式和wp中的样式是一样的
在win8中,可以新添加一个资源字典把所有要定义的样式存放到一起,然后再引用
<Page.Resources> <ResourceDictionary Source="Dictionary1.xaml" /> </Page.Resources>
VS2012也自定义了一些样式,在默认的StandardStyles.xaml中
12、消息框(MessageDialog)
MessageDialog在 Using Windows.UI.Popups中;
MessageDialog mdialog = new MessageDialog("我是个好孩子", "提示"); mdialog.ShowAsync(); //对话框显示的异步操作
(1)、自定义消息框。下面是自己定义的消息框,命令是你想要的操作,此处略(用ToDo来表示)
private async void CustomCommandButton_Click2(object sender, RoutedEventArgs e) { //设置内容和标题 var messageDialog = new MessageDialog("确定离开该页面吗?", "提示"); messageDialog.Commands.Add(new UICommand("Don't install", (command) => { //ToDo: })); messageDialog.Commands.Add(new UICommand("Install updates", (command) => { //ToDo: })); //设置默认按钮 messageDialog.DefaultCommandIndex = 1; await messageDialog.ShowAsync(); }
(2)、 什么按钮都没有增加的时候,默认会有一个Close按钮。
private async void DefaultCloseCommandButton_Click2(object sender, RoutedEventArgs e) { var messageDialog = new MessageDialog("哈哈,我是好孩子"); await messageDialog.ShowAsync(); } // 此时弹出的文本框只有内容,没有标题。
(3)、使用命令ID,根据用户选择的命令ID分别做不同的操作。
private async void CompletedCallbackButton_Click(object sender, RoutedEventArgs e) { var messageDialog = new MessageDialog("确定离开该页面吗?", "提示!"); // 增加命令和命令ID messageDialog.Commands.Add(new UICommand("取消", null, 0)); messageDialog.Commands.Add(new UICommand("确认", null, 1)); messageDialog.DefaultCommandIndex = 1; var commandChosen = await messageDialog.ShowAsync(); switch (commandChosen.Id.ToString()) { case "0": //Todo: break; case "1": //ToDo: break; } }
(4)、当按下Esc时,取消命令去作用
private async void CancelCommandButton_Click2(object sender, RoutedEventArgs e) { var messageDialog = new MessageDialog("No internet connection has been found."); //两个命令的CallBack函数是一样的,与上面inline的形式不同。 messageDialog.Commands.Add(new UICommand("Try again", new UICommandInvokedHandler(this.CommandInvokedHandler2))); messageDialog.Commands.Add(new UICommand("Close", new UICommandInvokedHandler(this.CommandInvokedHandler2))); messageDialog.DefaultCommandIndex = 0; // 当按下Esc时,取消命令去作用 messageDialog.CancelCommandIndex = 1; await messageDialog.ShowAsync(); } private void CommandInvokedHandler2(IUICommand command) { //ToDo: }
直接在键盘上按下Esc退出按钮,直接调用退出命令。此处要注意,两个命令调用同一个函数CommandInvokedHandler2。
(5)、当然也可以封装一下
public async static void Show(string str) { var messageDialog = new MessageDialog(str); await messageDialog.ShowAsync(); } //例如自定义一个对话框 MessageDialog msg = new MessageDialog("恭喜您胜利了!" + "\n步数:" + this.txblock2.Text + "\n时间:"); msg.Commands.Add(new UICommand("重玩", (command) => { ClearPic(); BindingPic(random()); this.txblock2.Text = "0"; })); msg.Commands.Add(new UICommand("菜单", (command) => { this.Frame.Navigate(typeof(GroupedItemsPage)); })); msg.DefaultCommandIndex = 1; msg.ShowAsync();
来源: http://www.cnblogs.com/kefira/archive/2013/03/07/windows8.html