WPF Separator vs Actipro Ribbon Separator

Ribbon for WPF Forum

Posted 11 years ago by Owen Christensen - Software Engineer, Minitab Inc.
Version: 13.2.0590
Platform: .NET 4.5
Environment: Windows 8 (64-bit)
Avatar
    <ribbon:Ribbon>
        <ribbon:Ribbon.Tabs>
            <ribbon:Tab Label="Tab">
                <ribbon:Group Label="Group">
                    <ribbon:StackPanel>
                        <ribbon:ComboBox Label="Combo">
                            <ribbon:ComboBox.Resources>
                                <Thickness x:Key="{x:Static themes:AssetResourceKeys.ListItemInnerBorderNormalThicknessKey}">1,0,1,0</Thickness>
                                <Thickness x:Key="{x:Static themes:AssetResourceKeys.ListItemBorderNormalThicknessKey}">1,0,1,0</Thickness>
                                <SolidColorBrush x:Key="{x:Static themes:AssetResourceKeys.MenuItemIconColumnBackgroundNormalBrushKey}" Color="Transparent" />
                                <SolidColorBrush x:Key="{x:Static themes:AssetResourceKeys.MenuItemIconColumnBorderNormalBrushKey}" Color="Black" />
                                <Style TargetType="{x:Type Separator}">
                                    <Setter Property="Margin">
                                        <Setter.Value>
                                            <Thickness Left="{x:Static ribbon:RibbonMeasurements.MenuItemSmallIconColumnWidth}" Top="-1" Right="0" Bottom="-1" />
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                                <Style TargetType="{x:Type ribbon:Button}" BasedOn="{StaticResource {x:Type ribbon:Button}}">
                                    <Setter Property="Context" Value="MenuItem" />
                                    <Setter Property="IsHitTestVisible" Value="False" />
                                    <Setter Property="Margin" Value="0" />
                                </Style>
                            </ribbon:ComboBox.Resources>
                            <ribbon:ComboBox.ItemContainerStyle>
                                <Style TargetType="{x:Type ComboBoxItem}" BasedOn="{StaticResource {x:Static themes:SharedResourceKeys.ComboBoxItemStyleKey}}">
                                    <Setter Property="Margin" Value="0" />
                                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                </Style>
                            </ribbon:ComboBox.ItemContainerStyle>
                            <ribbon:Button Label="Item 1" />
                            <ribbon:Button Label="Item 2" />
                            <ribbon:Button Label="Item 3" />
                            <ribbon:Separator Context="MenuItem" />
                            <ribbon:Button Label="Item 4" />
                        </ribbon:ComboBox>
                    </ribbon:StackPanel>
                </ribbon:Group>
            </ribbon:Tab>
        </ribbon:Ribbon.Tabs>
    </ribbon:Ribbon>

With a standard WPF Separator (<Separator/>) the above functions as I intend; a non-selectable line is drawn in place of an item, but it spans the width of the drop down.  I'd like to use the Actipro separator mostly to get my margins correct in adjusting for the image.  However, as your control is not covered by the default IsItemItsOwnContainer (and by extension, GetContainerForItemOverride), the Actipro separator is selectable and I have to set an arbitrary Margin (29,-1,0,-1) to push the separator into the position it should be in.  I know that {x:Static ribbon:RibbonMeasurements.MenuItemSmallIconColumnWidth} (26) works (change the ribbon:Separator to Separator above to see it) as the left value but that pushes the line right against the vertical image borders instead of providing the appropriate buffer.  Any chance this can be dealt with in a maintenance release?

[Modified 11 years ago]

Comments (3)

Posted 11 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar

Hi Owen,

I'm curious why you are putting ribbon:Button objects in a ComboBox here.  It seems like a better solution overall would be to use a ribbon:PopupButton with a ribbon:Menu in it and embed the ribbon:Button and ribbon:Separators directly in that.  It would be straightforward then and would also have the correct styling.


Actipro Software Support

Posted 11 years ago by Owen Christensen - Software Engineer, Minitab Inc.
Avatar

The buttons are simply for getting the menu style in the combobox drop down.  The design I'm working with has menuitem-styled items with a combobox-style selection box.  For similar examples you can check out the Font dropdown in Word 2013 (note the opentype font icon next to the font name is not displayed in the combobox selection box - just the font name) and the Style ComboBox in the References>Citations & Bibliography group.

[Modified 11 years ago]

Posted 11 years ago by Actipro Software Support - Cleveland, OH, USA
Avatar

Hi Owen,

Our ribbon:Button controls aren't really intended to be used in a ComboBox and might introduce unintended behavioral side effects, not to mention the UI issues you saw.

You really would be better off just making a custom item template or style for your ComboBoxItems.  Perhaps in some cases where you have one that should represent a separator, you have an alternate template that kicks in.  You could mark those particular ComboBoxItems as disabled too, to help prevent them from getting selected.  In your custom templates you could reuse the same theme brushes we use in our menu items so things render consistently with the rest of the ribbon.


Actipro Software Support

The latest build of this product (v24.1.1) was released 2 months ago, which was after the last post in this thread.

Add Comment

Please log in to a validated account to post comments.