布局基础:Canvas,StackPanel,Grid
Grid:分成两行两列
1 <Grid> 2 <Grid.RowDefinitions> 3 <RowDefinition></RowDefinition> 4 <RowDefinition></RowDefinition> 5 </Grid.RowDefinitions> 6 <Grid.ColumnDefinitions> 7 <ColumnDefinitions></ColumnDefinitions> 8 <ColumnDefinitions></ColumnDefinitions> 9 </Grid.ColumnDefinitions> 10 </Grid>
动态生成:
注意://通过代码来为Image赋值,如果图片位于项目中,则需要给出ms-appx:///
为图片赋值路径:image.Source = new BitmapImage(new Uri(fileName));
1 for (int i = 0; i < 10; i++) 2 { 3 RowDefinition row = new RowDefinition(); 4 grid1.RowDefinitions.Add(row); 5 } 6 for (int i = 0; i < 8; i++) 7 { 8 ColumnDefinition column = new ColumnDefinition(); 9 grid1.ColumnDefinitions.Add(column); 10 } 11 Random r = new Random(); 12 for (int i = 0; i < 10; i++) 13 { 14 for (int j = 0; j < 8; j++) 15 { 16 Image image = new Image(); 17 int num = r.Next(1,10); 18 //通过代码来为Image赋值,如果图片位于项目中,则需要给出ms-appx:/// 19 string fileName="ms-appx:///Images/"+num+".png"; 20 //为图片赋路径 21 image.Source = new BitmapImage(new Uri(fileName)); 22 grid1.Children.Add(image); 23 Grid.SetRow(image,i); 24 Grid.SetColumn(image,j); 25 } 26 }
画刷:
1 创建渐变的Button 2 <Button.Background> 3 <LinearGradientBrush> 4 <GradientStop Offset="0" Color="Red"></GradientStop> 5 <GradientStop Offset="0.7" Color="Yellow"></GradientStop> 6 <GradientStop Offset="1" Color="Blue"></GradientStop> 7 </LinearGradientBrush> 8 </Button.Background>
仅用画刷实现模拟歌词的移动:
1 <TextBlock Margin="50,350" FontSize="70" Text="今天天气好晴朗"> 2 <TextBlock.Foreground> 3 <LinearGradientBrush> 4 <GradientStop Color="Yellow" Offset="0"></GradientStop> 5 <GradientStop x:Name="gs1" Color="Yellow" Offset="0"></GradientStop> 6 <GradientStop x:Name="gs2" Color="Blue" Offset="0"></GradientStop> 7 <GradientStop Color="Blue" Offset="1"></GradientStop> 8 </LinearGradientBrush> 9 </TextBlock.Foreground> 10 </TextBlock>
1 后台 2 protected override void OnNavigatedTo(NavigationEventArgs e) 3 { 4 DispatcherTimer timer = new DispatcherTimer(); 5 timer.Interval = TimeSpan.FromMilliseconds(200); 6 timer.Tick+=timer_Tick; 7 timer.Start(); 8 } 9 10 private void timer_Tick(object sender, object e) 11 { 12 gs1.Offset += 0.03; 13 gs2.Offset += 0.03; 14 }
变换:
RotateTransform:旋转Angle
ScaleTransform:变大变小 ScaleY="-1" ScaleX="2"
TranslateTransform:左右平移 X="100"
3D投影:
<Image.Projection>
<PlaneProjection x:Name="pp1" RotationX="30" ></PlaneProjection>
</Image.Projection>
win8中是没有对话框的概念,不同的界面是不同的页,类似于网页,通过Frame.Navigate(typeof(TestPage),obj参数)来在不同页面导航。
NavigationService属性的方法:GoBack()后退;GoForward()前进;CanGoBack()属性判断是否可以后退。
页面导航默认是不启用缓存的,也就是后退以后前一个页面恢复成原始状态,需要在构造函数中执行NavigationCacheMode=NavigationCacheMode.Enable
页面三个和页面导航相关的四个虚方法:
OnNavigatedTo:当页面成为活动页面时调用。e.NavigationMode得知是新来的(New)还是后退回来的(Back)还是前进来的(Forward),一般初始化放到OnNavigatedTo中,注意判断Mode
OnNavigatedFrom():当前页面不是活动页面时调用
OnNavigatingFrom():在页面即将不再是活动页面时调用,实现确认是否退出
页面间跳转:Frame.Navigate(typeof(MainPage),1);
1位所传的参数
启用缓存:NavigationCacheMode.Enable启用页面缓存,当后退到这个页面的时候之前的修改还在,必须写在构造函数里面
在OnNavigatedTo的方法中
e.NavigationMode:可以用来判断是第一次访问还是后退回来的,前进来的。。。
NavigationMode.New:加载数据
设置样式:
直接在xaml中设置:
1 <Page.Resources> 2 <!--<Style TargetType="Button"> 3 <Setter Property="Background" Value="Red"></Setter> 4 <Setter Property="BorderBrush" Value="Blue"></Setter> 5 <Setter Property="BorderThickness" Value="5"></Setter> 6 </Style> 7 <Style TargetType="Button" x:Key="btnStyle"> 8 <Setter Property="Background" Value="Yellow"></Setter> 9 <Setter Property="BorderBrush" Value="Gray"></Setter> 10 <Setter Property="BorderThickness" Value="5"></Setter> 11 </Style>--> 12 13 </Page.Resources>
1
用资源字典:
<Page.Resources> 2 3 <ResourceDictionary Source="NomalDic.xaml"></ResourceDictionary> 4 </Page.Resources> 5 <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 6 <Button Style="{StaticResource nomalBtn}" Content="Button" HorizontalAlignment="Left" Margin="216,252,0,0" VerticalAlignment="Top" Height="82" Width="184"/> 7 <Button Style="{StaticResource nomalBtn}" Content="Button" HorizontalAlignment="Left" Margin="652,245,0,0" VerticalAlignment="Top" Height="160" Width="202"/> 8 <Button Style="{StaticResource nomalBtn}" Content="Button" HorizontalAlignment="Left" Margin="1040,255,0,0" VerticalAlignment="Top" Height="150" Width="122"/> 9 <TextBlock Style="{StaticResource nomalTb}" HorizontalAlignment="Left" Margin="348,52,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="149" Height="107"/> 10 <TextBlock Style="{StaticResource nomalTb}" HorizontalAlignment="Left" Margin="748,92,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="329" Height="109"/> 11 12 </Grid>
资源字典的写法:
1 <ResourceDictionary 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 xmlns:local="using:App4"> 5 <Style TargetType="TextBlock" x:Key="nomalTb"> 6 <Setter Property="Foreground" Value="Red"></Setter> 7 </Style> 8 <Style TargetType="Button" x:Key="nomalBtn"> 9 <Setter Property="Background" Value="Red"></Setter> 10 <Setter Property="BorderBrush" Value="Blue"></Setter> 11 <Setter Property="BorderThickness" Value="5"></Setter> 12 </Style> 13 </ResourceDictionary>
数据绑定:
Silverlight中的数据绑定对被绑定对象有特殊要求,如果只是普通的get、set属性的对象用在数据绑定上有很多问题(无法双向绑定。只有Model值不会变或者Model变了不要求界面跟着变才可以使用普通属性),一般要求类实现INotifyPropertyChanged接口.
绑定中类属性的特殊写法:
1 public class Person : INotifyPropertyChanged 2 { 3 private string _name; 4 public string Name 5 { 6 get 7 { 8 return _name; 9 } 10 set 11 { 12 _name = value; 13 if (PropertyChanged != null) 14 { 15 PropertyChanged(this,new PropertyChangedEventArgs("Name")); 16 } 17 } 18 } 19 private int _age; 20 public int Age 21 { 22 get 23 { 24 return _age; 25 } 26 set 27 { 28 _age = value; 29 if (PropertyChanged != null) 30 { 31 PropertyChanged(this,new PropertyChangedEventArgs("Age")); 32 } 33 } 34 } 35 36 public event PropertyChangedEventHandler PropertyChanged; 37 }
三种绑定模式:
OneTime:一次绑定,绑定创建时使用源数据更新控件。(可以是普通的get、set)。
OneWay(默认值):单向绑定,在绑定创建时使用源数据更新控件,当源数据发生变化的时候也更新控件。(必须实现INotifyPropertyChanged接口或者继承自DependencyObject)。相当于Eval
TwoWay:双向绑定,数据源的变化会更新控件,控件的变化也会更新到数据源。(必须实现INotifyPropertyChanged接口或者继承自DependencyObject)。相当于Bind
例:Text="{Binding Age,Mode=OneTime}"
绑定数据集合:
普通的集合的变化是不会影响UI的,集合需要实现INotifyCollectionChanged接口
如果使用OneWay、TwoWay以达到数据源 发生变化时UI的项随着数据变化,那么数据可以放到 private ObservableCollection<string> list1 = new ObservableCollection<string>()中,因为ObservableCollection中定义了一个集合改变的通知事件。
动画:
资源加载:
1 <Storyboard x:Name="sb1"> 2 <DoubleAnimation Storyboard.TargetName="st1" Storyboard.TargetProperty="ScaleX" From="0" To="3"> </DoubleAnimation> 3 </Storyboard>
1 控件部分: 2 <Image Name="img1" HorizontalAlignment="Left" Height="85" Margin="154,243,0,0" VerticalAlignment="Top" Width="86" Source="Images/China.jpg"> 3 <Image.RenderTransform> 4 <ScaleTransform x:Name="st1" ScaleX="3"></ScaleTransform> 5 </Image.RenderTransform> 6 <Image.Projection> 7 <PlaneProjection x:Name="pp1" RotationY="30"></PlaneProjection> 8 </Image.Projection> 9 </Image>
AppBar
当向上手势或者鼠标右键的时候会显示AppBar(以FreshPaint为例),AppBar分为顶部TopAppBar、底部BottomAppBar两块,建议把主要操作放在底部、顶部有特殊意义再放
Xaml中Page的TopAppBar、BottomAppBar两个属性赋值,AppBar类型,然后Content内容自由绘制。一般绘制横向的圆形图标,一般采用StandrardStyle.xaml中预置的AppBarButtonStyle样式,用到哪个反注释哪个,AutomationProperties.Name设定显示的文本。用法:<Button Style="{StaticResource EditAppBarButtonStyle}" AutomationProperties.Name="编辑"></Button>
高级:IsOpen打开状态(可以实现程序打开时默认AppBar显示);IsSticky是否钉住;Opened、Closed打开关闭事件。
高级容器:
ProgressBar进度条:IsIndeterminate模式
ProcessRing圆形的不确定进度条,IsActive属性表示是否活动
ToggleSwitch开关控件,IsOn是否打开,OffContent、OnContent、Heade关闭、打开、头部的显示内容;Toggled更改事件;
ScrollViewer用于显示大内容,显示尺寸不够则可以通过滚动条控制。
HorizontalScrollBarVisibility、VerticalScrollBarVisibility控制滚动条显示。
.net 4.5异步编程
异步方法不用等任务结束后才返回。 异步编程可以避免界面卡死的问题,但是会导致编写“等待一个异步操作执行完成再执行一段代码”的程序很麻烦。
异步方法返回Task或者IAsyncOperation对象(鼠标悬停会显示“可等待”),一般以Async结尾,异步方法不会等结束才返回。
在.net4.5中引入了async、await关键字,这样方法中这一行代码都将在异步方法执行完成后才执行。注意:一个方法中如果有await,则必须标注为async。
可以直接在await前声明变量,当异步方法执行完成后把执行结果返回设置给变量,一般var自动推断。
WinRT中所有执行时间可能会比较长操作都被设置为异步方法。