Skip to content

Commit 379941d

Browse files
committed
Improved the content visual on inactive
1 parent 99fb7d1 commit 379941d

File tree

7 files changed

+61
-48
lines changed

7 files changed

+61
-48
lines changed

src/Files.App.Controls/Omnibar/Omnibar.Properties.cs

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -19,20 +19,5 @@ public partial class Omnibar
1919

2020
[GeneratedDependencyProperty]
2121
public partial OmnibarMode? CurrentActiveMode { get; set; }
22-
23-
[GeneratedDependencyProperty]
24-
public partial FrameworkElement? DefaultInactiveMode { get; set; }
25-
26-
partial void OnDefaultInactiveModeChanged(FrameworkElement? newValue)
27-
{
28-
if (Modes is null)
29-
return;
30-
31-
foreach (var mode in Modes)
32-
{
33-
//if (mode.UseDefaultInactiveMode)
34-
// mode.ContentOnInactive = newValue;
35-
}
36-
}
3722
}
3823
}

src/Files.App.Controls/Omnibar/Omnibar.cs

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,9 +79,6 @@ protected override void OnApplyTemplate()
7979
Grid.SetColumn(mode, _modesHostGrid.Children.Count);
8080
_modesHostGrid.Children.Add(mode);
8181
mode.Host = this;
82-
83-
//if (mode.UseDefaultInactiveMode)
84-
// mode.ContentOnInactive = DefaultInactiveMode;
8582
}
8683

8784
_modesHostGrid.SizeChanged += ModesHostGrid_SizeChanged;
@@ -133,7 +130,14 @@ private void UpdateVisualStates()
133130
}
134131

135132
if (CurrentActiveMode is not null)
136-
VisualStateManager.GoToState(CurrentActiveMode, _isFocused ? "Focused" : "CurrentUnfocused", true);
133+
VisualStateManager.GoToState(
134+
CurrentActiveMode,
135+
_isFocused
136+
? "Focused"
137+
: CurrentActiveMode.ContentOnInactive is null
138+
? "CurrentUnfocusedWithoutInactiveMode"
139+
: "CurrentUnfocusedWithInactiveMode",
140+
true);
137141
}
138142

139143
// Events

src/Files.App.Controls/Omnibar/OmnibarMode.Properties.cs

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,6 @@ public partial class OmnibarMode
2323
[GeneratedDependencyProperty]
2424
public partial string? ToolTip { get; set; }
2525

26-
[GeneratedDependencyProperty]
27-
public partial bool UseDefaultInactiveMode { get; set; }
28-
2926
[GeneratedDependencyProperty]
3027
public partial FrameworkElement? ContentOnInactive { get; set; }
3128

src/Files.App.Controls/Omnibar/OmnibarMode.cs

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -98,13 +98,12 @@ private void OmnibarMode_PointerReleased(object sender, PointerRoutedEventArgs e
9898
_isPressed = false;
9999
UpdateVisualStates();
100100
Host.ChangeMode(this);
101+
_inputTextBox?.Focus(FocusState.Pointer);
102+
_inputTextBox?.Select(_inputTextBox.Text.Length, 0);
101103
}
102104

103105
private void OmnibarMode_PointerExited(object sender, PointerRoutedEventArgs e)
104106
{
105-
//if (Host!.CurrentActiveMode == this)
106-
// return;
107-
108107
_isHoveredOver = _isPressed = false;
109108
UpdateVisualStates();
110109
}

src/Files.App.Controls/Omnibar/OmnibarMode.xaml

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@
8181
Grid.Column="0"
8282
Grid.ColumnSpan="2"
8383
HorizontalAlignment="Stretch"
84-
VerticalAlignment="Center"
84+
VerticalAlignment="Stretch"
8585
HorizontalContentAlignment="Stretch"
8686
Content="{Binding ContentOnInactive, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}"
8787
Visibility="Collapsed" />
@@ -105,11 +105,17 @@
105105

106106
<VisualStateGroup x:Name="FocusStates">
107107
<VisualState x:Name="Unfocused" />
108-
<VisualState x:Name="CurrentUnfocused">
108+
<VisualState x:Name="CurrentUnfocusedWithoutInactiveMode">
109109
<VisualState.Setters>
110110
<Setter Target="PART_InputTextBox.Visibility" Value="Visible" />
111111
</VisualState.Setters>
112112
</VisualState>
113+
<VisualState x:Name="CurrentUnfocusedWithInactiveMode">
114+
<VisualState.Setters>
115+
<Setter Target="PART_ModeIconPresenter.Visibility" Value="Collapsed" />
116+
<Setter Target="PART_InactiveContent.Visibility" Value="Visible" />
117+
</VisualState.Setters>
118+
</VisualState>
113119
<VisualState x:Name="Focused">
114120
<VisualState.Setters>
115121
<Setter Target="PART_ModeIconPresenter.Content" Value="{Binding IconOnActive, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}" />
30.6 KB
Loading

tests/Files.App.UITests/Views/OmnibarPage.xaml

Lines changed: 43 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -66,37 +66,53 @@
6666
Style="{StaticResource GridExampleControlStyle}">
6767
<controls:Omnibar HorizontalAlignment="Stretch" VerticalAlignment="Center">
6868

69-
<controls:Omnibar.DefaultInactiveMode>
70-
<Grid>
71-
<TextBlock Text="A" />
72-
</Grid>
73-
</controls:Omnibar.DefaultInactiveMode>
74-
7569
<controls:OmnibarMode
7670
IsDefault="True"
7771
Text="Path..."
7872
TextPlaceholder="Enter text..."
79-
ToolTip="Path"
80-
UseDefaultInactiveMode="True">
73+
ToolTip="Path">
8174
<controls:OmnibarMode.IconOnActive>
8275
<controls:ThemedIcon IsFilled="True" Style="{StaticResource App.ThemedIcons.Omnibar.Path}" />
8376
</controls:OmnibarMode.IconOnActive>
8477
<controls:OmnibarMode.IconOnInactive>
85-
<controls:ThemedIcon Style="{StaticResource App.ThemedIcons.Omnibar.Path}" />
78+
<controls:ThemedIcon IconType="Outline" Style="{StaticResource App.ThemedIcons.Omnibar.Path}" />
8679
</controls:OmnibarMode.IconOnInactive>
80+
<controls:OmnibarMode.ContentOnInactive>
81+
<Grid
82+
Padding="16,0"
83+
HorizontalAlignment="Stretch"
84+
ColumnSpacing="16">
85+
<Grid.ColumnDefinitions>
86+
<ColumnDefinition Width="Auto" />
87+
<ColumnDefinition Width="*" />
88+
<ColumnDefinition Width="Auto" />
89+
</Grid.ColumnDefinitions>
90+
<Image
91+
Grid.Column="0"
92+
Width="16"
93+
Height="16"
94+
Source="/Data/DummyIcon1.png" />
95+
<TextBlock
96+
Grid.Column="1"
97+
VerticalAlignment="Center"
98+
Text="Breadcrumb goes here" />
99+
<FontIcon
100+
Grid.Column="2"
101+
FontSize="14"
102+
Glyph="&#xe70d;" />
103+
</Grid>
104+
</controls:OmnibarMode.ContentOnInactive>
87105
</controls:OmnibarMode>
88106

89107
<controls:OmnibarMode
90108
SuggestionItemsSource="{x:Bind DummyItems1, Mode=OneWay}"
91-
Text="Palette..."
92109
TextPlaceholder="Enter a palette command..."
93-
ToolTip="Palette"
94-
UseDefaultInactiveMode="True">
110+
ToolTip="Palette">
95111
<controls:OmnibarMode.IconOnActive>
96112
<controls:ThemedIcon IsFilled="True" Style="{StaticResource App.ThemedIcons.Omnibar.Commands}" />
97113
</controls:OmnibarMode.IconOnActive>
98114
<controls:OmnibarMode.IconOnInactive>
99-
<controls:ThemedIcon Style="{StaticResource App.ThemedIcons.Omnibar.Commands}" />
115+
<controls:ThemedIcon IconType="Outline" Style="{StaticResource App.ThemedIcons.Omnibar.Commands}" />
100116
</controls:OmnibarMode.IconOnInactive>
101117
<controls:OmnibarMode.SuggestionItemTemplate>
102118
<DataTemplate x:DataType="data:DummyItem1">
@@ -110,29 +126,35 @@
110126
<controls:ThemedIcon IconSize="20" Style="{StaticResource App.ThemedIcons.Actions.Copying}" />
111127
</StackPanel>
112128
<StackPanel Grid.Column="1" VerticalAlignment="Center">
113-
<TextBlock Style="{StaticResource BodyStrongTextBlockStyle}" Text="{x:Bind Title}" />
129+
<TextBlock
130+
Style="{StaticResource BodyStrongTextBlockStyle}"
131+
Text="{x:Bind Title}"
132+
TextTrimming="CharacterEllipsis"
133+
TextWrapping="NoWrap" />
114134
<TextBlock
115135
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
116136
Style="{StaticResource CaptionTextBlockStyle}"
117-
Text="{x:Bind Description}" />
137+
Text="{x:Bind Description}"
138+
TextTrimming="CharacterEllipsis"
139+
TextWrapping="NoWrap" />
118140
</StackPanel>
119141
<StackPanel Grid.Column="2" VerticalAlignment="Center">
120-
<TextBlock Text="{x:Bind HotKeys}" />
142+
<TextBlock
143+
Text="{x:Bind HotKeys}"
144+
TextTrimming="CharacterEllipsis"
145+
TextWrapping="NoWrap" />
121146
</StackPanel>
122147
</Grid>
123148
</DataTemplate>
124149
</controls:OmnibarMode.SuggestionItemTemplate>
125150
</controls:OmnibarMode>
126151

127-
<controls:OmnibarMode
128-
Text="Search..."
129-
TextPlaceholder="Enter a search query..."
130-
ToolTip="Search">
152+
<controls:OmnibarMode TextPlaceholder="Enter a search query..." ToolTip="Search">
131153
<controls:OmnibarMode.IconOnActive>
132154
<controls:ThemedIcon IsFilled="True" Style="{StaticResource App.ThemedIcons.Omnibar.Search}" />
133155
</controls:OmnibarMode.IconOnActive>
134156
<controls:OmnibarMode.IconOnInactive>
135-
<controls:ThemedIcon Style="{StaticResource App.ThemedIcons.Omnibar.Search}" />
157+
<controls:ThemedIcon IconType="Outline" Style="{StaticResource App.ThemedIcons.Omnibar.Search}" />
136158
</controls:OmnibarMode.IconOnInactive>
137159
</controls:OmnibarMode>
138160

0 commit comments

Comments
 (0)