mirror of
https://gitcode.com/gh_mirrors/se/Semi.Avalonia
synced 2026-04-21 08:56:35 +08:00
Merge pull request #599 from WCKYWCKF/pr_2
feat: add VerticalSplitView control theme with responsive styles
This commit is contained in:
Zhang Dian
@@ -21,8 +21,7 @@
|
|||||||
Content="IsPaneOpen" />
|
Content="IsPaneOpen" />
|
||||||
<ToggleSwitch
|
<ToggleSwitch
|
||||||
Grid.Row="0" Grid.Column="1"
|
Grid.Row="0" Grid.Column="1"
|
||||||
Name="PaneOpenButton"
|
Name="PaneOpenButton" />
|
||||||
IsChecked="{Binding #SplitView.IsPaneOpen}" />
|
|
||||||
|
|
||||||
<Label
|
<Label
|
||||||
Grid.Row="1" Grid.Column="0"
|
Grid.Row="1" Grid.Column="0"
|
||||||
@@ -30,8 +29,7 @@
|
|||||||
Content="UseLightDismissOverlayMode" />
|
Content="UseLightDismissOverlayMode" />
|
||||||
<ToggleSwitch
|
<ToggleSwitch
|
||||||
Grid.Row="1" Grid.Column="1"
|
Grid.Row="1" Grid.Column="1"
|
||||||
Name="UseLightDismissOverlayModeButton"
|
Name="UseLightDismissOverlayModeButton" />
|
||||||
IsChecked="{Binding #SplitView.UseLightDismissOverlayMode}" />
|
|
||||||
|
|
||||||
<Label
|
<Label
|
||||||
Grid.Row="2" Grid.Column="0"
|
Grid.Row="2" Grid.Column="0"
|
||||||
@@ -39,9 +37,9 @@
|
|||||||
Content="Placement" />
|
Content="Placement" />
|
||||||
<ToggleSwitch
|
<ToggleSwitch
|
||||||
Grid.Row="2" Grid.Column="1"
|
Grid.Row="2" Grid.Column="1"
|
||||||
|
Name="PanePlacementButton"
|
||||||
OffContent="Left"
|
OffContent="Left"
|
||||||
OnContent="Right"
|
OnContent="Right" />
|
||||||
IsChecked="{Binding #SplitView.PanePlacement}" />
|
|
||||||
|
|
||||||
<Label
|
<Label
|
||||||
Grid.Row="3" Grid.Column="0"
|
Grid.Row="3" Grid.Column="0"
|
||||||
@@ -51,8 +49,8 @@
|
|||||||
Grid.Row="3" Grid.Column="1"
|
Grid.Row="3" Grid.Column="1"
|
||||||
Name="DisplayModeSelector"
|
Name="DisplayModeSelector"
|
||||||
HorizontalAlignment="Stretch"
|
HorizontalAlignment="Stretch"
|
||||||
ItemsSource="{Binding DisplayModes}"
|
ItemsSource="{x:Static pages:SplitViewDemoViewModel.DisplayModes}"
|
||||||
SelectedIndex="{Binding #SplitView.DisplayMode}" />
|
SelectedItem="{x:Static SplitViewDisplayMode.CompactInline}" />
|
||||||
|
|
||||||
<Label
|
<Label
|
||||||
Grid.Row="4" Grid.Column="0"
|
Grid.Row="4" Grid.Column="0"
|
||||||
@@ -65,7 +63,7 @@
|
|||||||
Minimum="0"
|
Minimum="0"
|
||||||
TickFrequency="1"
|
TickFrequency="1"
|
||||||
IsSnapToTickEnabled="True"
|
IsSnapToTickEnabled="True"
|
||||||
Value="{Binding #SplitView.CompactPaneLength}" />
|
Value="48" />
|
||||||
|
|
||||||
<Label
|
<Label
|
||||||
Grid.Row="5" Grid.Column="0"
|
Grid.Row="5" Grid.Column="0"
|
||||||
@@ -78,105 +76,209 @@
|
|||||||
Minimum="128"
|
Minimum="128"
|
||||||
TickFrequency="1"
|
TickFrequency="1"
|
||||||
IsSnapToTickEnabled="True"
|
IsSnapToTickEnabled="True"
|
||||||
Value="{Binding #SplitView.OpenPaneLength}" />
|
Value="256" />
|
||||||
</Grid>
|
</Grid>
|
||||||
</Border>
|
</Border>
|
||||||
<Border
|
<TabControl Grid.Column="0">
|
||||||
Grid.Column="0"
|
<TabItem Header="Default">
|
||||||
BorderBrush="{DynamicResource SemiGrey1}"
|
<Border
|
||||||
BorderThickness="1">
|
BorderBrush="{DynamicResource SemiGrey1}"
|
||||||
<SplitView
|
BorderThickness="1">
|
||||||
Name="SplitView"
|
<SplitView
|
||||||
DisplayMode="CompactOverlay"
|
Name="SplitView"
|
||||||
CompactPaneLength="48"
|
IsPaneOpen="{Binding #PaneOpenButton.IsChecked,Mode=TwoWay}"
|
||||||
OpenPaneLength="256">
|
UseLightDismissOverlayMode="{Binding #UseLightDismissOverlayModeButton.IsChecked}"
|
||||||
<SplitView.Background>
|
PanePlacement="{Binding #PanePlacementButton.IsChecked}"
|
||||||
<LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
|
DisplayMode="{Binding #DisplayModeSelector.SelectedItem}"
|
||||||
<GradientStop Color="#6b4c1b" Offset="0" />
|
CompactPaneLength="{Binding #CompactPaneLengthSlider.Value}"
|
||||||
<GradientStop Color="#291e10" Offset="1" />
|
OpenPaneLength="{Binding #OpenPaneLengthSlider.Value}">
|
||||||
</LinearGradientBrush>
|
<SplitView.Background>
|
||||||
</SplitView.Background>
|
<LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
|
||||||
<SplitView.Pane>
|
<GradientStop Color="#6b4c1b" Offset="0" />
|
||||||
<Grid RowDefinitions="Auto,*,Auto">
|
<GradientStop Color="#291e10" Offset="1" />
|
||||||
<TextBlock
|
|
||||||
Grid.Row="0"
|
|
||||||
Name="PaneHeader"
|
|
||||||
Margin="8,12"
|
|
||||||
FontWeight="Bold"
|
|
||||||
Text="Playlist" />
|
|
||||||
<ListBox
|
|
||||||
Grid.Row="1"
|
|
||||||
ItemsSource="{Binding Songs}" />
|
|
||||||
<ToggleSwitch
|
|
||||||
Grid.Row="2"
|
|
||||||
Theme="{DynamicResource IconBorderlessToggleSwitch}"
|
|
||||||
Content="{StaticResource SemiIconSidebar}"
|
|
||||||
HorizontalAlignment="Left"
|
|
||||||
IsChecked="{Binding #SplitView.IsPaneOpen}">
|
|
||||||
</ToggleSwitch>
|
|
||||||
</Grid>
|
|
||||||
</SplitView.Pane>
|
|
||||||
|
|
||||||
<Panel>
|
|
||||||
<Panel.Styles>
|
|
||||||
<Style Selector="Image#AlbumCover">
|
|
||||||
<Style.Animations>
|
|
||||||
<Animation IterationCount="Infinite" Duration="0:0:40">
|
|
||||||
<KeyFrame Cue="0%">
|
|
||||||
<Setter Property="RotateTransform.Angle" Value="0" />
|
|
||||||
</KeyFrame>
|
|
||||||
<KeyFrame Cue="100%">
|
|
||||||
<Setter Property="RotateTransform.Angle" Value="360" />
|
|
||||||
</KeyFrame>
|
|
||||||
</Animation>
|
|
||||||
</Style.Animations>
|
|
||||||
</Style>
|
|
||||||
</Panel.Styles>
|
|
||||||
<Image
|
|
||||||
Source="/Assets/WORLD.png"
|
|
||||||
Name="AlbumCover"
|
|
||||||
Width="200"
|
|
||||||
Height="200" />
|
|
||||||
<Arc
|
|
||||||
Width="290"
|
|
||||||
Height="290"
|
|
||||||
StartAngle="0"
|
|
||||||
SweepAngle="360"
|
|
||||||
StrokeJoin="Round"
|
|
||||||
StrokeLineCap="Round"
|
|
||||||
StrokeThickness="45">
|
|
||||||
<Arc.Stroke>
|
|
||||||
<LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
|
|
||||||
<GradientStop Color="#010101" Offset="0" />
|
|
||||||
<GradientStop Color="#363636" Offset="0.5" />
|
|
||||||
<GradientStop Color="#010101" Offset="1" />
|
|
||||||
</LinearGradientBrush>
|
</LinearGradientBrush>
|
||||||
</Arc.Stroke>
|
</SplitView.Background>
|
||||||
</Arc>
|
<SplitView.Pane>
|
||||||
<Arc
|
<Grid RowDefinitions="Auto,*,Auto">
|
||||||
Width="294"
|
<TextBlock
|
||||||
Height="294"
|
Grid.Row="0"
|
||||||
StartAngle="0"
|
Name="PaneHeader"
|
||||||
SweepAngle="360"
|
Margin="8,12"
|
||||||
StrokeJoin="Round"
|
FontWeight="Bold"
|
||||||
StrokeLineCap="Round"
|
Text="Playlist" />
|
||||||
StrokeThickness="4"
|
<ListBox
|
||||||
Stroke="Black" />
|
Grid.Row="1"
|
||||||
<Arc
|
ItemsSource="{Binding Songs}" />
|
||||||
Width="310"
|
<ToggleSwitch
|
||||||
Height="310"
|
Grid.Row="2"
|
||||||
StartAngle="0"
|
Theme="{DynamicResource IconBorderlessToggleSwitch}"
|
||||||
SweepAngle="360"
|
Content="{StaticResource SemiIconSidebar}"
|
||||||
StrokeJoin="Round"
|
HorizontalAlignment="Left"
|
||||||
StrokeLineCap="Round"
|
IsChecked="{Binding #SplitView.IsPaneOpen}">
|
||||||
StrokeThickness="10"
|
</ToggleSwitch>
|
||||||
Stroke="#C6CACD"
|
</Grid>
|
||||||
Opacity="0.1" />
|
</SplitView.Pane>
|
||||||
</Panel>
|
|
||||||
|
|
||||||
</SplitView>
|
<Panel>
|
||||||
</Border>
|
<Panel.Styles>
|
||||||
|
<Style Selector="Image#AlbumCover">
|
||||||
|
<Style.Animations>
|
||||||
|
<Animation IterationCount="Infinite" Duration="0:0:40">
|
||||||
|
<KeyFrame Cue="0%">
|
||||||
|
<Setter Property="RotateTransform.Angle" Value="0" />
|
||||||
|
</KeyFrame>
|
||||||
|
<KeyFrame Cue="100%">
|
||||||
|
<Setter Property="RotateTransform.Angle" Value="360" />
|
||||||
|
</KeyFrame>
|
||||||
|
</Animation>
|
||||||
|
</Style.Animations>
|
||||||
|
</Style>
|
||||||
|
</Panel.Styles>
|
||||||
|
<Image
|
||||||
|
Source="/Assets/WORLD.png"
|
||||||
|
Name="AlbumCover"
|
||||||
|
Width="200"
|
||||||
|
Height="200" />
|
||||||
|
<Arc
|
||||||
|
Width="290"
|
||||||
|
Height="290"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="45">
|
||||||
|
<Arc.Stroke>
|
||||||
|
<LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
|
||||||
|
<GradientStop Color="#010101" Offset="0" />
|
||||||
|
<GradientStop Color="#363636" Offset="0.5" />
|
||||||
|
<GradientStop Color="#010101" Offset="1" />
|
||||||
|
</LinearGradientBrush>
|
||||||
|
</Arc.Stroke>
|
||||||
|
</Arc>
|
||||||
|
<Arc
|
||||||
|
Width="294"
|
||||||
|
Height="294"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="4"
|
||||||
|
Stroke="Black" />
|
||||||
|
<Arc
|
||||||
|
Width="310"
|
||||||
|
Height="310"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="10"
|
||||||
|
Stroke="#C6CACD"
|
||||||
|
Opacity="0.1" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
</SplitView>
|
||||||
|
</Border>
|
||||||
|
</TabItem>
|
||||||
|
<TabItem Header="VerticalSplitView">
|
||||||
|
<Border
|
||||||
|
BorderBrush="{DynamicResource SemiGrey1}"
|
||||||
|
BorderThickness="1">
|
||||||
|
<SplitView
|
||||||
|
Name="SplitView2"
|
||||||
|
Theme="{DynamicResource VerticalSplitView}"
|
||||||
|
IsPaneOpen="{Binding #PaneOpenButton.IsChecked,Mode=TwoWay}"
|
||||||
|
UseLightDismissOverlayMode="{Binding #UseLightDismissOverlayModeButton.IsChecked}"
|
||||||
|
PanePlacement="{Binding #PanePlacementButton.IsChecked}"
|
||||||
|
DisplayMode="{Binding #DisplayModeSelector.SelectedItem}"
|
||||||
|
CompactPaneLength="{Binding #CompactPaneLengthSlider.Value}"
|
||||||
|
OpenPaneLength="{Binding #OpenPaneLengthSlider.Value}">
|
||||||
|
<SplitView.Background>
|
||||||
|
<LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
|
||||||
|
<GradientStop Color="#6b4c1b" Offset="0" />
|
||||||
|
<GradientStop Color="#291e10" Offset="1" />
|
||||||
|
</LinearGradientBrush>
|
||||||
|
</SplitView.Background>
|
||||||
|
<SplitView.Pane>
|
||||||
|
<Grid RowDefinitions="Auto,Auto,*">
|
||||||
|
<ToggleSwitch
|
||||||
|
Grid.Row="0"
|
||||||
|
Theme="{DynamicResource IconBorderlessToggleSwitch}"
|
||||||
|
Content="{StaticResource SemiIconSidebar}"
|
||||||
|
HorizontalAlignment="Left"
|
||||||
|
IsChecked="{Binding #SplitView2.IsPaneOpen}">
|
||||||
|
</ToggleSwitch>
|
||||||
|
<TextBlock
|
||||||
|
Grid.Row="1"
|
||||||
|
Margin="8,12"
|
||||||
|
FontWeight="Bold"
|
||||||
|
Text="Playlist" />
|
||||||
|
<ListBox
|
||||||
|
Grid.Row="2"
|
||||||
|
ItemsSource="{Binding Songs}" />
|
||||||
|
</Grid>
|
||||||
|
</SplitView.Pane>
|
||||||
|
|
||||||
|
<Panel>
|
||||||
|
<Panel.Styles>
|
||||||
|
<Style Selector="Image#AlbumCover2">
|
||||||
|
<Style.Animations>
|
||||||
|
<Animation IterationCount="Infinite" Duration="0:0:40">
|
||||||
|
<KeyFrame Cue="0%">
|
||||||
|
<Setter Property="RotateTransform.Angle" Value="0" />
|
||||||
|
</KeyFrame>
|
||||||
|
<KeyFrame Cue="100%">
|
||||||
|
<Setter Property="RotateTransform.Angle" Value="360" />
|
||||||
|
</KeyFrame>
|
||||||
|
</Animation>
|
||||||
|
</Style.Animations>
|
||||||
|
</Style>
|
||||||
|
</Panel.Styles>
|
||||||
|
<Image
|
||||||
|
Source="/Assets/WORLD.png"
|
||||||
|
Name="AlbumCover2"
|
||||||
|
Width="200"
|
||||||
|
Height="200" />
|
||||||
|
<Arc
|
||||||
|
Width="290"
|
||||||
|
Height="290"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="45">
|
||||||
|
<Arc.Stroke>
|
||||||
|
<LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
|
||||||
|
<GradientStop Color="#010101" Offset="0" />
|
||||||
|
<GradientStop Color="#363636" Offset="0.5" />
|
||||||
|
<GradientStop Color="#010101" Offset="1" />
|
||||||
|
</LinearGradientBrush>
|
||||||
|
</Arc.Stroke>
|
||||||
|
</Arc>
|
||||||
|
<Arc
|
||||||
|
Width="294"
|
||||||
|
Height="294"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="4"
|
||||||
|
Stroke="Black" />
|
||||||
|
<Arc
|
||||||
|
Width="310"
|
||||||
|
Height="310"
|
||||||
|
StartAngle="0"
|
||||||
|
SweepAngle="360"
|
||||||
|
StrokeJoin="Round"
|
||||||
|
StrokeLineCap="Round"
|
||||||
|
StrokeThickness="10"
|
||||||
|
Stroke="#C6CACD"
|
||||||
|
Opacity="0.1" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
</SplitView>
|
||||||
|
</Border>
|
||||||
|
</TabItem>
|
||||||
|
</TabControl>
|
||||||
</Grid>
|
</Grid>
|
||||||
</Border>
|
</Border>
|
||||||
</UserControl>
|
</UserControl>
|
||||||
@@ -34,7 +34,7 @@ public class SplitViewDemoViewModel : ObservableObject
|
|||||||
"世界所有的烂漫",
|
"世界所有的烂漫",
|
||||||
];
|
];
|
||||||
|
|
||||||
public ObservableCollection<SplitViewDisplayMode> DisplayModes { get; set; } =
|
public static ObservableCollection<SplitViewDisplayMode> DisplayModes { get; set; } =
|
||||||
[
|
[
|
||||||
SplitViewDisplayMode.Inline,
|
SplitViewDisplayMode.Inline,
|
||||||
SplitViewDisplayMode.CompactInline,
|
SplitViewDisplayMode.CompactInline,
|
||||||
|
|||||||
@@ -233,6 +233,262 @@
|
|||||||
</Style>
|
</Style>
|
||||||
</Style>
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:lightDismiss /template/ Rectangle#LightDismissLayer">
|
||||||
|
<Setter Property="Fill" Value="{DynamicResource SplitViewMaskBrush}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^:overlay:open /template/ Rectangle#LightDismissLayer">
|
||||||
|
<Setter Property="IsVisible" Value="True" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^:compactoverlay:open /template/ Rectangle#LightDismissLayer">
|
||||||
|
<Setter Property="IsVisible" Value="True" />
|
||||||
|
</Style>
|
||||||
|
</ControlTheme>
|
||||||
|
<ControlTheme x:Key="VerticalSplitView" TargetType="SplitView">
|
||||||
|
<Setter Property="OpenPaneLength" Value="{DynamicResource SplitViewOpenPaneThemeLength}" />
|
||||||
|
<Setter Property="CompactPaneLength" Value="{DynamicResource SplitViewCompactPaneThemeLength}" />
|
||||||
|
<Setter Property="PaneBackground" Value="{DynamicResource SplitViewPaneBackground}" />
|
||||||
|
|
||||||
|
<Style Selector="^:left">
|
||||||
|
<Setter Property="Template">
|
||||||
|
<ControlTemplate TargetType="SplitView">
|
||||||
|
<Grid Name="Container" Background="{TemplateBinding Background}">
|
||||||
|
<Grid.RowDefinitions>
|
||||||
|
<!-- why is this throwing a binding error? -->
|
||||||
|
<RowDefinition
|
||||||
|
Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}" />
|
||||||
|
<RowDefinition Height="*" />
|
||||||
|
</Grid.RowDefinitions>
|
||||||
|
|
||||||
|
<Panel
|
||||||
|
Name="PART_PaneRoot"
|
||||||
|
VerticalAlignment="Top"
|
||||||
|
Background="{TemplateBinding PaneBackground}"
|
||||||
|
ClipToBounds="True"
|
||||||
|
ZIndex="100">
|
||||||
|
<ContentPresenter
|
||||||
|
Name="PART_PanePresenter"
|
||||||
|
Content="{TemplateBinding Pane}"
|
||||||
|
ContentTemplate="{TemplateBinding PaneTemplate}" />
|
||||||
|
<Rectangle
|
||||||
|
Name="HCPaneBorder"
|
||||||
|
Height="1"
|
||||||
|
VerticalAlignment="Bottom"
|
||||||
|
Fill="{DynamicResource SplitViewSeparatorBackground}" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
<Panel Name="ContentRoot">
|
||||||
|
<ContentPresenter
|
||||||
|
Name="PART_ContentPresenter"
|
||||||
|
Content="{TemplateBinding Content}"
|
||||||
|
ContentTemplate="{TemplateBinding ContentTemplate}" />
|
||||||
|
<Rectangle
|
||||||
|
Name="LightDismissLayer"
|
||||||
|
Fill="Transparent"
|
||||||
|
IsVisible="False" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
</Grid>
|
||||||
|
</ControlTemplate>
|
||||||
|
</Setter>
|
||||||
|
|
||||||
|
<Style Selector="^:overlay">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="2" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:compactinline">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:compactoverlay">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<!-- RowSpan should be 2 -->
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:inline">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:right">
|
||||||
|
<Setter Property="Template">
|
||||||
|
<ControlTemplate>
|
||||||
|
<Grid Name="Container" Background="{TemplateBinding Background}">
|
||||||
|
<Grid.RowDefinitions>
|
||||||
|
<RowDefinition Height="*" />
|
||||||
|
<RowDefinition
|
||||||
|
Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PaneColumnGridLength}" />
|
||||||
|
</Grid.RowDefinitions>
|
||||||
|
|
||||||
|
<Panel
|
||||||
|
Name="PART_PaneRoot"
|
||||||
|
VerticalAlignment="Bottom"
|
||||||
|
Background="{TemplateBinding PaneBackground}"
|
||||||
|
ClipToBounds="True"
|
||||||
|
ZIndex="100">
|
||||||
|
<ContentPresenter
|
||||||
|
Name="PART_PanePresenter"
|
||||||
|
Content="{TemplateBinding Pane}"
|
||||||
|
ContentTemplate="{TemplateBinding PaneTemplate}" />
|
||||||
|
<Rectangle
|
||||||
|
Name="HCPaneBorder"
|
||||||
|
Height="1"
|
||||||
|
VerticalAlignment="Top"
|
||||||
|
Fill="{DynamicResource SplitViewSeparatorBackground}" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
<Panel Name="ContentRoot">
|
||||||
|
<ContentPresenter
|
||||||
|
Name="PART_ContentPresenter"
|
||||||
|
Content="{TemplateBinding Content}"
|
||||||
|
ContentTemplate="{TemplateBinding ContentTemplate}" />
|
||||||
|
<Rectangle Name="LightDismissLayer" IsVisible="False" />
|
||||||
|
</Panel>
|
||||||
|
|
||||||
|
</Grid>
|
||||||
|
</ControlTemplate>
|
||||||
|
</Setter>
|
||||||
|
|
||||||
|
<Style Selector="^:overlay">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="2" />
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="2" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:compactinline">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:compactoverlay">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Grid.RowSpan" Value="2" />
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:inline">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
<Setter Property="Grid.Row" Value="1" />
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Panel#ContentRoot">
|
||||||
|
<Setter Property="Grid.Row" Value="0" />
|
||||||
|
<Setter Property="Grid.RowSpan" Value="1" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:open">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Transitions">
|
||||||
|
<Transitions>
|
||||||
|
<DoubleTransition
|
||||||
|
Easing="{StaticResource SplitViewPaneAnimationEasing}"
|
||||||
|
Property="Height"
|
||||||
|
Duration="{StaticResource SplitViewPaneAnimationOpenDuration}" />
|
||||||
|
</Transitions>
|
||||||
|
</Setter>
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=OpenPaneLength}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Rectangle#LightDismissLayer">
|
||||||
|
<Setter Property="Transitions">
|
||||||
|
<Transitions>
|
||||||
|
<DoubleTransition
|
||||||
|
Easing="{StaticResource SplitViewPaneAnimationEasing}"
|
||||||
|
Property="Opacity"
|
||||||
|
Duration="{StaticResource SplitViewPaneAnimationOpenDuration}" />
|
||||||
|
</Transitions>
|
||||||
|
</Setter>
|
||||||
|
<Setter Property="Opacity" Value="1.0" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
|
<Style Selector="^:closed">
|
||||||
|
<Style Selector="^ /template/ Panel#PART_PaneRoot">
|
||||||
|
<Setter Property="Transitions">
|
||||||
|
<Transitions>
|
||||||
|
<DoubleTransition
|
||||||
|
Easing="{StaticResource SplitViewPaneAnimationEasing}"
|
||||||
|
Property="Height"
|
||||||
|
Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" />
|
||||||
|
</Transitions>
|
||||||
|
</Setter>
|
||||||
|
<Setter Property="Height"
|
||||||
|
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.ClosedPaneWidth}" />
|
||||||
|
</Style>
|
||||||
|
<Style Selector="^ /template/ Rectangle#LightDismissLayer">
|
||||||
|
<Setter Property="Transitions">
|
||||||
|
<Transitions>
|
||||||
|
<DoubleTransition
|
||||||
|
Easing="{StaticResource SplitViewPaneAnimationEasing}"
|
||||||
|
Property="Opacity"
|
||||||
|
Duration="{StaticResource SplitViewPaneAnimationCloseDuration}" />
|
||||||
|
</Transitions>
|
||||||
|
</Setter>
|
||||||
|
<Setter Property="Opacity" Value="0.0" />
|
||||||
|
</Style>
|
||||||
|
</Style>
|
||||||
|
|
||||||
<Style Selector="^:lightDismiss /template/ Rectangle#LightDismissLayer">
|
<Style Selector="^:lightDismiss /template/ Rectangle#LightDismissLayer">
|
||||||
<Setter Property="Fill" Value="{DynamicResource SplitViewMaskBrush}" />
|
<Setter Property="Fill" Value="{DynamicResource SplitViewMaskBrush}" />
|
||||||
</Style>
|
</Style>
|
||||||
|
|||||||
Reference in New Issue
Block a user
