Skip to content

[CmdPal Dock] Compact mode #46699

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
niels9001 wants to merge 7 commits into
base: main
Choose a base branch
from
Draft

[CmdPal Dock] Compact mode #46699

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
3a9578a
Compact mode
niels9001 Mar 30, 2026
621846b
Compact mode working
niels9001 Mar 30, 2026
391cd62
Merge branch 'main' into niels9001/compact-mode
niels9001 Apr 1, 2026
6e5202e
Fix spell check: change 'appbar' to 'app bar' in comment
Copilot Apr 2, 2026
7b1bbe8
Merge branch 'main' into niels9001/compact-mode
niels9001 Apr 3, 2026
fbebac9
Merge branch 'main' into niels9001/compact-mode
niels9001 Apr 3, 2026
b31f94d
Merge branch 'main' into niels9001/compact-mode
niels9001 Apr 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 3 additions & 6 deletions src/modules/cmdpal/Microsoft.CmdPal.UI.ViewModels/Settings/DockSettings.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,7 @@ public record DockSettings
{
public DockSide Side { get; init; } = DockSide.Top;

public DockSize DockSize { get; init; } = DockSize.Small;

public DockSize DockIconsSize { get; init; } = DockSize.Small;
public DockSize DockSize { get; init; } = DockSize.Default;

public bool AlwaysOnTop { get; set; } = true;

Expand Down Expand Up @@ -139,9 +137,8 @@ public enum DockSide

public enum DockSize
{
Small,
Medium,
Large,
Default,
Compact,
}

public enum DockBackdrop
Expand Down
73 changes: 62 additions & 11 deletions src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,9 @@

<UserControl.Resources>
<ResourceDictionary>
<StackLayout
x:Key="ItemsOrientationLayout"
Orientation="{x:Bind ItemsOrientation, Mode=OneWay}"
Spacing="4" />
<StackLayout x:Key="ItemsOrientationLayout" Orientation="{x:Bind ItemsOrientation, Mode=OneWay}" />
<ItemsPanelTemplate x:Key="HorizontalItemsPanel">
<StackPanel Orientation="Horizontal" Spacing="4" />
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
<ItemsPanelTemplate x:Key="VerticalItemsPanel">
<StackPanel Orientation="Vertical" Spacing="4" />
Expand Down Expand Up @@ -61,6 +58,42 @@
</ItemsRepeater>
</DataTemplate>

<DataTemplate x:Key="CompactDockBandTemplate" x:DataType="dockVm:DockBandViewModel">
<ItemsRepeater
ItemsSource="{x:Bind Items, Mode=OneWay}"
Layout="{StaticResource ItemsOrientationLayout}"
TabFocusNavigation="Local">
<ItemsRepeater.Transitions>
<TransitionCollection />
</ItemsRepeater.Transitions>
<ItemsRepeater.ItemTemplate>
<DataTemplate x:DataType="dockVm:DockItemViewModel">
<local:DockItemControl
Title="{x:Bind Title, Mode=OneWay}"
VerticalAlignment="Stretch"
VerticalContentAlignment="Stretch"
RightTapped="BandItem_RightTapped"
Style="{StaticResource CompactDockItemControlStyle}"
Subtitle="{x:Bind Subtitle, Mode=OneWay}"
Tag="{x:Bind}"
Tapped="BandItem_Tapped"
ToolTip="{x:Bind Tooltip, Mode=OneWay}">
<local:DockItemControl.Icon>
<cpcontrols:IconBox
x:Name="IconBorder"
Width="16"
VerticalAlignment="Center"
AutomationProperties.AccessibilityView="Raw"
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
SourceKey="{x:Bind Icon, Mode=OneWay}"
SourceRequested="{x:Bind help:IconProvider.SourceRequested16}" />
</local:DockItemControl.Icon>
</local:DockItemControl>
</DataTemplate>
</ItemsRepeater.ItemTemplate>
</ItemsRepeater>
</DataTemplate>

<Style x:Key="DockBandListViewStyle" TargetType="ListView">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Padding" Value="0" />
Expand All @@ -76,7 +109,7 @@

<Style x:Key="DockBandListViewItemStyle" TargetType="ListViewItem">
<Setter Property="Padding" Value="0" />
<Setter Property="Margin" Value="0,0,4,0" />
<Setter Property="Margin" Value="0,0,0,0" />
<Setter Property="MinHeight" Value="0" />
<Setter Property="MinWidth" Value="0" />
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
Expand Down Expand Up @@ -209,13 +242,12 @@

<Grid
x:Name="RootGrid"
Background="Transparent"
BorderThickness="0,0,0,1"
RightTapped="RootGrid_RightTapped">
<!-- Dock content with Start / Center / End sections -->
<local:DockContentControl
x:Name="ContentGrid"
Margin="4"
Background="Transparent"
IsEditMode="{x:Bind IsEditMode, Mode=OneWay}"
RightTapped="RootGrid_RightTapped">
<local:DockContentControl.StartSource>
Expand Down Expand Up @@ -247,7 +279,6 @@
<FontIcon FontSize="12" Glyph="&#xE710;" />
</Button>
</local:DockContentControl.StartActionButton>

<local:DockContentControl.CenterSource>
<ListView
x:Name="CenterListView"
Expand Down Expand Up @@ -282,6 +313,8 @@
<ListView
x:Name="EndListView"
MinWidth="48"
MinHeight="0"
HorizontalContentAlignment="Stretch"
DragEnter="BandListView_DragEnter"
DragItemsCompleted="BandListView_DragItemsCompleted"
DragItemsStarting="BandListView_DragItemsStarting"
Expand Down Expand Up @@ -311,7 +344,6 @@
</Button>
</local:DockContentControl.EndActionButton>
</local:DockContentControl>

<TeachingTip
x:Name="EditButtonsTeachingTip"
MinWidth="0"
Expand Down Expand Up @@ -344,7 +376,7 @@
<ui:IsEqualStateTrigger Value="{x:Bind DockSide, Mode=OneWay}" To="Top" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="ContentGrid.Margin" Value="4,0,4,4" />
<Setter Target="ContentGrid.Margin" Value="4,0,4,0" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="DockOnBottom">
Expand Down Expand Up @@ -391,6 +423,25 @@
</VisualState.Setters>
</VisualState>
</VisualStateGroup>

<!--
Compact overrides: zeroes margins/borders set by DockOrientation.
Declared after DockOrientation so its setters win when both groups
target the same property.
-->
<VisualStateGroup x:Name="DockSizeStates">
<VisualState x:Name="DefaultSize" />
<VisualState x:Name="CompactSize">
<VisualState.StateTriggers>
<ui:IsEqualStateTrigger Value="{x:Bind DockSize, Mode=OneWay}" To="Compact" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="ContentGrid.Margin" Value="0" />
<Setter Target="ContentGrid.Padding" Value="0" />
<Setter Target="RootGrid.BorderThickness" Value="0" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</UserControl>
26 changes: 26 additions & 0 deletions src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,15 @@ public DockSide DockSide
set => SetValue(DockSideProperty, value);
}

public static readonly DependencyProperty DockSizeProperty =
DependencyProperty.Register(nameof(DockSize), typeof(DockSize), typeof(DockControl), new PropertyMetadata(DockSize.Default));

public DockSize DockSize
{
get => (DockSize)GetValue(DockSizeProperty);
set => SetValue(DockSizeProperty, value);
}

public static readonly DependencyProperty IsEditModeProperty =
DependencyProperty.Register(nameof(IsEditMode), typeof(bool), typeof(DockControl), new PropertyMetadata(false, OnIsEditModeChanged));

Expand Down Expand Up @@ -233,11 +242,23 @@ private void DiscardEditingButton_Click(object sender, RoutedEventArgs e)
internal void UpdateSettings(DockSettings settings)
{
DockSide = settings.Side;
DockSize = settings.DockSize;

var isHorizontal = settings.Side == DockSide.Top || settings.Side == DockSide.Bottom;

ItemsOrientation = isHorizontal ? Orientation.Horizontal : Orientation.Vertical;

// Swap the band template to use the appropriate DockItemControl style
var templateKey = settings.DockSize == DockSize.Compact
? "CompactDockBandTemplate"
: "DockBandTemplate";
if (Resources.TryGetValue(templateKey, out var resource) && resource is DataTemplate template)
{
StartListView.ItemTemplate = template;
CenterListView.ItemTemplate = template;
EndListView.ItemTemplate = template;
}

if (settings.Backdrop == DockBackdrop.Transparent)
{
RootGrid.BorderBrush = new SolidColorBrush(Colors.Transparent);
Expand Down Expand Up @@ -290,6 +311,11 @@ private void BandItem_RightTapped(object sender, Microsoft.UI.Xaml.Input.RightTa
ShowTitlesMenuItem.IsChecked = _editModeContextBand.ShowTitles;
ShowSubtitlesMenuItem.IsChecked = _editModeContextBand.ShowSubtitles;

// Hide subtitle toggle in compact mode — no subtitle in the template
ShowSubtitlesMenuItem.Visibility = DockSize == DockSize.Compact
? Visibility.Collapsed
: Visibility.Visible;

PreparePopupForShow(EditModeContextMenu, dockItem);
EditModeContextMenu.ShowAt(
dockItem,
Expand Down
Loading
Loading