UWP

布局标签

• Grid: 大布局(整体局部设计)的时候使用
  • 属性标签<Grid.RowDefine/>和<Grid.ColumnDefine/>用来Grid布局的行与列
  • 如果属性它的属性标签中有Height="*"表示占用全部剩余的高度(此特性非常实用), 如果是Height="1*"和Height="2*"表示按照1:2的比例分配空间
• StackPanel: 小布局的时候使用(在一个Button中左边显示icon, 右边显示文字)
• RelativePanel: 在RelativePanel中, 子控件可以设置相对于该RelativePanel的位置(实用)
• 凡是布局标签, 标签内部可以写多个字标签, 其余标签内部只能一个, 如果要写多个, 需要添加Grid或者StackPanel
• Grid与StackPanel的区别, Grid的可以覆盖(控件在Z轴堆叠), 但是 StackPanel不行, 它只能再找规定的水平或者垂直的方向堆起来

   

控件标签

• Button
• TextBlock
• TextBox: 文字输入框
• AutoSuggestionBox: 带有搜索功能的 TextBox
• SplitView
  • SplitPane: 左侧部分
  • SplitContent: 右侧部分
  • 设置相应的属性可以实现弹出和收回的动画效果
• Image: 通过Source属性指定, 路径为"ms-appx:///Assets/…", 要将图片文件拖到项目中的Assets目录中
• ProcessBar
• ProcessRing: 就是微软最变态的进度显示
• Slider
• DatePick
• Flyout: 只有支持Flyout属性标签的才可以使用(如Button)
• Frame: 显示Page对象, 在UWP中, Application包含着Window, Window包含着Frame, Frame中包含着我们项目默认编辑的MainPage, 如果要跳转到其他Page, 需要在要显示的地方使用Frame标签表明, 在C#代码中引用到该Frame并调用其Navigate(typeof(TargetPage))API实现导航
  • Frame还有GoForward(), GoBackward(), CanGoForward, CanGoBack等导航API

   

标签的引用

• 为标签设置Name属性, 在C#代码中可以通过名字直接引用

   

API

• ObservableCollection: UWP可以检测里面的数据的变化, 将数据显示到界面上, 就是MVVM中的动态数据绑定

   

用户控件

• 在VS中创建UserControl, 以后可以重用

   

权限

• 要在UWP中获取相应的权限, 需要在项目的Package.appxmanifest文件中修改配置, VS可以提供GUI的配置

   

UWP中实现MVVM

• 因为UWP是一个xaml文件对应一个文件, 为了解耦, 需要引入MVVM
  • xaml为View
  • 要在UI上显示的数据是ViewModel
  • 与数据库进行交互的是Model
• 因为C#没有原生支持数据动态绑定和命令的单项绑定, 需要通过C#提供的API实现
  • 创建一个NotificationObject实现INotifyPropertyChanged接口, 该类可以监听到数据的变化
    • 创建一个新的方法RaisePropertyChanged(string propertyName), 在方法体中
      • if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propertyName)) }
      • PropertyChanged是实现INotifyPropertyChanged需要的, 当UI中的x:Bind监听到数据变化的时候它就不为null, 调用该事件修改UI上要显示的数据(数据是对象中propertyName的值)
  • 创建一个DelegateCommand实现ICommand接口, 该类可以监听是否可以执行某个动作
    • 要实现CanExecute(object parameter)[用来判断是否可以执行], Execute(object parameter)[逻辑]
    • 为了避免冗余, 添加Action<object> _execute属性和Func<object, bool> _canExecute属性, 并添加在构造方法中, 让用户可以通过传递委托的形式进行何时执行以及执行的内容, 在CanExecute方法中使用_execute判断是否执行, 返回true就是可以执行, 返回false就是不可以执行。在Execute中执行_execute方法
    • 这样就只需要一个DelegateCommand, 通过传递不同的_execute和_canExecute实现逻辑了
  • DelegateCommand和NotificationObject都写在ViewModels中, 因为它们是与View进行交互的
• 在标签中使用{x:Bind MainPageViewModel.Person.Name,Mode=TwoWay}进行双向绑定, 使用{Command: MainPageViewModel.AddCommand}实现命令(事件)