我正在尝试向UWP的SplitView控件(也称为“汉堡菜单”)添加滑动手势，类似于Pivot控件的向左/向右滑动。如何设置手势以更改其显示模式？
在iOS 8及更高版本中，我可以使用UISplitViewController并设置presentsWithGesture属性来执行此操作，但WinRT中没有类似的事情。
现在，在阅读此博客:http://blogs.msdn.com/b/cdndevs/archive/2015/07/10/uwp-new-controls-part-2-splitview.aspx之后，我意识到SplitView控件中有DisplayMode属性，我应该使用VisualStateManager更改其状态，但是如何使用vsm来平移左 Pane 以及将其显示？我不知道这可以通过vsm实现。
任何帮助/提示将不胜感激。
最佳答案
有趣的问题! :)
我最近创建了一个SwipeableSplitView，它扩展了SplitView控件，以在DisplayMode设置为Overlay时允许从左边缘手势滑动(因为我看不到在其他模式下使用它的要点，但是随时可以扩展它) 。
我要做的就是在控件的样式内，在PaneRoot层之上创建另一个层，并处理那里的所有手势。
<Grid x:Name="PaneRoot" ManipulationMode="TranslateX" Grid.ColumnSpan="2" HorizontalAlignment="Left" Background="{TemplateBinding PaneBackground}" Width="{Binding TemplateSettings.OpenPaneLength, RelativeSource={RelativeSource Mode=TemplatedParent}}">
<Grid.Clip>
<RectangleGeometry x:Name="PaneClipRectangle">
<RectangleGeometry.Transform>
<CompositeTransform x:Name="PaneClipRectangleTransform" />
</RectangleGeometry.Transform>
</RectangleGeometry>
</Grid.Clip>
<Grid.RenderTransform>
<CompositeTransform x:Name="PaneTransform" TranslateX="{Binding RenderTransform.TranslateX, ElementName=PanArea}" />
</Grid.RenderTransform>
<Border Child="{TemplateBinding Pane}" />
<Rectangle x:Name="HCPaneBorder" Fill="{ThemeResource SystemControlForegroundTransparentBrush}" HorizontalAlignment="Right" Visibility="Collapsed" Width="1" x:DeferLoadStrategy="Lazy" />
</Grid>
<!--a new layer here to handle all the gestures -->
<Grid x:Name="OverlayRoot" Grid.ColumnSpan="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding TemplateSettings.OpenPaneGridLength, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<!--the actual element for panning, manipulations happen here-->
<Rectangle x:Name="PanArea" Fill="Transparent" ManipulationMode="TranslateX" Width="{Binding PanAreaThreshold, RelativeSource={RelativeSource Mode=TemplatedParent}}" Grid.Column="1">
<Rectangle.RenderTransform>
<CompositeTransform TranslateX="{Binding PanAreaInitialTranslateX, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
</Rectangle.RenderTransform>
</Rectangle>
<!--this is used to dismiss this swipeable pane-->
<Rectangle x:Name="DismissLayer" Fill="Transparent" Grid.Column="2" />
</Grid>
在更新新层的转换对象的
TranslateX时，我也在更新PaneRoot，以使其位置保持同步。void OnManipulationStarted(object sender, ManipulationStartedRoutedEventArgs e)
{
_panAreaTransform = PanArea.RenderTransform as CompositeTransform;
_paneRootTransform = PaneRoot.RenderTransform as CompositeTransform;
if (_panAreaTransform == null || _paneRootTransform == null)
{
throw new ArgumentException("Make sure you have copied the default style to Generic.xaml!!");
}
}
void OnManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
var x = _panAreaTransform.TranslateX + e.Delta.Translation.X;
// keep the pan within the bountry
if (x < PanAreaInitialTranslateX || x > 0) return;
// while we are panning the PanArea on X axis, let's sync the PaneRoot's position X too
_paneRootTransform.TranslateX = _panAreaTransform.TranslateX = x;
}
void OnManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
var x = e.Velocities.Linear.X;
// ignore a little bit velocity (+/-0.1)
if (x <= -0.1)
{
CloseSwipeablePane();
}
else if (x > -0.1 && x < 0.1)
{
if (Math.Abs(_panAreaTransform.TranslateX) > Math.Abs(PanAreaInitialTranslateX) / 2)
{
CloseSwipeablePane();
}
else
{
OpenSwipeablePane();
}
}
else
{
OpenSwipeablePane();
}
}
请记住，因为
IsPaneOpen属性不是虚拟的，所以我必须创建另一个IsSwipeablePaneOpen来包装前者。因此，每当您想使用IsPaneOpen属性时，请改为使用IsSwipeablePaneOpen。这就是我在GitHub中创建的演示应用程序中的工作方式。您可以找到完整的源代码here。
积分
来自杰里·尼克松(Jerry Nixon)。
关于c# - 添加滑动手势以打开SplitView Pane ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32108362/