Add themes with Images inside RadRibbonBar RadGalaryElement

[Sathish]

Hello,

I have a RadRibbonBar and I have added a Group for themes. Inside that I have added a RadGalaryElement control, within this I want to add themes exactly as shown in the below screenshot. When hovering mouse on theme, it shows large icon. (The attached screenshot is from different tool)

1.

2. On clicking the bottom button popup appears with all the themes name + Image.

 

Please add all the themes and attach a source code zip file.

Thanks.

[Sathish]

Hello.

Can anyone help me with this?

[Dinko | Tech Support Engineer]

Hi Sathish,

Thank you for the provided details. 

For your first question, the control does not provide such a zoom option out of the box. However, you could achieve it using custom code. You could subscribe to the MouseEnter event of the RadGalleryItem. In the event handler you can create a Form, for example, set its properties and show it at the desired location. 

Regarding your second question. You can check the Creating a Gallery section in our documentation which demonstrates how you can add all the themes and change them using the RadGalleryItems.

For your convenience, I have created a sample project to demonstrate what I have in mind. I have placed one and the same image for each gallery item. You can replace it with your own. When you hover an item a form with the label of the currently hovered item is shown and closed when the mouse leaves the boundaries of the gallery item. You will need to set the location of the Form depending on your mouse location. I think this project will be a good starting point for achieving your scenario.

Regards,
Dinko | Tech Support Engineer
Progress Telerik