How to control visibility of separators in button panel of WPF Ribbon control?
You can change the visibility of the separators in the ButtonPanel by using the SeparatorVisibility property in WPF Ribbon control. The default value of the SeparatorVisibility is Visible. The remaining possible values are Hidden, Visible, and Collapsed.
XAML
<Syncfusion:Ribbon Name="ribbon" VerticalAlignment="Top" > <Syncfusion:RibbonTab Caption="Home" IsChecked="False" > <Syncfusion:RibbonBar IsLargeButtonPanel="False" Header="Font" > <Syncfusion:ButtonPanel Name="buttonPanel" SeparatorVisibility="Visible"> <Syncfusion:RibbonComboBox IsEditable="True" Width="110" /> <Syncfusion:RibbonComboBox IsEditable="True" Width="40" /> </Syncfusion:ButtonPanel> <Syncfusion:ButtonPanel SeparatorVisibility="Collapsed" Height="24"> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/GrowFont16.png" /> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/ShrinkFont16.png" /> </Syncfusion:ButtonPanel> <Syncfusion:ButtonPanel SeparatorVisibility="Collapsed" Height="24"> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/ClearFormatting16.png"/> </Syncfusion:ButtonPanel> <Syncfusion:ButtonPanel SeparatorVisibility="Collapsed" Height="24"> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" IsToggle="True" SmallIcon="/Resources/Bold16.png"/> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" IsToggle="True" SmallIcon="/Resources/Italic16.png"/> <Syncfusion:SplitButton Padding="2" Height="24" Width="37" SizeForm="ExtraSmall" SmallIcon="/Resources/Underline16.png"/> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/Strikethrough16.png"/> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/Subscript16.png"/> <Syncfusion:RibbonButton Padding="2" Height="24" Width="24" SizeForm="ExtraSmall" SmallIcon="/Resources/SuperScript16.png"/> </Syncfusion:ButtonPanel> <Syncfusion:ButtonPanel SeparatorVisibility="Collapsed" Height="24"> <Syncfusion:SplitButton Padding="2" Height="24" Width="37" SizeForm="ExtraSmall" SmallIcon="/Resources/TextHighlightColor16.png"/> <Syncfusion:SplitButton Padding="2" Height="24" Width="37" SizeForm="ExtraSmall" SmallIcon="/Resources/FontColor16.png"/> </Syncfusion:ButtonPanel> </Syncfusion:RibbonBar> </Syncfusion:RibbonTab> <Syncfusion:RibbonTab Caption="Insert"/> </Syncfusion:Ribbon>
C#
buttonPanel.SeparatorVisibility = Visibility.Visible;
The following screenshot displays the Button Panel with Separator Collapsed and Visible.
Conclusion
I hope you enjoyed learning about how to control visibility of separators in button panel of WPF Ribbon control.
You can refer to our WPF Ribbon feature tour page to know about its other groundbreaking feature representations. You can also explore documentation to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
