Button text disappears on resize

[RAG]

Dear Telerik team,

I have an issue and I can't find the right button property to set.

See my two attached screenshots: The first one shows the buttons as they should be displayed. The second one shows the problem that appears when I resize my form. Shortly before the button groups collapse, the buttons loose their text. As you can see, some of the buttons still have their text, but they also disappear on making the form smaller. My buttons do have StretchVertically and StretchHorizontally on true, but it didn't change anything setting them on false. Nor playing with the minSize and size attributes.

Can you help me, please?

Thanks in advance!
Regards
Fabian

[Stefan]

Hello Fabian,

Thank you for writing.

The observed behavior is the desired behavior in RadRibbonBar. When you reduce the control size it will start collapsing its elements in order to adjust itself to the new size. If you keep reducing the size after the text is hidden, the control will continue hiding its elements - see attached video.

I hope that you find this information useful.

Greetings,
Stefan
the Telerik team

[RAG]

Hello Stefan,

thanks for the video!

What I don't understand is, why do captions disappear when using image buttons, but not when using radio buttons. Is there any way to set the radio button behaviour for image buttons? I attached two new screenshots, to show you what I mean. :)

Regards!
Fabian

[Stefan]

Hi Fabian,

Thank you for writing back.

The collapse operation in RibbonBar is performed in the ExpandableStackLayout class and each item in it that inherits from the CollapsibleElement class can be expanded or collapsed. By default, ExpandableStackLayout checks whether the sum of all sizes of the elements is larger than the available space and calls the CollapseToStep method for these elements with CollapseStep smaller than CollapseMaxSteps. There is a property of the RibbonBarGroup, which can be set to determine when the group should be collapse - see the CollapsingPriority property. The higher this is the, the higher its collapsing priority is. In your case, you can set the CollapsingPriority of the group containing your radio button to a small number to make it disappear last. 

On a collapsible element as RadButtonElement, the text of it will be hidden first, then considering that the button has both LargeImage and SmallImage, the LargeImage will be hidden, displaying the SmallImage, and only then the element will be collapsed. However, this is not valid for radio buttons since leaving such with hidden text (just the small circle) will make no use for the users, thus the whole element is hidden.

I hope that you find this information useful.

 
Kind regards,
Stefan
the Telerik team

[RAG]

Hi Stefan,

thank you for answering!

That means, please correct me if I'm wrong, a RadButtonElement collapses in several steps and the first step is the disappearing text. Or is there any way I can tell the button only to be collapsed or full visible? With no intermediate state?

Regards,

Fabian

PS: Please do not hesitate to ask, if something I wrote sounds confusing - I'm no native english writer. :)

[Stefan]

Hi Fabian,

If a RadButtonElement has applied LargeImage, SmallImage and Text, the text will be hidden first, than the LargeImage and then the button will be collapsed.

The only way to make a button collapse is if it does not have the LargeImage and the SmallImage properties set. 

Kind regards,
Stefan
the Telerik team