Files
PowerToys/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml
Niels Laute 3ecdb45eea I broke it
2025-12-04 21:01:39 +01:00

339 lines
16 KiB
XML

<?xml version="1.0" encoding="utf-8" ?>
<UserControl
x:Class="Microsoft.CmdPal.UI.Controls.DockEditor"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:dockVm="using:Microsoft.CmdPal.UI.ViewModels.Dock"
xmlns:helpers="using:Microsoft.CmdPal.UI.Helpers"
xmlns:local="using:Microsoft.CmdPal.UI.Controls"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Loaded="UserControl_Loaded"
mc:Ignorable="d">
<Grid>
<Grid.Resources>
<!-- Flyout for adding items to a dock area -->
<Flyout x:Key="AddItemsFlyout" Placement="Bottom">
<Grid Width="300" MaxHeight="400">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock
Margin="0,0,0,12"
FontSize="16"
FontWeight="SemiBold"
Text="Add Dock Item" />
<ListView
x:Name="AvailableItemsListView"
Grid.Row="1"
MaxHeight="350"
IsItemClickEnabled="True"
ItemClick="AvailableItemsListView_ItemClick"
SelectionMode="None">
<ListView.ItemTemplate>
<DataTemplate x:DataType="dockVm:DockBandSettingsViewModel">
<Grid
Height="48"
Padding="8"
ColumnSpacing="8">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="32" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<local:IconBox
Width="24"
Height="24"
HorizontalAlignment="Center"
VerticalAlignment="Center"
SourceKey="{x:Bind Icon, Mode=OneWay}"
SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
<StackPanel
Grid.Column="1"
VerticalAlignment="Center"
Spacing="2">
<TextBlock
FontWeight="SemiBold"
Text="{x:Bind Title}"
TextTrimming="CharacterEllipsis" />
<TextBlock
FontSize="12"
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
Text="{x:Bind Description}"
TextTrimming="CharacterEllipsis" />
</StackPanel>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</Flyout>
<!-- Template for dock band items in the editor -->
<DataTemplate x:Key="DockBandItemTemplate" x:DataType="dockVm:DockBandSettingsViewModel">
<Grid
Padding="8,4"
Background="Transparent"
BorderBrush="{ThemeResource DividerStrokeColorDefaultBrush}"
BorderThickness="1"
CornerRadius="4"
ToolTipService.ToolTip="{x:Bind Title}">
<FlyoutBase.AttachedFlyout>
<Flyout Placement="Bottom">
<Grid Width="280">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel
Margin="0,0,0,16"
Orientation="Horizontal"
Spacing="8">
<local:IconBox
x:Name="OptionsFlyoutIcons"
Width="24"
Height="24"
HorizontalAlignment="Center"
VerticalAlignment="Center"
SourceKey="{x:Bind Icon, Mode=OneWay}"
SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
<TextBlock
x:Name="OptionsFlyoutTitle"
VerticalAlignment="Center"
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
Text="{x:Bind Title, Mode=OneWay}" />
</StackPanel>
<StackPanel Grid.Row="1" Margin="0,0,0,16">
<TextBlock
Margin="0,0,0,8"
FontSize="12"
Text="Show labels" />
<ComboBox
x:Name="ShowLabelsComboBox"
HorizontalAlignment="Stretch"
SelectedIndex="{x:Bind ShowLabelsIndex, Mode=TwoWay}">
<ComboBoxItem Content="Default" />
<ComboBoxItem Content="Show" />
<ComboBoxItem Content="Hide" />
</ComboBox>
</StackPanel>
<Border
Grid.Row="2"
Height="1"
Margin="0,0,0,16"
Background="{ThemeResource DividerStrokeColorDefaultBrush}" />
<Button
Grid.Row="3"
HorizontalAlignment="Stretch"
Click="UnpinButton_Click"
Command="{x:Bind UnpinCommand}"
Content="Unpin from dock" />
</Grid>
</Flyout>
</FlyoutBase.AttachedFlyout>
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="Tapped">
<helpers:OpenFlyoutAction />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
<local:IconBox
Width="24"
Height="24"
HorizontalAlignment="Center"
VerticalAlignment="Center"
SourceKey="{x:Bind Icon, Mode=OneWay}"
SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
</Grid>
</DataTemplate>
<!-- Style for horizontal ListView items -->
<Style
x:Key="DockEditorListViewItemStyle"
BasedOn="{StaticResource DefaultListViewItemStyle}"
TargetType="ListViewItem">
<Setter Property="MinWidth" Value="0" />
<Setter Property="MinHeight" Value="0" />
<Setter Property="Padding" Value="4" />
<Setter Property="Margin" Value="2,0" />
</Style>
</Grid.Resources>
<!-- Main dock editor bar -->
<Grid Padding="4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition x:Name="EndColumn" Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition x:Name="EndRow" Height="Auto" />
</Grid.RowDefinitions>
<!-- Start (Left) Section -->
<StackPanel
x:Name="StartPanel"
Grid.Column="0"
HorizontalAlignment="Left"
Orientation="Horizontal"
Spacing="4">
<ListView
x:Name="StartListView"
MinWidth="48"
VerticalAlignment="Center"
AllowDrop="True"
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
CanDragItems="True"
CanReorderItems="True"
CornerRadius="8"
DragItemsCompleted="ListView_DragItemsCompleted"
DragItemsStarting="ListView_DragItemsStarting"
DragOver="ListView_DragOver"
Drop="StartListView_Drop"
IsItemClickEnabled="False"
ItemContainerStyle="{StaticResource DockEditorListViewItemStyle}"
ItemTemplate="{StaticResource DockBandItemTemplate}"
ItemsSource="{x:Bind StartItems, Mode=OneWay}"
SelectionMode="None">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" Spacing="4" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
<Button
x:Name="StartAddButton"
VerticalAlignment="Center"
Click="AddButton_Click"
Flyout="{StaticResource AddItemsFlyout}"
Style="{StaticResource SubtleButtonStyle}"
ToolTipService.ToolTip="Add item to start">
<FontIcon FontSize="16" Glyph="&#xE710;" />
</Button>
</StackPanel>
<!-- Center Section (hidden for now) -->
<StackPanel
x:Name="CenterPanel"
Grid.Column="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal"
Spacing="4"
Visibility="Collapsed">
<Button
x:Name="CenterAddButtonLeft"
VerticalAlignment="Center"
Click="AddButton_Click"
Flyout="{StaticResource AddItemsFlyout}"
Style="{StaticResource SubtleButtonStyle}"
ToolTipService.ToolTip="Add item to center"
Visibility="Collapsed">
<FontIcon FontSize="16" Glyph="&#xE710;" />
</Button>
<ListView
x:Name="CenterListView"
MinWidth="48"
VerticalAlignment="Center"
AllowDrop="True"
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
CanDragItems="True"
CanReorderItems="True"
CornerRadius="8"
DragItemsCompleted="ListView_DragItemsCompleted"
DragItemsStarting="ListView_DragItemsStarting"
DragOver="ListView_DragOver"
Drop="CenterListView_Drop"
IsItemClickEnabled="False"
ItemContainerStyle="{StaticResource DockEditorListViewItemStyle}"
ItemTemplate="{StaticResource DockBandItemTemplate}"
ItemsSource="{x:Bind CenterItems, Mode=OneWay}"
SelectionMode="None">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" Spacing="4" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
<Button
x:Name="CenterAddButton"
VerticalAlignment="Center"
Click="AddButton_Click"
Style="{StaticResource SubtleButtonStyle}"
ToolTipService.ToolTip="Add item to center">
<FontIcon FontSize="16" Glyph="&#xE710;" />
</Button>
</StackPanel>
<!-- End (Right) Section -->
<StackPanel
x:Name="EndPanel"
Grid.Column="2"
HorizontalAlignment="Right"
Orientation="Horizontal"
Spacing="4">
<Button
x:Name="EndAddButton"
VerticalAlignment="Center"
Click="AddButton_Click"
Flyout="{StaticResource AddItemsFlyout}"
Style="{StaticResource SubtleButtonStyle}"
ToolTipService.ToolTip="Add item to end">
<FontIcon FontSize="16" Glyph="&#xE710;" />
</Button>
<ListView
x:Name="EndListView"
MinWidth="48"
VerticalAlignment="Center"
AllowDrop="True"
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
CanDragItems="True"
CanReorderItems="True"
CornerRadius="8"
DragItemsCompleted="ListView_DragItemsCompleted"
DragItemsStarting="ListView_DragItemsStarting"
DragOver="ListView_DragOver"
Drop="StartListView_Drop"
IsItemClickEnabled="False"
ItemContainerStyle="{StaticResource DockEditorListViewItemStyle}"
ItemTemplate="{StaticResource DockBandItemTemplate}"
ItemsSource="{x:Bind EndItems, Mode=OneWay}"
SelectionMode="None">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" Spacing="4" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
</StackPanel>
</Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="OrientationStates">
<VisualState x:Name="Horizontal" />
<VisualState x:Name="Vertical">
<VisualState.Setters>
<Setter Target="StartPanel.Orientation" Value="Vertical" />
<Setter Target="CenterPanel.Orientation" Value="Vertical" />
<Setter Target="EndPanel.Orientation" Value="Vertical" />
<Setter Target="CenterPanel.(Grid.Column)" Value="0" />
<Setter Target="CenterPanel.(Grid.Row)" Value="1" />
<Setter Target="CenterPanel.(Grid.Column)" Value="0" />
<Setter Target="CenterPanel.(Grid.Row)" Value="2" />
<Setter Target="EndColumn.Width" Value="Auto" />
<Setter Target="EndRow.Height" Value="*" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</UserControl>