WPF MVVM: ComboBox height is different for integers

Question

I am working on a WPF application following MVVM. I have two ComboBoxes in the application. One is binded to a list of intergers and other to list of string. The problem is height of comboboxes are different (see picture below). Any idea why heights are different? There is no styling involved on both comboboxes.

View:

<UserControl.Resources>
    <Style TargetType="ComboBox" >
       <Setter Property="Margin" Value="5" />
    </Style>
    <Style TargetType="TextBlock" >
       <Setter Property="Margin" Value="5" />
       <Setter Property="VerticalAlignment" Value="Center" />
    </Style>
</UserControl.Resources>
...
<StackPanel>
    <TextBlock Text="{x:Static p:Resources.OutputLayersAsText}" />
    <ComboBox ItemsSource="{Binding StringCollection}" />
    <TextBlock Text="{x:Static p:Resources.IgzStatAreaSizeText}" />
    <ComboBox ItemsSource="{Binding IntegerCollection}" />
</StackPanel>

ViewModel:

private ObservableCollection<string> _stringCollection;
public ObservableCollection<string> Stringcollection => _stringCollection ?? (_stringCollection = new ObservableCollection<string>
{
     ".igz", ".png+.png", ".jpg+.png"
});

private ObservableCollection<int> _integerCollection;
public ObservableCollection<int> IntegerCollection => _integerCollection ?? (_integerCollection = new ObservableCollection<int>
{
    8, 12, 16, 24, 32, 48, 64, 96, 128
});

I also tried another combobox with a collection of enums, and its height was similar with integer combobox height.

You are only showing half of the story here... where is rest of that UI ? — Nawed Nabi Zada
@NawedNabiZada These are the only controls I have in the UI. — fhnaseer
Have you retemplated your ComboBox ? If not then there is still something missing. — Nawed Nabi Zada

Clemens Clemens · Accepted Answer · 2019-05-21T12:22:10

Apparently the default TextBlock Style is also applied to the TextBlocks in the visual tree of the ComboBox. No idea why it only affects those items that display integers, but not those that display strings.

Since you already have a ComboBox Style, you may easily avoid this behaviour by explitly defining an ItemTemplate:

<Style TargetType="ComboBox" >
    <Setter Property="Margin" Value="5" />
    <Setter Property="ItemTemplate">
        <Setter.Value>
            <DataTemplate>
                <TextBlock Text="{Binding}"/>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

WPF MVVM: ComboBox height is different for integers

1 Answers