src/Files.App.Controls/Sidebar/SidebarView.xaml - main - githubmirror/Files

src/Files.App.Controls/Sidebar/SidebarView.xaml
373 строки16 KB
yair100
Code Quality: Use Surface stroke brush for sidebar pane border
18 июн 2026, 00:43
18 июн 2026, 00:430ef297e
<!--  Copyright (c) Files Community. Licensed under the MIT License.  -->
<UserControl
	x:Class="Files.App.Controls.SidebarView"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	HorizontalAlignment="Stretch"
	Loaded="SidebarView_Loaded"
	TabFocusNavigation="Local"
	mc:Ignorable="d">

	<Grid>
		<Grid.ColumnDefinitions>
			<ColumnDefinition
				x:Name="PaneColumnDefinition"
				Width="240"
				MaxWidth="480" />
			<ColumnDefinition Width="Auto" />
			<ColumnDefinition Width="*" />
		</Grid.ColumnDefinitions>

		<!--  Background For Both Pane And Content  -->
		<Border
			x:Name="PaneBackground"
			Grid.Row="1"
			Grid.ColumnSpan="3"
			Background="{x:Bind PaneBackgroundBrush, Mode=OneWay}" />

		<!--  Pane Dismiss Layer  -->
		<Grid
			x:Name="PaneLightDismissLayer"
			Grid.Row="1"
			Grid.Column="2"
			Grid.ColumnSpan="3"
			HorizontalAlignment="Stretch"
			VerticalAlignment="Stretch"
			Background="Transparent"
			Canvas.ZIndex="10"
			PointerPressed="PaneLightDismissLayer_PointerPressed"
			Tapped="PaneLightDismissLayer_Tapped"
			Visibility="Collapsed" />

		<!--  Pane  -->
		<Grid
			x:Name="PaneColumnGrid"
			Grid.Row="1"
			HorizontalAlignment="Stretch"
			VerticalAlignment="Stretch"
			Canvas.ZIndex="10"
			XYFocusKeyboardNavigation="Enabled">
			<Grid.RowDefinitions>
				<RowDefinition Height="Auto" />
				<RowDefinition Height="*" />
				<RowDefinition Height="Auto" />
			</Grid.RowDefinitions>
			<Grid.RenderTransform>
				<CompositeTransform x:Name="PaneColumnGridTransform" />
			</Grid.RenderTransform>

			<!--  Content  -->
			<ContentPresenter
				Grid.RowSpan="3"
				HorizontalAlignment="Stretch"
				VerticalAlignment="Stretch"
				HorizontalContentAlignment="Stretch"
				VerticalContentAlignment="Stretch"
				Content="{x:Bind SidebarContent, Mode=OneWay}" />

			<!--  Header  -->
			<ContentPresenter
				Grid.Row="0"
				HorizontalAlignment="Stretch"
				VerticalAlignment="Stretch"
				HorizontalContentAlignment="Stretch"
				VerticalContentAlignment="Stretch"
				Content="{x:Bind Header, Mode=OneWay}" />

			<!--  Menu Items  -->
			<ItemsRepeaterScrollHost
				Grid.Row="1"
				HorizontalAlignment="Stretch"
				VerticalAlignment="Stretch">
				<ScrollViewer
					x:Name="MenuItemHostScrollViewer"
					Padding="0,8,0,0"
					ContextRequested="MenuItemHostScrollViewer_ContextRequested"
					HorizontalScrollBarVisibility="Visible"
					HorizontalScrollMode="Enabled"
					VerticalScrollBarVisibility="Auto"
					XYFocusKeyboardNavigation="Enabled">
					<ItemsRepeater
						x:Name="MenuItemsHost"
						Margin="4,0,4,16"
						AutomationProperties.AccessibilityView="Content"
						AutomationProperties.Name="Sidebar pane"
						ElementPrepared="MenuItemsHost_ElementPrepared"
						IsTabStop="True"
						ItemTemplate="{StaticResource DefaultSidebarItemTemplate}"
						ItemsSource="{x:Bind MenuItemsSource, Mode=OneWay}"
						XYFocusKeyboardNavigation="Enabled" />
				</ScrollViewer>
			</ItemsRepeaterScrollHost>

			<!--  Footer Items  -->
			<ContentPresenter
				Grid.Row="2"
				HorizontalAlignment="Stretch"
				VerticalAlignment="Stretch"
				HorizontalContentAlignment="Stretch"
				VerticalContentAlignment="Stretch"
				Content="{x:Bind Footer, Mode=OneWay}" />

		</Grid>

		<!--  Sizer  -->
		<Border
			x:Name="SidebarResizer"
			Grid.Row="1"
			Grid.RowSpan="2"
			Grid.Column="2"
			MinWidth="4"
			Margin="0,60,0,40"
			HorizontalAlignment="Left"
			AllowFocusOnInteraction="True"
			Background="Transparent"
			BorderBrush="Transparent"
			Canvas.ZIndex="100"
			CornerRadius="2"
			DoubleTapped="SidebarResizer_DoubleTapped"
			ManipulationCompleted="SidebarResizer_ManipulationCompleted"
			ManipulationDelta="SidebarResizer_ManipulationDelta"
			ManipulationMode="TranslateX"
			ManipulationStarted="SidebarResizer_ManipulationStarted"
			PointerCanceled="SidebarResizer_PointerExited"
			PointerEntered="SidebarResizer_PointerEntered"
			PointerExited="SidebarResizer_PointerExited"
			RenderTransform="{Binding ElementName=ContentRoot, Path=RenderTransform, Mode=OneWay}"
			Visibility="{Binding ElementName=PaneRoot, Path=Visibility, Mode=OneWay}">
			<UserControl
				x:Name="SidebarResizerControl"
				IsTabStop="True"
				KeyDown="SidebarResizerControl_KeyDown"
				UseSystemFocusVisuals="True" />
		</Border>

		<!--  Content  -->
		<ContentPresenter
			x:Name="ContentPresenter"
			Grid.Row="1"
			Grid.Column="2"
			Margin="2,0,8,0"
			VerticalAlignment="Stretch"
			Content="{x:Bind InnerContent, Mode=OneWay}"
			TabFocusNavigation="Local" />

		<VisualStateManager.VisualStateGroups>

			<VisualStateGroup x:Name="DisplayModes">
				<VisualState x:Name="Expanded" />
				<VisualState x:Name="Compact">
					<VisualState.Setters>
						<Setter Target="PaneColumnDefinition.Width" Value="{StaticResource SidebarCompactOpenPaneLength}" />
						<Setter Target="MenuItemHostScrollViewer.HorizontalScrollMode" Value="Disabled" />
						<Setter Target="MenuItemHostScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
					</VisualState.Setters>
				</VisualState>
				<VisualState x:Name="MinimalCollapsed">
					<VisualState.Setters>
						<Setter Target="PaneColumnDefinition.Width" Value="{StaticResource SidebarOpenPaneLength}" />
						<Setter Target="PaneColumnGrid.Background" Value="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}" />
						<Setter Target="PaneColumnGrid.BorderBrush" Value="{ThemeResource SurfaceStrokeColorDefaultBrush}" />
						<Setter Target="PaneColumnGrid.BorderThickness" Value="0,1,1,0" />
						<Setter Target="PaneColumnGrid.CornerRadius" Value="0,8,0,8" />
						<Setter Target="ContentPresenter.(Grid.Column)" Value="0" />
						<Setter Target="ContentPresenter.(Grid.ColumnSpan)" Value="3" />
						<Setter Target="SidebarResizer.Visibility" Value="Collapsed" />
						<Setter Target="ContentPresenter.Margin" Value="8,0,8,0" />
						<!--  Specific to Collapsed State  -->
						<Setter Target="PaneColumnGridTransform.TranslateX" Value="{StaticResource SidebarNegativeOpenPaneLength}" />
						<Setter Target="PaneColumnGrid.Visibility" Value="Collapsed" />
					</VisualState.Setters>
				</VisualState>
				<VisualState x:Name="MinimalExpanded">
					<VisualState.Setters>
						<Setter Target="PaneColumnDefinition.Width" Value="{StaticResource SidebarOpenPaneLength}" />
						<Setter Target="PaneColumnGrid.Background" Value="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}" />
						<Setter Target="PaneColumnGrid.BorderBrush" Value="{ThemeResource SurfaceStrokeColorDefaultBrush}" />
						<Setter Target="PaneColumnGrid.BorderThickness" Value="0,1,1,0" />
						<Setter Target="PaneColumnGrid.CornerRadius" Value="0,8,0,8" />
						<Setter Target="ContentPresenter.(Grid.Column)" Value="0" />
						<Setter Target="ContentPresenter.(Grid.ColumnSpan)" Value="3" />
						<Setter Target="SidebarResizer.Visibility" Value="Collapsed" />
						<Setter Target="ContentPresenter.Margin" Value="8,0,8,0" />
						<!--  Specific to Expanded State  -->
						<Setter Target="PaneLightDismissLayer.Visibility" Value="Visible" />
						<Setter Target="PaneColumnGrid.Shadow">
							<Setter.Value>
								<ThemeShadow />
							</Setter.Value>
						</Setter>
					</VisualState.Setters>
				</VisualState>

				<VisualStateGroup.Transitions>
					<VisualTransition From="Compact" To="MinimalCollapsed">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="{StaticResource SidebarNegativeCompactOpenPaneLength}" />
							</DoubleAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Column)">
								<DiscreteObjectKeyFrame Value="0" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.ColumnSpan)">
								<DiscreteObjectKeyFrame Value="3" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Margin)">
								<DiscreteObjectKeyFrame Value="0,0,0,0" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGrid" Storyboard.TargetProperty="Background">
								<DiscreteObjectKeyFrame Value="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnDefinition" Storyboard.TargetProperty="MaxWidth">
								<DiscreteObjectKeyFrame Value="{StaticResource SidebarCompactOpenPaneLength}" />
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>

					<VisualTransition From="Expanded" To="MinimalCollapsed">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="{x:Bind NegativeOpenPaneLength, Mode=OneWay}" />
							</DoubleAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Column)">
								<DiscreteObjectKeyFrame Value="0" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.ColumnSpan)">
								<DiscreteObjectKeyFrame Value="3" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Margin)">
								<DiscreteObjectKeyFrame Value="0,0,0,0" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGrid" Storyboard.TargetProperty="Background">
								<DiscreteObjectKeyFrame Value="{ThemeResource AcrylicBackgroundFillColorDefaultBrush}" />
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>

					<VisualTransition From="MinimalCollapsed" To="Compact">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="{StaticResource SidebarNegativeCompactOpenPaneLength}" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="0" />
							</DoubleAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Column)">
								<DiscreteObjectKeyFrame Value="2" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.ColumnSpan)">
								<DiscreteObjectKeyFrame Value="1" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Margin)">
								<DiscreteObjectKeyFrame Value="2,0,0,0" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnDefinition" Storyboard.TargetProperty="Width">
								<DiscreteObjectKeyFrame Value="{StaticResource SidebarCompactOpenPaneLength}" />
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>

					<VisualTransition From="MinimalCollapsed" To="Expanded">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="{x:Bind NegativeOpenPaneLength, Mode=OneWay}" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="0" />
							</DoubleAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Column)">
								<DiscreteObjectKeyFrame Value="2" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.ColumnSpan)">
								<DiscreteObjectKeyFrame Value="1" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(Grid.Margin)">
								<DiscreteObjectKeyFrame Value="2,0,0,0" />
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>

					<VisualTransition From="MinimalCollapsed" To="MinimalExpanded">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="{StaticResource SidebarNegativeOpenPaneLength}" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="0" />
							</DoubleAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneLightDismissLayer" Storyboard.TargetProperty="Visibility">
								<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible" />
							</ObjectAnimationUsingKeyFrames>
							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGrid" Storyboard.TargetProperty="Shadow">
								<DiscreteObjectKeyFrame KeyTime="0:0:0">
									<DiscreteObjectKeyFrame.Value>
										<ThemeShadow />
									</DiscreteObjectKeyFrame.Value>
								</DiscreteObjectKeyFrame>
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>

					<VisualTransition From="MinimalExpanded" To="MinimalCollapsed">
						<Storyboard>
							<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGridTransform" Storyboard.TargetProperty="TranslateX">
								<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0" />
								<SplineDoubleKeyFrame
									KeySpline="0.1,0.9 0.2,1.0"
									KeyTime="0:0:0.35"
									Value="{StaticResource SidebarNegativeOpenPaneLength}" />
							</DoubleAnimationUsingKeyFrames>

							<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PaneColumnGrid" Storyboard.TargetProperty="Shadow">
								<DiscreteObjectKeyFrame KeyTime="0:0:0">
									<DiscreteObjectKeyFrame.Value>
										<ThemeShadow />
									</DiscreteObjectKeyFrame.Value>
								</DiscreteObjectKeyFrame>
							</ObjectAnimationUsingKeyFrames>
						</Storyboard>
					</VisualTransition>
				</VisualStateGroup.Transitions>
			</VisualStateGroup>

			<VisualStateGroup x:Name="ResizerStates">
				<VisualState x:Name="ResizerNormal" />
				<VisualState x:Name="ResizerPointerOver">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SidebarResizer" Storyboard.TargetProperty="Background">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CardStrokeColorDefaultSolidBrush}" />
						</ObjectAnimationUsingKeyFrames>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SidebarResizer" Storyboard.TargetProperty="BorderBrush">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CardStrokeColorDefaultSolidBrush}" />
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>

				<VisualState x:Name="ResizerPressed">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SidebarResizer" Storyboard.TargetProperty="Background">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SolidBackgroundFillColorSecondaryBrush}" />
						</ObjectAnimationUsingKeyFrames>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SidebarResizer" Storyboard.TargetProperty="BorderBrush">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SolidBackgroundFillColorSecondaryBrush}" />
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
			</VisualStateGroup>

		</VisualStateManager.VisualStateGroups>
	</Grid>
</UserControl>