using System; using System.Collections.Generic; using System.Diagnostics; using System.IO; using System.Linq; using System.Runtime.InteropServices.WindowsRuntime; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation; namespace SwipeableSplitView { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); } // Debug 数据输出,左侧面板 TranslateX 的变化 private void MySplitView_Loaded(object sender, RoutedEventArgs e) { #if DEBUG Grid grid = Utility.FindVisualChild<Grid>(MySplitView); Binding bind = new Binding(); bind.Path = new PropertyPath("TranslateX"); bind.Source = (grid.FindName("PaneRoot") as Grid).RenderTransform as CompositeTransform; // 显示到 TextBlock 上 txtDebug.SetBinding(TextBlock.TextProperty, bind); txtDebug.RegisterPropertyChangedCallback(TextBlock.TextProperty, (dependencyObject, dependencyProperty) => { // 注册 TextBlock.TextProperty 属性回调事件，显示到输出窗口 Debug.WriteLine("txtDebug.Text ： " + txtDebug.Text); }); #endif } #region 从屏幕左侧边缘滑动屏幕时，打开 SplitView 菜单 // SplitView 控件模板中，Pane部分的 Grid Grid PaneRoot; // 引用 SplitView 控件中， 保存从 Pane “关闭” 到“打开”的 VisualTransition // 也就是 <VisualTransition From="Closed" To="OpenOverlayLeft"> 这个 VisualTransition from_ClosedToOpenOverlayLeft_Transition; private void Border_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e) { e.Handled = true; // 仅当 SplitView 处于 Overlay 模式时（窗口宽度最小时） if (MySplitView.DisplayMode == SplitViewDisplayMode.Overlay) { if (PaneRoot == null) { // 找到 SplitView 控件中，模板的父容器 Grid grid = Utility.FindVisualChild<Grid>(MySplitView); PaneRoot = grid.FindName("PaneRoot") as Grid; if (from_ClosedToOpenOverlayLeft_Transition == null) { // 获取 SplitView 模板中“视觉状态集合” IList<VisualStateGroup> stateGroup = VisualStateManager.GetVisualStateGroups(grid); // 获取 VisualTransition 对象的集合。 IList<VisualTransition> transitions = stateGroup[0].Transitions; // 找到 SplitView.IsPaneOpen 设置为 true 时，播放的 transition from_ClosedToOpenOverlayLeft_Transition = transitions?.Where(train => train.From == "Closed" && train.To == "OpenOverlayLeft").First(); // 遍历所有 transitions，打印到输出窗口 foreach (var tran in transitions) { Debug.WriteLine("From : " + tran.From + " To : " + tran.To); } } } // 默认为 Collapsed，所以先显示它 PaneRoot.Visibility = Visibility.Visible; // 当在 Border 上向右滑动，，并且滑动的总距离需要小于 Panel 的默认宽度。否则会脱离左侧窗口，继续向右拖动 if (e.Cumulative.Translation.X >= 0 && e.Cumulative.Translation.X < MySplitView.OpenPaneLength) { CompositeTransform ct = PaneRoot.RenderTransform as CompositeTransform; ct.TranslateX = (e.Cumulative.Translation.X - MySplitView.OpenPaneLength); } } } private void Border_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e) { e.Handled = true; // 仅当 SplitView 处于 Overlay 模式时（窗口宽度最小时） if (MySplitView.DisplayMode == SplitViewDisplayMode.Overlay && PaneRoot != null) { // 因为当 IsPaneOpen 为 true 时，会通过 VisualStateManager 把 PaneRoot.Visibility 设置为 // Visibility.Visible，所以这里把它改为 Visibility.Collapsed，以回到初始状态 PaneRoot.Visibility = Visibility.Collapsed; MySplitView.IsPaneOpen = true; // 因为上面设置 IsPaneOpen = true 会再次播放向右滑动的动画，所以这里使用 SkipToFill() // 方法，直接跳到动画结束状态 from_ClosedToOpenOverlayLeft_Transition?.Storyboard?.SkipToFill(); // 恢复初始状态 CompositeTransform ct = PaneRoot.RenderTransform as CompositeTransform; ct.TranslateX = 0; } } #endregion } }