RadRibbon split button image/text alignment

[Carmen]

Hi there,

I have a RadRibbonBar which contains a RadSplitButton element and I'm using Windows11Compact Theme.

I have set splitBtn.ArrowPosition = Bottom and ImageAlignment and TextAligment = TopCenter.
I want the image and text to be centered on the button but they are both aligned right. I notice this only happens with the Windows11 themes, and only to the RadSplitButton. The DropdownButton image/text is correctly centered, however I need to use the split button as there is an event triggered when the button portion of the control is clicked.
I have tried searching for other alignment properties in the UI Elements and setting them all to TopCenter but that still does not solve the problem.

Is this the expected behaviour/appearance? And is there a way I can have the image and text centered on the control?

I have attached a screenshot of the issue I am experiencing.

Thank you,
Carmen

[Nadya | Tech Support Engineer]

Hello, Carmen,

Following the provided description, I am able to observe a minor offset of the image when using the Windows11Compact theme. To overcome it you can set the Padding property of ImagePrimitive and adjust the right padding as shown below:

this.radSplitButtonElement1.ActionButton.ImagePrimitive.Padding = new Padding(0, 0, 5, 0);

I hope this helps. Please let me know if you have any other questions. 

Regards,
Nadya | Tech Support Engineer
Progress Telerik

[Carmen]

Hi Nadya,

Thank you for your reply. I forgot to mention that I have set the ImageLayout, ImageScaling and MinSize properties of ImagePrimitive to get the image to my desired size.

this.splitButton.ActionButton.ImagePrimitive.ImageLayout = Stretch;
this.splitButton.ActionButton.ImagePrimitive.ImageScaling = SizeToFit;
this.splitButton.ActionButton.ImagePrimitive.MinSize = new Size(35, 35);

Because of this, adjusting the padding distorts the image.

However, I managed to solve my problem by setting the Margin of ImageAndTextLayoutPanel in a similar way.

Thank you,
Carmen

[Nadya | Tech Support Engineer]

Hello, Carmen,

I am glad to hear that you managed to solve your problem by setting the Margin property of ImageAndTextLayoutPanel. Thank you for sharing it with the community.

In case you have any other questions do not hesitate to contact me.