Skip to content

Commit df7a83c

Browse files
committed
Fixes an issue of SettingsExpander.
- SettingsExpander doesn't update visual state when `Description` and `HeaderIcon` was changed. - Change SettingsExpander focus visual position from the card to the expander button. - And stability improvements.
1 parent 131cbc8 commit df7a83c

12 files changed

+59
-54
lines changed

src/AngelUmbrella.vcxproj

+1
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,7 @@
125125
</ItemDefinitionGroup>
126126
<ItemGroup>
127127
<None Include="AngelUmbrella.def" />
128+
<None Include="version.props" />
128129
</ItemGroup>
129130
<ItemGroup>
130131
<None Include="packages.config" />

src/AngelUmbrella.vcxproj.filters

+1
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
<ItemGroup>
2121
<None Include="AngelUmbrella.def" />
2222
<None Include="packages.config" />
23+
<None Include="version.props" />
2324
</ItemGroup>
2425
<ItemGroup>
2526
<ResourceCompile Include="AngelUmbrella.rc" />

src/Themes/Generic.xaml

+8-8
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@
119119
<Setter Property="MinWidth"
120120
Value="{StaticResource SettingsCardMinWidth}" />
121121
<Setter Property="Padding"
122-
Value="0" />
122+
Value="{StaticResource SettingsCardPadding}" />
123123
<Setter Property="TabNavigation"
124124
Value="Local" />
125125
<Setter Property="VerticalContentAlignment"
@@ -136,6 +136,7 @@
136136
Control.IsTemplateFocusTarget="True"
137137
CornerRadius="{TemplateBinding CornerRadius}"
138138
FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
139+
Padding="{TemplateBinding Padding}"
139140
RenderTransformOrigin=".5,.5">
140141
<VisualStateManager.VisualStateGroups>
141142
<VisualStateGroup x:Name="CommonStates">
@@ -339,14 +340,12 @@
339340
ContentTemplate="{TemplateBinding ContentTemplate}"
340341
Content="{TemplateBinding Content}"
341342
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
342-
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
343-
Margin="{TemplateBinding Padding}" />
343+
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
344344
</Grid>
345345
<TextBlock x:Name="PlaceholderTextBlock"
346346
Opacity="0"
347347
Text="Xg"
348348
Foreground="{x:Null}"
349-
Margin="{TemplateBinding Padding}"
350349
IsHitTestVisible="False"
351350
AutomationProperties.AccessibilityView="Raw" />
352351
<Rectangle x:Name="PlaceholderRect"
@@ -359,13 +358,14 @@
359358
FontSize="12"
360359
Foreground="{TemplateBinding Foreground}"
361360
Glyph="{StaticResource CardListViewItemChevronRightGlyph}"
362-
Height="{StaticResource SettingsCardActionIconMaxSize}"
361+
Height="{StaticResource SettingsCardActionButtonHeight}"
363362
HighContrastAdjustment="None"
364-
HorizontalAlignment="Right"
363+
HorizontalAlignment="Center"
365364
IsTextScaleFactorEnabled="False"
366-
Margin="4,0,15,0"
365+
Margin="{StaticResource SettingsCardActionButtonMargin}"
367366
ToolTipService.ToolTip="More"
368-
VerticalAlignment="Center" />
367+
VerticalAlignment="Center"
368+
Width="{StaticResource SettingsCardActionButtonWidth}" />
369369
</Grid>
370370
</ControlTemplate>
371371
</Setter.Value>

src/UI/Controls/SettingsCard.xaml

+15-7
Original file line numberDiff line numberDiff line change
@@ -128,6 +128,8 @@
128128
<VisualState x:Name="HeaderOnly" />
129129
<VisualState x:Name="HeaderAndDescription">
130130
<VisualState.Setters>
131+
<Setter Target="Description.Visibility"
132+
Value="Visible" />
131133
<Setter Target="Header.TextLineBounds"
132134
Value="TrimToCapHeight" />
133135
</VisualState.Setters>
@@ -176,7 +178,8 @@
176178
FontSize="{StaticResource SettingsCardDescriptionFontSize}"
177179
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
178180
Margin="0,0,0,-1"
179-
TextWrapping="Wrap" />
181+
TextWrapping="Wrap"
182+
Visibility="Collapsed" />
180183
</StackPanel>
181184

182185
<ContentPresenter x:Name="Content"
@@ -191,17 +194,22 @@
191194
FontFamily="{StaticResource SymbolThemeFontFamily}"
192195
FontSize="12"
193196
Foreground="{TemplateBinding Foreground}"
194-
HorizontalAlignment="Right"
197+
Height="{StaticResource SettingsCardActionButtonHeight}"
195198
HighContrastAdjustment="None"
199+
HorizontalAlignment="Right"
200+
HorizontalContentAlignment="Center"
196201
IsTabStop="False"
197202
IsTextScaleFactorEnabled="False"
198-
Margin="4,0,0,0"
199-
VerticalAlignment="Center">
203+
Margin="{StaticResource SettingsCardActionButtonMargin}"
204+
ToolTipService.ToolTip="{TemplateBinding ActionIconTooltip}"
205+
VerticalAlignment="Center"
206+
VerticalContentAlignment="Center"
207+
Width="{StaticResource SettingsCardActionButtonWidth}">
200208
<Viewbox Height="{StaticResource SettingsCardActionIconMaxSize}"
209+
HorizontalAlignment="Center"
201210
StretchDirection="DownOnly"
202-
ToolTipService.ToolTip="{TemplateBinding ActionIconTooltip}">
203-
<ContentPresenter Content="{TemplateBinding ActionIcon}"
204-
HighContrastAdjustment="None" />
211+
VerticalAlignment="Center">
212+
<ContentPresenter Content="{TemplateBinding ActionIcon}" />
205213
</Viewbox>
206214
</ContentControl>
207215
</Grid>

src/UI/Controls/SettingsCard.xaml.cpp

+1-7
Original file line numberDiff line numberDiff line change
@@ -138,13 +138,7 @@ void SettingsCard::OnButtonIconChanged(bool isClickEnabled) {
138138
void SettingsCard::OnDescriptionChanged(IInspectable const& newValue) {
139139
FrameworkElement element { GetTemplateChild(controls::Description).try_as<FrameworkElement>() };
140140
if (element) {
141-
if (ValueHelper<IInspectable>::HasValue(newValue)) {
142-
element.Visibility(Visibility::Visible);
143-
VisualStateManager::GoToState(*this, states::HeaderAndDescription, true);
144-
} else {
145-
element.Visibility(Visibility::Collapsed);
146-
VisualStateManager::GoToState(*this, states::HeaderOnly, true);
147-
}
141+
VisualStateManager::GoToState(*this, ValueHelper<IInspectable>::HasValue(newValue) ? states::HeaderAndDescription : states::HeaderOnly, true);
148142
}
149143
}
150144

src/UI/Controls/SettingsCard_themeresources.xaml

+3-2
Original file line numberDiff line numberDiff line change
@@ -100,8 +100,9 @@
100100
<x:Double x:Key="SettingsCardMaxWidth">1000</x:Double>
101101
<x:Double x:Key="SettingsCardMinWidth">160</x:Double>
102102
<x:Double x:Key="SettingsCardMinHeight">48</x:Double>
103-
<x:Double x:Key="SettingsCardActionButtonWidth">32</x:Double>
104-
<x:Double x:Key="SettingsCardActionButtonHeight">32</x:Double>
103+
<Thickness x:Key="SettingsCardActionButtonMargin">4,-15,-12,-15</Thickness>
104+
<x:Double x:Key="SettingsCardActionButtonWidth">40</x:Double>
105+
<x:Double x:Key="SettingsCardActionButtonHeight">40</x:Double>
105106
<x:Double x:Key="SettingsCardDescriptionFontSize">12</x:Double>
106107
<x:Double x:Key="SettingsCardHeaderIconMaxSize">20</x:Double>
107108
<x:Double x:Key="SettingsCardActionIconMaxSize">16</x:Double>

src/UI/Controls/SettingsExpander.xaml

+13-5
Original file line numberDiff line numberDiff line change
@@ -128,12 +128,17 @@
128128
FontFamily="{StaticResource SymbolThemeFontFamily}"
129129
FontSize="12"
130130
Foreground="{TemplateBinding Foreground}"
131+
Height="{StaticResource SettingsCardActionButtonHeight}"
131132
HighContrastAdjustment="None"
132133
HorizontalAlignment="Right"
133-
IsTabStop="False"
134+
HorizontalContentAlignment="Center"
135+
IsTabStop="True"
134136
IsTextScaleFactorEnabled="False"
135-
Margin="12,0,-4,0"
136-
VerticalAlignment="Center">
137+
Margin="{StaticResource SettingsCardActionButtonMargin}"
138+
UseSystemFocusVisuals="{TemplateBinding UseSystemFocusVisuals}"
139+
VerticalAlignment="Center"
140+
VerticalContentAlignment="Center"
141+
Width="{StaticResource SettingsCardActionButtonWidth}">
137142
<AnimatedIcon x:Name="ExpandCollapseChevron"
138143
AnimatedIcon.State="NormalOff"
139144
Height="{StaticResource SettingsCardActionIconMaxSize}"
@@ -312,6 +317,8 @@
312317
<VisualState x:Name="HeaderOnly" />
313318
<VisualState x:Name="HeaderAndDescription">
314319
<VisualState.Setters>
320+
<Setter Target="Description.Visibility"
321+
Value="Visible" />
315322
<Setter Target="Header.TextLineBounds"
316323
Value="TrimToCapHeight" />
317324
</VisualState.Setters>
@@ -335,7 +342,7 @@
335342
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
336343
IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
337344
IsEnabled="{TemplateBinding IsEnabled}"
338-
IsTabStop="True"
345+
IsTabStop="False"
339346
MinHeight="{TemplateBinding MinHeight}"
340347
Padding="{TemplateBinding Padding}"
341348
Style="{StaticResource SettingsExpanderHeaderDownStyle}">
@@ -375,7 +382,8 @@
375382
FontSize="{StaticResource SettingsCardDescriptionFontSize}"
376383
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
377384
Margin="0,0,0,-1"
378-
TextWrapping="Wrap" />
385+
TextWrapping="Wrap"
386+
Visibility="Collapsed" />
379387
</StackPanel>
380388

381389
<ContentPresenter x:Name="Content"

src/UI/Controls/SettingsExpander.xaml.cpp

+1-7
Original file line numberDiff line numberDiff line change
@@ -73,13 +73,7 @@ void SettingsExpander::OnPointerExited(PointerRoutedEventArgs const& args) const
7373
void SettingsExpander::OnDescriptionChanged(IInspectable const& newValue) {
7474
FrameworkElement element { GetTemplateChild(controls::Description).try_as<FrameworkElement>() };
7575
if (element) {
76-
if (ValueHelper<IInspectable>::HasValue(newValue)) {
77-
element.Visibility(Visibility::Visible);
78-
VisualStateManager::GoToState(*this, states::HeaderAndDescription, true);
79-
} else {
80-
element.Visibility(Visibility::Collapsed);
81-
VisualStateManager::GoToState(*this, states::HeaderOnly, true);
82-
}
76+
VisualStateManager::GoToState(*this, ValueHelper<IInspectable>::HasValue(newValue) ? states::HeaderAndDescription : states::HeaderOnly, true);
8377
}
8478
}
8579

src/UI/Controls/SettingsExpander.xaml.properties.cpp

+10-2
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,19 @@ void SettingsExpander::DependencyProperties::DelayInitIfNeeded() {
2020

2121
DEFINE_PARENT_TYPENAME(SettingsExpander);
2222

23-
DEFINE_DP(Description, winrt::IInspectable, SettingsExpander);
23+
DEFINE_DP_CALLBACK(
24+
Description,
25+
winrt::IInspectable,
26+
SettingsExpander,
27+
&SettingsExpander::OnDescriptionChangedStatic);
2428

2529
DEFINE_DP(ExpanderContent, winrt::IInspectable, SettingsExpander);
2630

27-
DEFINE_DP(HeaderIcon, winrt::Microsoft::UI::Xaml::Controls::IconElement, SettingsExpander);
31+
DEFINE_DP_CALLBACK(
32+
HeaderIcon,
33+
winrt::Microsoft::UI::Xaml::Controls::IconElement,
34+
SettingsExpander,
35+
&SettingsExpander::OnHeaderIconChangedStatic);
2836

2937
DEFINE_DP_METADATA(
3038
Orientation,

src/UI/Controls/SettingsPanel.xaml

+4-8
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,6 @@
2323
Value="Right" />
2424
<Setter Property="IsTabStop"
2525
Value="False" />
26-
<Setter Property="Margin"
27-
Value="0" />
28-
<Setter Property="Padding"
29-
Value="{StaticResource SettingsCardPadding}" />
3026
<Setter Property="UseSystemFocusVisuals"
3127
Value="{StaticResource UseSystemFocusVisuals}" />
3228
<Setter Property="VerticalContentAlignment"
@@ -37,8 +33,6 @@
3733
<Grid x:Name="RootGrid"
3834
AnimatedIcon.State="Normal"
3935
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
40-
Margin="{TemplateBinding Margin}"
41-
Padding="{TemplateBinding Padding}"
4236
VerticalAlignment="{TemplateBinding VerticalAlignment}">
4337
<VisualStateManager.VisualStateGroups>
4438
<VisualStateGroup x:Name="Orientation">
@@ -58,6 +52,8 @@
5852
<VisualState x:Name="HeaderOnly" />
5953
<VisualState x:Name="HeaderAndDescription">
6054
<VisualState.Setters>
55+
<Setter Target="Description.Visibility"
56+
Value="Visible" />
6157
<Setter Target="Header.TextLineBounds"
6258
Value="TrimToCapHeight" />
6359
</VisualState.Setters>
@@ -91,7 +87,6 @@
9187
</Viewbox>
9288

9389
<StackPanel Grid.Column="1"
94-
Margin="0,0,16,0"
9590
VerticalAlignment="Center">
9691
<ContentPresenter x:Name="Header"
9792
Content="{TemplateBinding Header}"
@@ -101,7 +96,8 @@
10196
FontSize="{StaticResource SettingsCardDescriptionFontSize}"
10297
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
10398
Margin="0,0,0,-1"
104-
TextWrapping="Wrap" />
99+
TextWrapping="Wrap"
100+
Visibility="Collapsed" />
105101
</StackPanel>
106102

107103
<ContentPresenter x:Name="Content"

src/UI/Controls/SettingsPanel.xaml.cpp

+1-7
Original file line numberDiff line numberDiff line change
@@ -61,13 +61,7 @@ void SettingsPanel::OnButtonIconChanged(bool isClickEnabled) {
6161
void SettingsPanel::OnDescriptionChanged(IInspectable const& newValue) {
6262
FrameworkElement element { GetTemplateChild(controls::Description).try_as<FrameworkElement>() };
6363
if (element) {
64-
if (ValueHelper<IInspectable>::HasValue(newValue)) {
65-
element.Visibility(Visibility::Visible);
66-
VisualStateManager::GoToState(*this, states::HeaderAndDescription, true);
67-
} else {
68-
element.Visibility(Visibility::Collapsed);
69-
VisualStateManager::GoToState(*this, states::HeaderOnly, true);
70-
}
64+
VisualStateManager::GoToState(*this, ValueHelper<IInspectable>::HasValue(newValue) ? states::HeaderAndDescription : states::HeaderOnly, true);
7165
}
7266
}
7367

src/version.props

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<PropertyGroup>
44
<AngelVersionMajor>1</AngelVersionMajor>
55
<AngelVersionMinor>0</AngelVersionMinor>
6-
<AngelVersionPatch>0</AngelVersionPatch>
6+
<AngelVersionPatch>1</AngelVersionPatch>
77
<AngelVersionBuild Condition="$(AngelVersionBuild) == ''">0</AngelVersionBuild>
88
<AngelVersionRevision Condition="$(AngelVersionRevision) == ''">0</AngelVersionRevision>
99
</PropertyGroup>

0 commit comments

Comments
 (0)