How to add margin to ComboItems in WPF

Question

I would like to change the margin of the list of ComboItems in global, not to each, to create a space between the ComboBox and the list of items.

I explain. I know that I can add styles to ComboItem with

 <Style TargetType="ComboBoxItem">

But in my case, I want to change the margin around my list of items, not for each of them.

I don't know how to reach the property to modify this margin.

If you have any idea, thanks you

Possible dublicate of [http://stackoverflow.com/questions/3328853/how-to-increase-padding-displayed-items-combobox](http://stackoverflow.com/questions/3328853/how-to-increase-padding-displayed-items-combobox)? — NtFreX, Sep 08 '16 at 07:07
No, this is exaclty what I don't want to do. The padding is applyied to all items, not to the container of the items — Pierre, Sep 08 '16 at 07:13

score 1 · Accepted Answer · edited May 23 '17 at 11:51

You can extract the default control template of the combobox like that or like this:

Then you tweak this part (I added the Margin on the ItemsPresenter):

<Popup x:Name="PART_Popup" AllowsTransparency="True" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
    <Themes:SystemDropShadowChrome x:Name="shadow" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{Binding ActualWidth, ElementName=templateRoot}">
        <Border x:Name="DropDownBorder" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
            <ScrollViewer x:Name="DropDownScrollViewer">
                <Grid x:Name="grid" RenderOptions.ClearTypeHint="Enabled">
                    <Canvas x:Name="canvas" HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
                        <Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/>
                    </Canvas>
                    <ItemsPresenter Margin="0,10,0,10" x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </Grid>
            </ScrollViewer>
        </Border>
    </Themes:SystemDropShadowChrome>
</Popup>

You get this:

It doesn't work for me... Where do you put this code ? At the top of my XAML ? I just removed the shadow part — Pierre, Sep 08 '16 at 08:08
Right click the combobox in the XAML designer (not in the code view), select Edit Template, Edit a copy..., give the style a name and place it in a resource or in this file. — nabulke, Sep 08 '16 at 08:17

How to add margin to ComboItems in WPF

1 Answers1