Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>You should swap the style definition of the msdn sample</p> <pre><code>&lt;Style x:Key="{x:Type ComboBox}" TargetType="{x:Type ComboBox}"&gt; </code></pre> <p>with the following one</p> <pre><code>&lt;Style x:Key="MyComboBox" TargetType="{x:Type ComboBox}"&gt; </code></pre> <p>then explicitly assign the style to your comboboxes in the following way</p> <pre><code>&lt;ComboBox Style="{StaticResource MyComboBox}" /&gt; </code></pre> <p><a href="http://msdn.microsoft.com/en-us/library/ms742804.aspx" rel="nofollow noreferrer">x:Key Directive</a></p> <blockquote> <p>The attribute value of x:Key can be any string defined in the XamlName Grammar or can be an object evaluated through a markup extension.</p> </blockquote> <p>The way the style is defined in msdn sample illustrates how to override the default style for comboboxes, to explicitly specify a style use a string instead of the markup extension to specify the style in ComboBox Resources.</p> <p>EDIT</p> <p>The same should be done for ComboBoxItems style so swap the code</p> <pre><code>&lt;Style x:Key="{x:Type ComboBoxItem}" TargetType="{x:Type ComboBoxItem}"&gt; </code></pre> <p>with the code</p> <pre><code>&lt;Style x:Key="MyComboBox" TargetType="{x:Type ComboBox}"&gt; </code></pre> <p>and also add in the code for the ComboBox style the following directive</p> <pre><code>&lt;Setter Property="ItemContainerStyle" Value="{StaticResource MyComboxItem}"/&gt; </code></pre> <p>here is a brief example of how to have the styled combo box and another one with the default style in the same window.</p> <p>XAML</p> <pre><code>&lt;Window x:Class="WpfComboTemplate.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:coll="clr-namespace:System.Collections.ObjectModel;assembly=System" Title="MainWindow" Height="350" Width="525"&gt; &lt;Window.Resources&gt; &lt;!--Control colors.--&gt; &lt;Color x:Key="WindowColor"&gt;#FFE8EDF9&lt;/Color&gt; &lt;Color x:Key="ContentAreaColorLight"&gt;#FFC5CBF9&lt;/Color&gt; &lt;Color x:Key="ContentAreaColorDark"&gt;#FF7381F9&lt;/Color&gt; &lt;Color x:Key="DisabledControlLightColor"&gt;#FFE8EDF9&lt;/Color&gt; &lt;Color x:Key="DisabledControlDarkColor"&gt;#FFC5CBF9&lt;/Color&gt; &lt;Color x:Key="DisabledForegroundColor"&gt;#FF888888&lt;/Color&gt; &lt;Color x:Key="SelectedBackgroundColor"&gt;#FFC5CBF9&lt;/Color&gt; &lt;Color x:Key="SelectedUnfocusedColor"&gt;#FFDDDDDD&lt;/Color&gt; &lt;Color x:Key="ControlLightColor"&gt;White&lt;/Color&gt; &lt;Color x:Key="ControlMediumColor"&gt;#FF7381F9&lt;/Color&gt; &lt;Color x:Key="ControlDarkColor"&gt;#FF211AA9&lt;/Color&gt; &lt;Color x:Key="ControlMouseOverColor"&gt;#FF3843C4&lt;/Color&gt; &lt;Color x:Key="ControlPressedColor"&gt;#FF211AA9&lt;/Color&gt; &lt;Color x:Key="GlyphColor"&gt;#FF444444&lt;/Color&gt; &lt;Color x:Key="GlyphMouseOver"&gt;sc#1, 0.004391443, 0.002428215, 0.242281124&lt;/Color&gt; &lt;!--Border colors--&gt; &lt;Color x:Key="BorderLightColor"&gt;#FFCCCCCC&lt;/Color&gt; &lt;Color x:Key="BorderMediumColor"&gt;#FF888888&lt;/Color&gt; &lt;Color x:Key="BorderDarkColor"&gt;#FF444444&lt;/Color&gt; &lt;Color x:Key="PressedBorderLightColor"&gt;#FF888888&lt;/Color&gt; &lt;Color x:Key="PressedBorderDarkColor"&gt;#FF444444&lt;/Color&gt; &lt;Color x:Key="DisabledBorderLightColor"&gt;#FFAAAAAA&lt;/Color&gt; &lt;Color x:Key="DisabledBorderDarkColor"&gt;#FF888888&lt;/Color&gt; &lt;Color x:Key="DefaultBorderBrushDarkColor"&gt;Black&lt;/Color&gt; &lt;!--Control-specific resources.--&gt; &lt;Color x:Key="HeaderTopColor"&gt;#FFC5CBF9&lt;/Color&gt; &lt;Color x:Key="DatagridCurrentCellBorderColor"&gt;Black&lt;/Color&gt; &lt;Color x:Key="SliderTrackDarkColor"&gt;#FFC5CBF9&lt;/Color&gt; &lt;Color x:Key="NavButtonFrameColor"&gt;#FF3843C4&lt;/Color&gt; &lt;LinearGradientBrush x:Key="MenuPopupBrush" EndPoint="0.5,1" StartPoint="0.5,0"&gt; &lt;GradientStop Color="{DynamicResource ControlLightColor}" Offset="0" /&gt; &lt;GradientStop Color="{DynamicResource ControlMediumColor}" Offset="0.5" /&gt; &lt;GradientStop Color="{DynamicResource ControlLightColor}" Offset="1" /&gt; &lt;/LinearGradientBrush&gt; &lt;LinearGradientBrush x:Key="ProgressBarIndicatorAnimatedFill" StartPoint="0,0" EndPoint="1,0"&gt; &lt;LinearGradientBrush.GradientStops&gt; &lt;GradientStopCollection&gt; &lt;GradientStop Color="#000000FF" Offset="0" /&gt; &lt;GradientStop Color="#600000FF" Offset="0.4" /&gt; &lt;GradientStop Color="#600000FF" Offset="0.6" /&gt; &lt;GradientStop Color="#000000FF" Offset="1" /&gt; &lt;/GradientStopCollection&gt; &lt;/LinearGradientBrush.GradientStops&gt; &lt;/LinearGradientBrush&gt; &lt;ControlTemplate x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}"&gt; &lt;Grid&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition /&gt; &lt;ColumnDefinition Width="20" /&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;VisualStateManager.VisualStateGroups&gt; &lt;VisualStateGroup x:Name="CommonStates"&gt; &lt;VisualState x:Name="Normal" /&gt; &lt;VisualState x:Name="MouseOver"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background). (GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Border"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Pressed" /&gt; &lt;VisualState x:Name="Disabled"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background). (GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Border"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlDarkColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill). (SolidColorBrush.Color)" Storyboard.TargetName="Arrow"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush). (GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Border"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledBorderDarkColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="CheckStates"&gt; &lt;VisualState x:Name="Checked"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background). (GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Border"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Unchecked" /&gt; &lt;VisualState x:Name="Indeterminate" /&gt; &lt;/VisualStateGroup&gt; &lt;/VisualStateManager.VisualStateGroups&gt; &lt;Border x:Name="Border" Grid.ColumnSpan="2" CornerRadius="2" BorderThickness="1"&gt; &lt;Border.BorderBrush&gt; &lt;LinearGradientBrush EndPoint="0,1" StartPoint="0,0"&gt; &lt;GradientStop Color="{DynamicResource BorderLightColor}" Offset="0" /&gt; &lt;GradientStop Color="{DynamicResource BorderDarkColor}" Offset="1" /&gt; &lt;/LinearGradientBrush&gt; &lt;/Border.BorderBrush&gt; &lt;Border.Background&gt; &lt;LinearGradientBrush StartPoint="0,0" EndPoint="0,1"&gt; &lt;LinearGradientBrush.GradientStops&gt; &lt;GradientStopCollection&gt; &lt;GradientStop Color="{DynamicResource ControlLightColor}" /&gt; &lt;GradientStop Color="{DynamicResource ControlMediumColor}" Offset="1.0" /&gt; &lt;/GradientStopCollection&gt; &lt;/LinearGradientBrush.GradientStops&gt; &lt;/LinearGradientBrush&gt; &lt;/Border.Background&gt; &lt;/Border&gt; &lt;Border Grid.Column="0" CornerRadius="2,0,0,2" Margin="1" &gt; &lt;Border.Background&gt; &lt;SolidColorBrush Color="{DynamicResource ControlLightColor}"/&gt; &lt;/Border.Background&gt; &lt;/Border&gt; &lt;Path x:Name="Arrow" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 4 4 L 8 0 Z" &gt; &lt;Path.Fill&gt; &lt;SolidColorBrush Color="{DynamicResource GlyphColor}"/&gt; &lt;/Path.Fill&gt; &lt;/Path&gt; &lt;/Grid&gt; &lt;/ControlTemplate&gt; &lt;ControlTemplate x:Key="ComboBoxTextBox" TargetType="{x:Type TextBox}"&gt; &lt;Border x:Name="PART_ContentHost" Focusable="False" Background="{TemplateBinding Background}" /&gt; &lt;/ControlTemplate&gt; &lt;Style x:Key="MyComboxItem" TargetType="{x:Type ComboBoxItem}"&gt; &lt;Setter Property="SnapsToDevicePixels" Value="true" /&gt; &lt;Setter Property="OverridesDefaultStyle" Value="true" /&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="{x:Type ComboBoxItem}"&gt; &lt;Border x:Name="Border" Padding="2" SnapsToDevicePixels="true" Background="Transparent"&gt; &lt;VisualStateManager.VisualStateGroups&gt; &lt;VisualStateGroup x:Name="SelectionStates"&gt; &lt;VisualState x:Name="Unselected" /&gt; &lt;VisualState x:Name="Selected"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background). (SolidColorBrush.Color)"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedBackgroundColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="SelectedUnfocused"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background). (SolidColorBrush.Color)"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedUnfocusedColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;/VisualStateManager.VisualStateGroups&gt; &lt;ContentPresenter /&gt; &lt;/Border&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;Style x:Key="MyComboBox" TargetType="{x:Type ComboBox}"&gt; &lt;Setter Property="SnapsToDevicePixels" Value="true" /&gt; &lt;Setter Property="OverridesDefaultStyle" Value="true" /&gt; &lt;Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" /&gt; &lt;Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" /&gt; &lt;Setter Property="ScrollViewer.CanContentScroll" Value="true" /&gt; &lt;Setter Property="MinWidth" Value="120" /&gt; &lt;Setter Property="MinHeight" Value="20" /&gt; &lt;Setter Property="ItemContainerStyle" Value="{StaticResource MyComboxItem}"/&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="{x:Type ComboBox}"&gt; &lt;Grid&gt; &lt;VisualStateManager.VisualStateGroups&gt; &lt;VisualStateGroup x:Name="CommonStates"&gt; &lt;VisualState x:Name="Normal" /&gt; &lt;VisualState x:Name="MouseOver" /&gt; &lt;VisualState x:Name="Disabled"&gt; &lt;Storyboard&gt; &lt;ColorAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="(TextElement.Foreground). (SolidColorBrush.Color)"&gt; &lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" /&gt; &lt;/ColorAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;/VisualStateGroup&gt; &lt;VisualStateGroup x:Name="EditStates"&gt; &lt;VisualState x:Name="Editable"&gt; &lt;Storyboard&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="PART_EditableTextBox"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}" /&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ContentSite"&gt; &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Hidden}" /&gt; &lt;/ObjectAnimationUsingKeyFrames&gt; &lt;/Storyboard&gt; &lt;/VisualState&gt; &lt;VisualState x:Name="Uneditable" /&gt; &lt;/VisualStateGroup&gt; &lt;/VisualStateManager.VisualStateGroups&gt; &lt;ToggleButton x:Name="ToggleButton" Template="{StaticResource ComboBoxToggleButton}" Grid.Column="2" Focusable="false" ClickMode="Press" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"/&gt; &lt;ContentPresenter x:Name="ContentSite" IsHitTestVisible="False" Content="{TemplateBinding SelectionBoxItem}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" Margin="3,3,23,3" VerticalAlignment="Stretch" HorizontalAlignment="Left"&gt; &lt;/ContentPresenter&gt; &lt;TextBox x:Name="PART_EditableTextBox" Style="{x:Null}" Template="{StaticResource ComboBoxTextBox}" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="3,3,23,3" Focusable="True" Background="Transparent" Visibility="Hidden" IsReadOnly="{TemplateBinding IsReadOnly}" /&gt; &lt;Popup x:Name="Popup" Placement="Bottom" IsOpen="{TemplateBinding IsDropDownOpen}" AllowsTransparency="True" Focusable="False" PopupAnimation="Slide"&gt; &lt;Grid x:Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}"&gt; &lt;Border x:Name="DropDownBorder" BorderThickness="1"&gt; &lt;Border.BorderBrush&gt; &lt;SolidColorBrush Color="{DynamicResource BorderMediumColor}" /&gt; &lt;/Border.BorderBrush&gt; &lt;Border.Background&gt; &lt;SolidColorBrush Color="{DynamicResource ControlLightColor}" /&gt; &lt;/Border.Background&gt; &lt;/Border&gt; &lt;ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True"&gt; &lt;StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" /&gt; &lt;/ScrollViewer&gt; &lt;/Grid&gt; &lt;/Popup&gt; &lt;/Grid&gt; &lt;ControlTemplate.Triggers&gt; &lt;Trigger Property="HasItems" Value="false"&gt; &lt;Setter TargetName="DropDownBorder" Property="MinHeight" Value="95" /&gt; &lt;/Trigger&gt; &lt;Trigger Property="IsGrouping" Value="true"&gt; &lt;Setter Property="ScrollViewer.CanContentScroll" Value="false" /&gt; &lt;/Trigger&gt; &lt;Trigger SourceName="Popup" Property="AllowsTransparency" Value="true"&gt; &lt;Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4" /&gt; &lt;Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0" /&gt; &lt;/Trigger&gt; &lt;/ControlTemplate.Triggers&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;Grid.RowDefinitions&gt; &lt;RowDefinition Height="*"/&gt; &lt;RowDefinition Height="*"/&gt; &lt;/Grid.RowDefinitions&gt; &lt;ComboBox VerticalAlignment="Top" ItemsSource="{Binding}"&gt; &lt;/ComboBox&gt; &lt;ComboBox VerticalAlignment="Top" Grid.Row="1" Style="{StaticResource MyComboBox}" ItemsSource="{Binding}"&gt; &lt;/ComboBox&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p>C# Behind</p> <pre><code>using System; using System.Collections.Generic; using System.Collections.ObjectModel; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace WpfComboTemplate { /// &lt;summary&gt; /// Logica di interazione per MainWindow.xaml /// &lt;/summary&gt; public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); DataContext = new ObservableCollection&lt;string&gt;() {"Hello", "ComboBox"}; } } } </code></pre> <p>A sceenshot with the combobox using the default style <img src="https://i.stack.imgur.com/Rm78E.jpg" alt="Default ComboBox"></p> <p>A sceenshot with styled combobox <img src="https://i.stack.imgur.com/dblQ4.jpg" alt="Styled ComboBox"></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload