Aligning Buttons in RadToolbar

[Chris Boarman]

Hello,

Is there a simple way to right-align a button in the RadToolbar? Frequently, it is nice to have a right-aligned help button or refresh button in a tool bar. I tried setting the HorizontalAlignment property of the contained button to Right, but that didn't work.

[Valentin.Stoychev]

Hello Chris Boarman,

This is currently not supported. I added your request to the product backlog however we can not stick to any specific date for implementation.

Kind regards,
Valentin.Stoychev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Sypher]

woops

[Petar Mladenov]

Hello sypher,

You can vote for this issue here in order to increase its priority.

Kind regards,
Petar Mladenov
the Telerik team

[gans]

We need this feature too. I am surprised we can't do this yet.

[David]

I need to be able to right align some content in the radtoolbar. * Bump *

[Ryan]

Is this still not available yet?

[Petar Mladenov]

Hi Ryan,

I pleased to let you know that this feature is ready since Q3 2014. Please check out its supporting article and XAML SDK sample in our GitHub Repository.

Regards,
Petar Mladenov
Telerik

[Adrien]

Hello,

 is it possible to center-align buttons in a RadToolbar ? I attach a picture of the toolbar I currently have (using "basic" toolbar), but the way I position the buttons doesn't work when the zoom changes. Then, I want to use the RadToolbar to do so.

Thank you, 
Adrien

[Ivan]

Hi Adrien,

The RadToolBar does not support center-alignment of it's items. They can be left-aligned or right-aligned. You can check the Item Alignment article for more information.

However there is a way to solve this situation. You can set margin to the first centered button inside the tool bar. This margin will be dynamically calculated on re-size. Here is an example:

private void RadToolBar_SizeChanged(object sender, SizeChangedEventArgs e)
{
    RadToolBar toolBar = sender as RadToolBar;
    double toolBarWidth = toolBar.ActualWidth;
    var children = toolBar.Items;
    double buttonsTotalWidth = 0;

    foreach (Control button in children)
    {
        buttonsTotalWidth += button.ActualWidth;
    }

    const double sideConstants = 20;
    double freeSpace = toolBarWidth - buttonsTotalWidth - sideConstants;
    double offset = freeSpace / 2;

    ButtonView.Margin = new Thickness(offset, 0, 0, 0);
}

You can check this approach in the sample project attached.

Regards,
Ivan
Telerik