feat(controls): Add placeholder support to ComboBox

src/Wpf.Ui.Gallery/Views/Pages/BasicInput/ComboBoxPage.xaml

@@ -58,9 +58,21 @@
             <ComboBox
                 MinWidth="200"
                 HorizontalAlignment="Left"
+                ui:ComboBoxHelper.Placeholder="Placeholder text"
                 IsEditable="True"
                 ItemsSource="{Binding ViewModel.ComboBoxFontSizes, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:ComboBoxPage}, Mode=OneWay}"
                 SelectedIndex="0" />
         </controls:ControlExample>
+
+        <controls:ControlExample
+            Margin="0,32,0,0"
+            HeaderText="A ComboBox with a placeholder."
+            XamlCode="&lt;ComboBox ui:ComboBoxHelper.Placeholder=&quot;Placeholder text&quot; /&gt;">
+            <ComboBox
+                MinWidth="200"
+                HorizontalAlignment="Left"
+                ui:ComboBoxHelper.Placeholder="Placeholder text"
+                IsEnabled="False" />
+        </controls:ControlExample>
     </StackPanel>
 </Page>

src/Wpf.Ui/Controls/ComboBox/ComboBox.xaml

@@ -14,8 +14,11 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:controls="clr-namespace:Wpf.Ui.Controls"
+    xmlns:converters="clr-namespace:Wpf.Ui.Converters"
     xmlns:system="clr-namespace:System;assembly=System.Runtime">
 
+    <converters:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
+
     <Thickness x:Key="ComboBoxPadding">10,8,10,8</Thickness>
     <Thickness x:Key="ComboBoxBorderThemeThickness">1,1,1,1</Thickness>
     <Thickness x:Key="ComboBoxAccentBorderThemeThickness">0,0,0,2</Thickness>
@@ -181,10 +184,10 @@
                         <Border
                             x:Name="ContentBorder"
                             Grid.Row="0"
-                            MinWidth="{TemplateBinding MinWidth}"
-                            MinHeight="{TemplateBinding MinHeight}"                            
                             Width="{TemplateBinding Width}"
                             Height="{TemplateBinding Height}"
+                            MinWidth="{TemplateBinding MinWidth}"
+                            MinHeight="{TemplateBinding MinHeight}"
                             Padding="0"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
@@ -204,6 +207,16 @@
                                         <ColumnDefinition Width="Auto" />
                                     </Grid.ColumnDefinitions>
                                     <Grid Grid.Column="0" Margin="{TemplateBinding Padding}">
+                                        <ContentPresenter
+                                            Name="PART_Placeholder"
+                                            HorizontalAlignment="Stretch"
+                                            VerticalAlignment="Stretch"
+                                            Content="{TemplateBinding controls:ComboBoxHelper.Placeholder}"
+                                            IsHitTestVisible="False"
+                                            TextElement.Foreground="{TemplateBinding Foreground}"
+                                            Visibility="{TemplateBinding SelectionBoxItem,
+                                                                         Converter={StaticResource NullToVisibilityConverter},
+                                                                         ConverterParameter=invert}" />
                                         <ContentPresenter
                                             Name="PART_ContentPresenter"
                                             HorizontalAlignment="Stretch"
@@ -271,6 +284,7 @@
                                         BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
                                         BorderThickness="1"
                                         CornerRadius="{DynamicResource PopupCornerRadius}"
+                                        IsHitTestVisible="False"
                                         SnapsToDevicePixels="True">
                                         <Border.RenderTransform>
                                             <TranslateTransform />
@@ -315,6 +329,10 @@
                                             From="0"
                                             To="180"
                                             Duration="00:00:00.167" />
+                                        <BooleanAnimationUsingKeyFrames Storyboard.TargetName="DropDownBorder" Storyboard.TargetProperty="IsHitTestVisible">
+                                            <DiscreteBooleanKeyFrame KeyTime="0:0:0" Value="False" />
+                                            <DiscreteBooleanKeyFrame KeyTime="00:00:00.167" Value="True" />
+                                        </BooleanAnimationUsingKeyFrames>
                                         <DoubleAnimation
                                             Storyboard.TargetName="DropDownBorder"
                                             Storyboard.TargetProperty="(Border.RenderTransform).(TranslateTransform.Y)"

src/Wpf.Ui/Controls/ComboBoxHelper.cs

@@ -0,0 +1,25 @@
+// This Source Code Form is subject to the terms of the MIT License.
+// If a copy of the MIT was not distributed with this file, You can obtain one at https://opensource.org/licenses/MIT.
+// Copyright (C) Leszek Pomianowski and WPF UI Contributors.
+// All Rights Reserved.
+
+using System.Windows.Controls;
+
+namespace Wpf.Ui.Controls;
+
+/// <summary>
+/// Used to extend the stock WPF ComboBox control. 
+/// </summary>
+public static class ComboBoxHelper
+{
+    public static readonly DependencyProperty PlaceholderProperty =
+        DependencyProperty.RegisterAttached(
+            "Placeholder",
+            typeof(object),
+            typeof(ComboBoxHelper),
+            new PropertyMetadata(null));
+
+    public static object GetPlaceholder(ComboBox control) => control.GetValue(PlaceholderProperty);
+
+    public static void SetPlaceholder(ComboBox control, object value) => control.SetValue(PlaceholderProperty, value);
+}

src/Wpf.Ui/Converters/NullToVisibilityConverter.cs

@@ -3,6 +3,7 @@
 // Copyright (C) Leszek Pomianowski and WPF UI Contributors.
 // All Rights Reserved.
 
+using System.Windows;
 using System.Windows.Data;
 
 namespace Wpf.Ui.Converters;
@@ -11,7 +12,25 @@ internal class NullToVisibilityConverter : IValueConverter
 {
     public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
     {
-        return value is null ? Visibility.Collapsed : Visibility.Visible;
+        if (value is string str)
+        {
+            value = string.IsNullOrEmpty(str);
+        }
+        else if (value == null)
+        {
+            value = true;
+        }
+        else
+        {
+            value = false;
+        }
+
+        if (parameter is "invert")
+        {
+            return (bool)value ? Visibility.Visible : Visibility.Collapsed;
+        }
+
+        return (bool)value ? Visibility.Collapsed : Visibility.Visible;
     }
 
     public object ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)