Centering content inside RadRibbonButton

[John DeGrey]

Hi, can someone tell me how (or maybe it's not possible) to center the content inside the RadRibbonButton? The text and image I set is always left justified for some reason. For each button I add to the tab (or group) I have a large image and text. I would like to center this if possible. HorizontalContentAlignment doesn't seem to do anything.

Example:

RadRibbonButton button = new RadRibbonButton();
ImageSource imgs = ResourceLoader.GetResourceImage(buttonModel.AssemblyViewFileName, buttonModel.ButtonIconResourceName);

button.LargeImage = imgs;
button.Size = Telerik.Windows.Controls.RibbonView.ButtonSize.Large;
button.HorizontalContentAlignment = System.Windows.HorizontalAlignment.Center;
button.VerticalContentAlignment = System.Windows.VerticalAlignment.Center;

Or

<telerikRibbon:RadRibbonGroup Header="Common">
                    <telerikRibbon:RadRibbonButton Text="Home" LargeImage="/Resources/Home32.png" Width="70" Size="Large" HorizontalContentAlignment="Center" />
                </telerikRibbon:RadRibbonGroup>

[Sandra Walters]

I too am fighting this problem, and found a rather ugly workaround:

<telerik:RadRibbonButton Width="80" HorizontalContentAlignment="Center" Click="Rates_Click"
    Size="Large" IsAutoSize="false" CollapseToSmall="Never" CollapseToMedium="Never">
    <StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Top">
        <Image Source="images/Rates_large.gif" Stretch="Fill" Width="40" Height="30" />
        <TextBlock Text="Rates" HorizontalAlignment="center" />
    </StackPanel>
</telerik:RadRibbonButton>

I say this workaround is "ugly" because it has to completely bypass the button's collapse logic that chooses an alternate-size icon based on the size of the button.  The size of the image shown also has to be set manually.

If there's a cleaner way to do this, I'd love to rip this workaround out and do it the right way.

[Tina Stancheva]

Hello guys,

First of all I want to thank you for bringing this issue to our attention. I logged it in our PITS where you can track its progress.

In the meantime you can edit the default ControlTemplate of the RadRibbonButton control to set the HorizonatalAlignment properly to the Grid hosting the Image and Text elements.

I attached a sample project to get you started. Please let us know if we can further assist you.

Kind regards,
Tina Stancheva
the Telerik team