Add themes with Images inside RadRibbonBar RadGalaryElement

1 Answer 63 Views
RibbonBar
Sathish
Top achievements
Rank 1
Iron
Iron
Iron
Sathish asked on 25 Sep 2023, 10:37 AM | edited on 25 Sep 2023, 10:46 AM

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
Top achievements
Rank 1
Iron
Iron
Iron
commented on 26 Sep 2023, 12:32 PM

Hello.

Can anyone help me with this?

1 Answer, 1 is accepted

Sort by
0
Dinko | Tech Support Engineer
Telerik team
answered on 26 Sep 2023, 01:31 PM

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

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
RibbonBar
Asked by
Sathish
Top achievements
Rank 1
Iron
Iron
Iron
Answers by
Dinko | Tech Support Engineer
Telerik team
Share this question
or