Skip to content
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

Add AnimatedIcon to Combobox. #4915

Merged
merged 6 commits into from
May 7, 2021
Merged

Add AnimatedIcon to Combobox. #4915

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b067739
Add AnimatedIcon to Combobox
StephenLPeters Apr 28, 2021
9b3c92b
Fix editable combobox size changes.
StephenLPeters Apr 28, 2021
a669b61
Update Visual Verification
StephenLPeters Apr 29, 2021
5ee8c11
Merge remote-tracking branch 'origin/main' into user/stpete/ComboboxA…
StephenLPeters May 3, 2021
8f0e911
revert arrange override.
StephenLPeters May 3, 2021
032f680
update visual verification files
StephenLPeters May 4, 2021
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
5 changes: 2 additions & 3 deletions dev/AnimatedIcon/AnimatedIcon.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -165,11 +165,10 @@ winrt::Size AnimatedIcon::ArrangeOverride(winrt::Size const& finalSize)
std::min(finalSize.Height / scale.y, visualSize.y)
};
const auto offset = (finalSize - (visualSize * scale)) / 2;
const auto z = 0.0F;
const auto rootVisual = visual.RootVisual();
rootVisual.Offset({ offset, z });
rootVisual.Offset({ offset, 0.0f });
rootVisual.Size(arrangedSize);
rootVisual.Scale({ scale, z });
rootVisual.Scale({ scale, 1.0f });
ranjeshj marked this conversation as resolved.
Show resolved Hide resolved
return finalSize;
}
else
Expand Down
36 changes: 26 additions & 10 deletions dev/ComboBox/ComboBox_themeresources.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@
xmlns:contract5Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,5)"
xmlns:contract5NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,5)"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Microsoft.UI.Xaml.Controls"
xmlns:animatedVisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
xmlns:primitives="using:Microsoft.UI.Xaml.Controls.Primitives">
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Default">
Expand Down Expand Up @@ -357,7 +359,7 @@
<Thickness x:Key="ComboBoxDropdownContentMargin">0,4</Thickness>
<Thickness x:Key="ComboBoxTopHeaderMargin">0,0,0,8</Thickness>
<Thickness x:Key="ComboBoxPadding">12,5,0,7</Thickness>
<Thickness x:Key="ComboBoxEditableTextPadding">11,5,32,6</Thickness>
<Thickness x:Key="ComboBoxEditableTextPadding">11,5,38,6</Thickness>

<CornerRadius x:Key="ComboBoxHiglightBorderCornerRadius">7</CornerRadius>
<CornerRadius x:Key="ComboBoxDropDownButtonBackgroundCornerRadius">4</CornerRadius>
Expand Down Expand Up @@ -446,6 +448,9 @@
<contract5Present:DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource ComboBoxPlaceHolderForegroundPointerOver}}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
<VisualState.Setters>
<Setter Target="DropDownGlyph.(local:AnimatedIcon.State)" Value="PointerOver"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
Expand All @@ -463,6 +468,9 @@
<contract5Present:DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource ComboBoxPlaceHolderForegroundPressed}}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
<VisualState.Setters>
<Setter Target="DropDownGlyph.(local:AnimatedIcon.State)" Value="Pressed"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
Expand Down Expand Up @@ -581,7 +589,6 @@
<VisualState.Setters>
<Setter Target="DropDownGlyph.Foreground" Value="{ThemeResource ComboBoxEditableDropDownGlyphForeground}" />
<Setter Target="DropDownOverlay.Background" Value="{ThemeResource ComboBoxFocusedDropDownBackgroundPointerPressed}" />
<Setter Target="DropDownOverlay.Margin" Value="0,2,2,2" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="TextBoxOverlayPointerOver">
Expand All @@ -604,7 +611,7 @@
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="32" />
<ColumnDefinition Width="38" />
beervoley marked this conversation as resolved.
Show resolved Hide resolved
</Grid.ColumnDefinitions>
<ContentPresenter x:Name="HeaderContentPresenter"
Grid.Row="0"
Expand Down Expand Up @@ -691,26 +698,35 @@
Grid.Row="1"
Grid.Column="1"
Background="Transparent"
Margin="-4,4,4,4"
Margin="4,4,4,4"
Visibility="Collapsed"
contract7Present:CornerRadius="{StaticResource ComboBoxDropDownButtonBackgroundCornerRadius}"
contract7NotPresent:CornerRadius="{ThemeResource ControlCornerRadius}"
Width="30"
HorizontalAlignment="Right"
x:Load="False" />
<FontIcon x:Name="DropDownGlyph"
<controls:AnimatedIcon x:Name="DropDownGlyph"
controls:AnimatedIcon.State="Normal"
MinHeight="{ThemeResource ComboBoxMinHeight}"
Grid.Row="1"
Grid.Column="1"
IsHitTestVisible="False"
Margin="0,0,14,0"
Margin="0,0,12,0"
Foreground="{ThemeResource ComboBoxDropDownGlyphForeground}"
FontFamily="{ThemeResource SymbolThemeFontFamily}"
FontSize="12"
Glyph="&#xE0E5;"
HorizontalAlignment="Right"
VerticalAlignment="Center"
AutomationProperties.AccessibilityView="Raw" />
AutomationProperties.AccessibilityView="Raw"
Width="16"
Height="16">
<animatedVisuals:AnimatedChevronDownSmallVisualSource/>
<controls:AnimatedIcon.FallbackIconSource>
<controls:FontIconSource
Foreground="{ThemeResource ComboBoxDropDownGlyphForeground}"
FontFamily="{ThemeResource SymbolThemeFontFamily}"
FontSize="12"
Glyph="&#xE0E5;"/>
</controls:AnimatedIcon.FallbackIconSource>
</controls:AnimatedIcon>
<contract7Present:ContentPresenter x:Name="DescriptionPresenter"
Grid.Row="2"
Grid.Column="0"
Expand Down
55 changes: 44 additions & 11 deletions test/MUXControlsTestApp/verification/ComboBox-4.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
CornerRadius=0,0,0,0
Expand All @@ -25,7 +25,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Controls.Border]
Padding=0,0,0,0
CornerRadius=4,4,4,4
Expand All @@ -39,7 +39,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=72,40
RenderSize=78,40
[Windows.UI.Xaml.Controls.Border]
Padding=0,0,0,0
CornerRadius=4,4,4,4
Expand All @@ -54,7 +54,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Shapes.Rectangle]
StrokeThickness=1
Width=3
Expand Down Expand Up @@ -93,17 +93,19 @@
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=20,20
[Windows.UI.Xaml.Controls.FontIcon]
[Microsoft.UI.Xaml.Controls.AnimatedIcon]
Foreground=#9E000000
Width=16
Name=DropDownGlyph
MinHeight=32
Margin=0,0,14,0
Margin=0,0,12,0
Height=16
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,32
RenderSize=16,32
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
CornerRadius=0,0,0,0
Expand All @@ -116,17 +118,48 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,32
[Windows.UI.Xaml.Controls.TextBlock]
Padding=0,0,0,0
RenderSize=16,32
[Windows.UI.Xaml.Shapes.Path]
StrokeThickness=1
Margin=0,0,0,0
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Collapsed
RenderSize=0,0
[Windows.UI.Xaml.Controls.FontIcon]
Foreground=#9E000000
Margin=0,0,0,0
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,12
RenderSize=16,32
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=[NULL]
Background=#00000000
Margin=0,0,0,0
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=16,32
[Windows.UI.Xaml.Controls.TextBlock]
Padding=0,0,0,0
Foreground=#9E000000
Margin=0,0,0,0
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=16,12
[Windows.UI.Xaml.Controls.Primitives.Popup]
Name=Popup
Margin=0,0,0,0
Expand Down
33 changes: 17 additions & 16 deletions test/MUXControlsTestApp/verification/ComboBox-7.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
CornerRadius=0,0,0,0
Expand All @@ -25,7 +25,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Controls.Border]
Padding=0,0,0,0
CornerRadius=7,7,7,7
Expand All @@ -39,7 +39,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=72,40
RenderSize=78,40
[Windows.UI.Xaml.Controls.Border]
Padding=0,0,0,0
CornerRadius=4,4,4,4
Expand All @@ -54,7 +54,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,32
RenderSize=70,32
[Windows.UI.Xaml.Shapes.Rectangle]
StrokeThickness=1
Width=3
Expand Down Expand Up @@ -94,7 +94,7 @@
Visibility=Visible
RenderSize=20,19
[Windows.UI.Xaml.Controls.TextBox]
Padding=11,5,32,6
Padding=11,5,38,6
Foreground=#9E000000
BorderThickness=1,1,1,1
BorderBrush=#00FFFFFF
Expand All @@ -116,24 +116,26 @@
Background=#00FFFFFF
Width=30
Name=DropDownOverlay
Margin=-4,4,4,4
Margin=4,4,4,4
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Collapsed
RenderSize=0,0
[Windows.UI.Xaml.Controls.FontIcon]
[Microsoft.UI.Xaml.Controls.AnimatedIcon]
Foreground=#9E000000
Width=16
Name=DropDownGlyph
MinHeight=32
Margin=0,0,14,0
Margin=0,0,12,0
Height=16
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,32
RenderSize=16,32
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
CornerRadius=0,0,0,0
Expand All @@ -146,17 +148,16 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,32
[Windows.UI.Xaml.Controls.TextBlock]
Padding=0,0,0,0
Foreground=#9E000000
RenderSize=0,0
[Windows.UI.Xaml.Shapes.Path]
StrokeThickness=1
Margin=0,0,0,0
FocusVisualSecondaryThickness=1,1,1,1
FocusVisualSecondaryBrush=#B3FFFFFF
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=12,12
Visibility=Collapsed
RenderSize=0,0
[Windows.UI.Xaml.Controls.ContentPresenter]
Foreground=#99000000
Padding=0,0,0,0
Expand All @@ -171,7 +172,7 @@
FocusVisualPrimaryThickness=2,2,2,2
FocusVisualPrimaryBrush=#E4000000
Visibility=Visible
RenderSize=64,0
RenderSize=70,0
[Windows.UI.Xaml.Controls.Primitives.Popup]
Name=Popup
Margin=0,0,0,0
Expand Down