tsai
/
Avalonia
mirror of https://github.com/AvaloniaUI/Avalonia.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #4209 from maxkatz6/fixes/fluent-update-combobox-style 

Update ComboBox selected and focus styles with ContentAlignment props
pull/4236/head
danwalmsley 6 years ago
committed by GitHub
parent
cb2038c211 c24c01e186
commit
ac1a90b528
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 228 additions and 113 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 31
      src/Avalonia.Controls/ComboBox.cs
  2. 1
      src/Avalonia.Controls/Presenters/ContentPresenter.cs
  3. 40
      src/Avalonia.Themes.Default/ComboBox.xaml
  4. 199
      src/Avalonia.Themes.Fluent/ComboBox.xaml
  5. 70
      src/Avalonia.Themes.Fluent/ComboBoxItem.xaml

31
src/Avalonia.Controls/ComboBox.cs
View File

@ -7,6 +7,7 @@ using Avalonia.Controls.Shapes;
using Avalonia.Controls.Templates; using Avalonia.Controls.Templates;
using Avalonia.Input; using Avalonia.Input;
using Avalonia.Interactivity; using Avalonia.Interactivity;
using Avalonia.Layout;
using Avalonia.LogicalTree; using Avalonia.LogicalTree;
using Avalonia.Media; using Avalonia.Media;
using Avalonia.VisualTree; using Avalonia.VisualTree;
@ -63,6 +64,18 @@ namespace Avalonia.Controls
public static readonly StyledProperty<IBrush> PlaceholderForegroundProperty = public static readonly StyledProperty<IBrush> PlaceholderForegroundProperty =
AvaloniaProperty.Register<ComboBox, IBrush>(nameof(PlaceholderForeground)); AvaloniaProperty.Register<ComboBox, IBrush>(nameof(PlaceholderForeground));
/// <summary>
/// Defines the <see cref="HorizontalContentAlignment"/> property.
/// </summary>
public static readonly StyledProperty<HorizontalAlignment> HorizontalContentAlignmentProperty =
ContentControl.HorizontalContentAlignmentProperty.AddOwner<ComboBox>();
/// <summary>
/// Defines the <see cref="VerticalContentAlignment"/> property.
/// </summary>
public static readonly StyledProperty<VerticalAlignment> VerticalContentAlignmentProperty =
ContentControl.VerticalContentAlignmentProperty.AddOwner<ComboBox>();
private bool _isDropDownOpen; private bool _isDropDownOpen;
private Popup _popup; private Popup _popup;
private object _selectionBoxItem; private object _selectionBoxItem;
@ -133,6 +146,24 @@ namespace Avalonia.Controls
set { SetValue(VirtualizationModeProperty, value); } set { SetValue(VirtualizationModeProperty, value); }
} }
/// <summary>
/// Gets or sets the horizontal alignment of the content within the control.
/// </summary>
public HorizontalAlignment HorizontalContentAlignment
{
get { return GetValue(HorizontalContentAlignmentProperty); }
set { SetValue(HorizontalContentAlignmentProperty, value); }
}
/// <summary>
/// Gets or sets the vertical alignment of the content within the control.
/// </summary>
public VerticalAlignment VerticalContentAlignment
{
get { return GetValue(VerticalContentAlignmentProperty); }
set { SetValue(VerticalContentAlignmentProperty, value); }
}
/// <inheritdoc/> /// <inheritdoc/>
protected override IItemContainerGenerator CreateItemContainerGenerator() protected override IItemContainerGenerator CreateItemContainerGenerator()
{ {

1
src/Avalonia.Controls/Presenters/ContentPresenter.cs
View File

@ -95,6 +95,7 @@ namespace Avalonia.Controls.Presenters
static ContentPresenter() static ContentPresenter()
{ {
AffectsRender<ContentPresenter>(BackgroundProperty, BorderBrushProperty, BorderThicknessProperty, CornerRadiusProperty); AffectsRender<ContentPresenter>(BackgroundProperty, BorderBrushProperty, BorderThicknessProperty, CornerRadiusProperty);
AffectsArrange<ContentPresenter>(HorizontalContentAlignmentProperty, VerticalContentAlignmentProperty);
AffectsMeasure<ContentPresenter>(BorderThicknessProperty, PaddingProperty); AffectsMeasure<ContentPresenter>(BorderThicknessProperty, PaddingProperty);
ContentProperty.Changed.AddClassHandler<ContentPresenter>((x, e) => x.ContentChanged(e)); ContentProperty.Changed.AddClassHandler<ContentPresenter>((x, e) => x.ContentChanged(e));
ContentTemplateProperty.Changed.AddClassHandler<ContentPresenter>((x, e) => x.ContentChanged(e)); ContentTemplateProperty.Changed.AddClassHandler<ContentPresenter>((x, e) => x.ContentChanged(e));

40
src/Avalonia.Themes.Default/ComboBox.xaml
View File

@ -1,10 +1,29 @@
<Styles xmlns="https://github.com/avaloniaui"> <Styles xmlns="https://github.com/avaloniaui">
<Design.PreviewWith>
<Border Padding="20">
<StackPanel Spacing="10">
<ComboBox PlaceholderText="Select an item">
<ComboBoxItem>Item 1</ComboBoxItem>
<ComboBoxItem>Item 2</ComboBoxItem>
</ComboBox>
<ComboBox IsEnabled="False"
Width="200"
SelectedIndex="1"
HorizontalContentAlignment="Center">
<ComboBoxItem>Item 1</ComboBoxItem>
<ComboBoxItem>Item 2</ComboBoxItem>
</ComboBox>
</StackPanel>
</Border>
</Design.PreviewWith>
<Style Selector="ComboBox"> <Style Selector="ComboBox">
<Setter Property="Background" Value="Transparent"/> <Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderMidBrush}"/> <Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderMidBrush}" />
<Setter Property="BorderThickness" Value="{DynamicResource ThemeBorderThickness}"/> <Setter Property="BorderThickness" Value="{DynamicResource ThemeBorderThickness}" />
<Setter Property="Padding" Value="4"/> <Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="MinHeight" Value="20"/> <Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Padding" Value="4" />
<Setter Property="MinHeight" Value="20" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border Name="border" <Border Name="border"
@ -15,8 +34,8 @@
<ContentControl Content="{TemplateBinding SelectionBoxItem}" <ContentControl Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding ItemTemplate}" ContentTemplate="{TemplateBinding ItemTemplate}"
Margin="{TemplateBinding Padding}" Margin="{TemplateBinding Padding}"
HorizontalAlignment="Left" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
VerticalAlignment="Center"/> HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
<ToggleButton Name="toggle" <ToggleButton Name="toggle"
BorderThickness="0" BorderThickness="0"
Background="Transparent" Background="Transparent"
@ -30,7 +49,7 @@
Stretch="Uniform" Stretch="Uniform"
HorizontalAlignment="Center" HorizontalAlignment="Center"
VerticalAlignment="Center" VerticalAlignment="Center"
Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z"/> Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z" />
</ToggleButton> </ToggleButton>
<Popup Name="PART_Popup" <Popup Name="PART_Popup"
IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}" IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
@ -45,8 +64,7 @@
Items="{TemplateBinding Items}" Items="{TemplateBinding Items}"
ItemsPanel="{TemplateBinding ItemsPanel}" ItemsPanel="{TemplateBinding ItemsPanel}"
ItemTemplate="{TemplateBinding ItemTemplate}" ItemTemplate="{TemplateBinding ItemTemplate}"
VirtualizationMode="{TemplateBinding VirtualizationMode}" VirtualizationMode="{TemplateBinding VirtualizationMode}" />
/>
</ScrollViewer> </ScrollViewer>
</Border> </Border>
</Popup> </Popup>
@ -56,7 +74,7 @@
</Setter> </Setter>
</Style> </Style>
<Style Selector="ComboBox:pointerover /template/ Border#border"> <Style Selector="ComboBox:pointerover /template/ Border#border">
<Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderHighBrush}"/> <Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderHighBrush}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ Border#border"> <Style Selector="ComboBox:disabled /template/ Border#border">
<Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" /> <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />

199
src/Avalonia.Themes.Fluent/ComboBox.xaml
View File

@ -1,4 +1,5 @@
<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Styles xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Design.PreviewWith> <Design.PreviewWith>
<Border Padding="20"> <Border Padding="20">
<StackPanel Spacing="10"> <StackPanel Spacing="10">
@ -6,8 +7,10 @@
<ComboBoxItem>Item 1</ComboBoxItem> <ComboBoxItem>Item 1</ComboBoxItem>
<ComboBoxItem>Item 2</ComboBoxItem> <ComboBoxItem>Item 2</ComboBoxItem>
</ComboBox> </ComboBox>
<ComboBox IsEnabled="False"
<ComboBox IsEnabled="False"> Width="200"
SelectedIndex="1"
HorizontalContentAlignment="Center">
<ComboBoxItem>Item 1</ComboBoxItem> <ComboBoxItem>Item 1</ComboBoxItem>
<ComboBoxItem>Item 2</ComboBoxItem> <ComboBoxItem>Item 2</ComboBoxItem>
</ComboBox> </ComboBox>
@ -25,6 +28,7 @@
</Styles.Resources> </Styles.Resources>
<Style Selector="ComboBox"> <Style Selector="ComboBox">
<Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" /> <Setter Property="Padding" Value="{DynamicResource ComboBoxPadding}" />
<Setter Property="FocusAdorner" Value="{x:Null}" />
<Setter Property="MaxDropDownHeight" Value="504" /> <Setter Property="MaxDropDownHeight" Value="504" />
<Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" /> <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
<Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" /> <Setter Property="Background" Value="{DynamicResource ComboBoxBackground}" />
@ -32,6 +36,8 @@
<Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" /> <Setter Property="BorderThickness" Value="{DynamicResource ComboBoxBorderThemeThickness}" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" /> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" /> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Top" /> <Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" /> <Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
@ -39,70 +45,76 @@
<Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" /> <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Grid RowDefinitions="Auto, *, Auto" ColumnDefinitions="*,32"> <Grid RowDefinitions="Auto, *, Auto"
ColumnDefinitions="*,32">
<ContentPresenter x:Name="HeaderContentPresenter" <ContentPresenter x:Name="HeaderContentPresenter"
Grid.Row="0" Grid.Row="0"
Grid.Column="0" Grid.Column="0"
Grid.ColumnSpan="2" Grid.ColumnSpan="2"
TextBlock.FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}" TextBlock.FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
Margin="{DynamicResource ComboBoxTopHeaderMargin}" Margin="{DynamicResource ComboBoxTopHeaderMargin}"
VerticalAlignment="Top" /> VerticalAlignment="Top" />
<Border x:Name="Background" <Border x:Name="Background"
Grid.Row="1" Grid.Row="1"
Grid.Column="0" Grid.Column="0"
Grid.ColumnSpan="2" Grid.ColumnSpan="2"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{DynamicResource ControlCornerRadius}" CornerRadius="{DynamicResource ControlCornerRadius}"
MinWidth="{DynamicResource ComboBoxThemeMinWidth}" /> MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
<Border x:Name="HighlightBackground" <Border x:Name="HighlightBackground"
Grid.Row="1" Grid.Row="1"
Grid.Column="0" Grid.Column="0"
Grid.ColumnSpan="2" Grid.ColumnSpan="2"
Background="{DynamicResource ComboBoxBackgroundUnfocused}" Background="{DynamicResource ComboBoxBackgroundUnfocused}"
BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}" BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{DynamicResource ControlCornerRadius}" CornerRadius="{DynamicResource ControlCornerRadius}" />
Opacity="0" /> <TextBlock x:Name="PlaceholderTextBlock"
<TextBlock x:Name="PlaceholderTextBlock" Grid.Row="1"
Grid.Row="1" Grid.Column="0"
Grid.Column="0" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
HorizontalAlignment="Left" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
VerticalAlignment="Center" Margin="{TemplateBinding Padding}"
Margin="{TemplateBinding Padding}" Text="{TemplateBinding PlaceholderText}"
Foreground="{TemplateBinding PlaceholderForeground}" IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
Text="{TemplateBinding PlaceholderText}" IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}"/>
<ContentControl x:Name="ContentPresenter" <ContentControl x:Name="ContentPresenter"
Content="{TemplateBinding SelectionBoxItem}" Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding ItemTemplate}" ContentTemplate="{TemplateBinding ItemTemplate}"
Grid.Row="1" Grid.Row="1"
Grid.Column="0" Grid.Column="0"
Margin="{TemplateBinding Padding}" Margin="{TemplateBinding Padding}"
HorizontalAlignment="Left" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="Center"> VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
</ContentControl>
<Border x:Name="DropDownOverlay" <Border x:Name="DropDownOverlay"
Grid.Row="1" Grid.Row="1"
Grid.Column="1" Grid.Column="1"
Background="Transparent" Background="Transparent"
Margin="0,1,1,1" Margin="0,1,1,1"
Width="30" IsVisible="False" Width="30"
HorizontalAlignment="Right" /> IsVisible="False"
HorizontalAlignment="Right" />
<Viewbox UseLayoutRounding="False" <Viewbox UseLayoutRounding="False"
MinHeight="{DynamicResource ComboBoxMinHeight}" MinHeight="{DynamicResource ComboBoxMinHeight}"
Grid.Row="1" Grid.Row="1"
Grid.Column="1" Grid.Column="1"
IsHitTestVisible="False" IsHitTestVisible="False"
Margin="0,0,10,0" Height="12" Width="12" Margin="0,0,10,0"
HorizontalAlignment="Right" Height="12"
VerticalAlignment="Center"> Width="12"
HorizontalAlignment="Right"
VerticalAlignment="Center">
<Panel> <Panel>
<Panel Height="12" Width="12" /> <Panel Height="12"
<Path x:Name="DropDownGlyph" Stretch="Uniform" VerticalAlignment="Center" Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" /> Width="12" />
<Path x:Name="DropDownGlyph"
Stretch="Uniform"
VerticalAlignment="Center"
Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
</Panel> </Panel>
</Viewbox> </Viewbox>
<Popup Name="PART_Popup" <Popup Name="PART_Popup"
@ -114,20 +126,19 @@
StaysOpen="False"> StaysOpen="False">
<Border x:Name="PopupBorder" <Border x:Name="PopupBorder"
Background="{DynamicResource ComboBoxDropDownBackground}" Background="{DynamicResource ComboBoxDropDownBackground}"
BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}" BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}" BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
Margin="0,-1,0,-1" Margin="0,-1,0,-1"
Padding="{DynamicResource ComboBoxDropdownBorderPadding}" Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
HorizontalAlignment="Stretch" HorizontalAlignment="Stretch"
CornerRadius="{DynamicResource OverlayCornerRadius}"> CornerRadius="{DynamicResource OverlayCornerRadius}">
<ScrollViewer> <ScrollViewer>
<ItemsPresenter Name="PART_ItemsPresenter" <ItemsPresenter Name="PART_ItemsPresenter"
Items="{TemplateBinding Items}" Items="{TemplateBinding Items}"
Margin="{DynamicResource ComboBoxDropdownContentMargin}" Margin="{DynamicResource ComboBoxDropdownContentMargin}"
ItemsPanel="{TemplateBinding ItemsPanel}" ItemsPanel="{TemplateBinding ItemsPanel}"
ItemTemplate="{TemplateBinding ItemTemplate}" ItemTemplate="{TemplateBinding ItemTemplate}"
VirtualizationMode="{TemplateBinding VirtualizationMode}" VirtualizationMode="{TemplateBinding VirtualizationMode}" />
/>
</ScrollViewer> </ScrollViewer>
</Border> </Border>
</Popup> </Popup>
@ -136,57 +147,81 @@
</Setter> </Setter>
</Style> </Style>
<!-- NormalState --> <!-- NormalState -->
<Style Selector="ComboBox /template/ TextBlock#PlaceholderTextBlock"> <Style Selector="ComboBox /template/ TextBlock#PlaceholderTextBlock">
<Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}"/> <Setter Property="Foreground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
</Style>
<Style Selector="ComboBox /template/ Border#HighlightBackground">
<Setter Property="IsVisible" Value="False" />
</Style> </Style>
<Style Selector="ComboBox /template/ Path#DropDownGlyph"> <Style Selector="ComboBox /template/ Path#DropDownGlyph">
<Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForeground}"/> <Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
</Style> </Style>
<!-- PointerOver State --> <!-- PointerOver State -->
<Style Selector="ComboBox:pointerover /template/ Border#Background"> <Style Selector="ComboBox:pointerover /template/ Border#Background">
<Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" /> <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPointerOver}" />
</Style> </Style>
<!-- Pressed State --> <!-- Pressed State -->
<Style Selector="ComboBox:pressed /template/ Border#Background"> <Style Selector="ComboBox:pressed /template/ Border#Background">
<Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" /> <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushPressed}" />
</Style> </Style>
<!-- Disabled State --> <!-- Disabled State -->
<Style Selector="ComboBox:disabled /template/ Border#Background"> <Style Selector="ComboBox:disabled /template/ Border#Background">
<Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxBackgroundDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" /> <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrushDisabled}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ ContentPresenter#HeaderContentPresenter"> <Style Selector="ComboBox:disabled /template/ ContentPresenter#HeaderContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}"/> <Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ ContentControl#ContentPresenter"> <Style Selector="ComboBox:disabled /template/ ContentControl#ContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}"/> <Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ TextBlock#PlaceholderTextBlock"> <Style Selector="ComboBox:disabled /template/ TextBlock#PlaceholderTextBlock">
<Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}"/> <Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ TextBlock#PlaceholderTextBlock"> <Style Selector="ComboBox:disabled /template/ Path#DropDownGlyph">
<Setter Property="Foreground" Value="{DynamicResource ComboBoxForegroundDisabled}"/> <Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}" />
</Style> </Style>
<Style Selector="ComboBox:disabled /template/ Path#DropDownGlyph"> <!-- Focused State -->
<Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForegroundDisabled}"/> <Style Selector="ComboBox:focus-visible /template/ Border#HighlightBackground">
<Setter Property="IsVisible" Value="True" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBackgroundBorderBrushFocused}" />
</Style> </Style>
<!-- Focused State --> <Style Selector="ComboBox:focus-visible /template/ ContentControl#ContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
</Style>
<!-- Focus Pressed State --> <Style Selector="ComboBox:focus-visible /template/ TextBlock#PlaceholderTextBlock">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundFocused}" />
</Style>
<!-- Unfocused State --> <Style Selector="ComboBox:focus-visible /template/ Path#DropDownGlyph">
<Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocused}" />
</Style>
<!-- Focus Pressed State -->
<Style Selector="ComboBox:focused:pressed /template/ ContentControl#ContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxForegroundFocusedPressed}" />
</Style>
<Style Selector="ComboBox:focused:pressed /template/ TextBlock#PlaceholderTextBlock">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxPlaceHolderForegroundFocusedPressed}" />
</Style>
<Style Selector="ComboBox:focused:pressed /template/ Path#DropDownGlyph">
<Setter Property="Fill" Value="{DynamicResource ComboBoxDropDownGlyphForegroundFocusedPressed}" />
</Style>
</Styles> </Styles>

70
src/Avalonia.Themes.Fluent/ComboBoxItem.xaml
View File

@ -1,17 +1,19 @@
<Styles xmlns="https://github.com/avaloniaui"> <Styles xmlns="https://github.com/avaloniaui">
<Design.PreviewWith> <Design.PreviewWith>
<Border Padding="20"> <Border Padding="20">
<StackPanel Spacing="10"> <Border Background="{DynamicResource ComboBoxDropDownBackground}"
<ComboBox> BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
Margin="0,-1,0,-1"
Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
CornerRadius="{DynamicResource OverlayCornerRadius}">
<StackPanel HorizontalAlignment="Stretch">
<ComboBoxItem>Item 1</ComboBoxItem> <ComboBoxItem>Item 1</ComboBoxItem>
<ComboBoxItem>Item 2</ComboBoxItem> <ComboBoxItem>Item 2 long</ComboBoxItem>
</ComboBox> <ComboBoxItem IsSelected="True">Item 3</ComboBoxItem>
<ComboBoxItem IsEnabled="False">Item 4</ComboBoxItem>
<ComboBox IsEnabled="False"> </StackPanel>
<ComboBoxItem>Item 1</ComboBoxItem> </Border>
<ComboBoxItem>Item 2</ComboBoxItem>
</ComboBox>
</StackPanel>
</Border> </Border>
</Design.PreviewWith> </Design.PreviewWith>
@ -19,12 +21,11 @@
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForeground}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForeground}" />
<Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" /> <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackground}" />
<Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" /> <Setter Property="Padding" Value="{DynamicResource ComboBoxItemThemePadding}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemRevealBorderBrush}" />
<Setter Property="BorderThickness" Value="{DynamicResource ComboBoxItemRevealBorderThemeThickness}" />
<Setter Property="HorizontalContentAlignment" Value="Stretch" /> <Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<ContentPresenter Name="PART_ContentPresenter" <ContentPresenter Name="PART_ContentPresenter"
TextBlock.Foreground="{TemplateBinding Foreground}"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness}"
@ -32,28 +33,57 @@
Content="{TemplateBinding Content}" Content="{TemplateBinding Content}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Padding="{TemplateBinding Padding}"/> Padding="{TemplateBinding Padding}" />
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
</Style> </Style>
<!-- PointerOver state -->
<Style Selector="ComboBoxItem:pointerover /template/ ContentPresenter"> <Style Selector="ComboBoxItem:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ThemeControlHighlightMidBrush}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPointerOver}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundPointerOver}" />
</Style>
<!-- Disabled state -->
<Style Selector="ComboBoxItem:disabled /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushDisabled}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundDisabled}" />
</Style>
<!-- Pressed state -->
<Style Selector="ComboBoxItem:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundPressed}" />
</Style> </Style>
<!-- Selected state -->
<Style Selector="ComboBoxItem:selected /template/ ContentPresenter"> <Style Selector="ComboBoxItem:selected /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ThemeAccentBrush4}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelected}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelected}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundSelected}" />
</Style> </Style>
<Style Selector="ComboBoxItem:selected:focus /template/ ContentPresenter"> <!-- Selected Disabled state -->
<Setter Property="Background" Value="{DynamicResource ThemeAccentBrush3}"/> <Style Selector="ComboBoxItem:selected:disabled /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedDisabled}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedDisabled}" />
</Style> </Style>
<!-- Selected PointerOver state -->
<Style Selector="ComboBoxItem:selected:pointerover /template/ ContentPresenter"> <Style Selector="ComboBoxItem:selected:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ThemeAccentBrush3}"/> <Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPointerOver}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPointerOver}" />
</Style> </Style>
<Style Selector="ComboBoxItem:selected:focus:pointerover /template/ ContentPresenter"> <!-- Selected Pressed state -->
<Setter Property="Background" Value="{DynamicResource ThemeAccentBrush2}"/> <Style Selector="ComboBoxItem:selected:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ComboBoxItemBackgroundSelectedPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource ComboBoxItemBorderBrushSelectedPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource ComboBoxItemForegroundSelectedPressed}" />
</Style> </Style>
</Styles> </Styles>

Write Preview
Loading…
Cancel
Save