Declined
Last Updated: 23 Feb 2021 01:43 by MyeongSeong
MyeongSeong
Created on: 24 Dec 2020 09:12
Category: RibbonBar
Type: Bug Report
1
RadRibbonBar: Size property is not serialized for the ImagePrimitive in the ribbon buttons

By default, the ImagePrimitive in a ribbon button is auto sized. If you want to disable the AutoSize property of the image and specify a specific Size, the AutoSize property gets serialized in the designer, but the Size is not. This leads to missing image after reopening the designer.

After saving the changes and reopening the designer the image is missing since its Size property is not serialized:

 

 

12 comments
MyeongSeong
Posted on: 23 Feb 2021 01:43

Thanks for Hristo answer.
I have confirmed that it works well as desired.

 

ADMIN
Hristo
Posted on: 09 Feb 2021 11:15

Hello,

Setting the AutoSize property to false is not recommended as this way the layout system will not measure and arrange your button. The property can be set to false in some special cases when you have custom layout. Custom layout would mean special measure and arrange logic which is done at runtime. That`s why the Size property on the elements is not serialized and this is by design.

Your scenario is clear, if I`m not mistaken, you have smaller images, and you would like to display them centered in an image element which is 48x48. The already suggested approach may not entirely fit this scenario, so I will suggest a different solution which is also working in the designer. All you need to do is to set the MinSize property of the ImagePrimitive element:

I am also attaching my sample project. I hope that the suggested approach would fit your local setup.

Regards,
Hristo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

MyeongSeong
Posted on: 09 Feb 2021 10:15
If you run the method dess told you again, it will be changed to middleLeft.
Not normal.
MyeongSeong
Posted on: 09 Feb 2021 09:41

We want your results to be saved properly using the "Edit UI elements" you created.
If I try to save it as code, I just need to center it on the coordinates. I don't want it.

The samples I've written here are just the easiest ones to reproduce.

MyeongSeong
Posted on: 09 Feb 2021 09:37

Thanks for the suggestion.
But this is not what I want.
I want to center a small image in the (48, 48) size.
When the size is 48 or 48, it feels the same as other ribbons.
Instead of resizing the image to (48,48), it just needs to be moved to the center.
I didn't want the image to grow to size 48.
I think this is a very simple part, is this an impossible task?

 

We want to put images of various sizes into the same 48 size ribbon bar, but we know how we want to make this new 48 size image.
I do not want to stretch to size 48.

 

Using Google Translator, I am sorry that the translation is not smooth.
I want to write a better expression, but the translation becomes weird.
Please understand this part.
ADMIN
Dimitar
Posted on: 08 Feb 2021 09:52

Hello,

In order to achieve the desired result please set the ImageScaling property of the image primitive to SizeToFit. Then you can also specify its ScaleSize property: 

this.radButtonElement1.Image = Properties.Resources.cloud;
this.radButtonElement1.TextImageRelation = TextImageRelation.ImageAboveText;
this.radButtonElement1.ImagePrimitive.ImageScaling = Telerik.WinControls.Enumerations.ImageScaling.SizeToFit;
this.radButtonElement1.ImagePrimitive.ImageLayout = ImageLayout.Stretch;
this.radButtonElement1.ImagePrimitive.ScaleSize = new Size(48, 48);

After saving the changes and reopening the designer you will see the image set to the radButtonElement1. Please see the implemented solution in the attached project.

Regards,
Dimitar
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

ADMIN
Dess | Tech Support Engineer, Principal
Posted on: 08 Feb 2021 08:21

Hello, MyeongSeong,

This item is planned for the current iteration of handling bug fixes. I can't give you an exact time frame when it will be fixed. However, we will do our best to address it in the upcoming service pack.

Stay tuned. Make sure that you click the Follow button in order to get notified once the status is changed.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

MyeongSeong
Posted on: 05 Feb 2021 10:42
When will the issue be fixed?
ADMIN
Dess | Tech Support Engineer, Principal
Posted on: 28 Dec 2020 14:05

Hello, MyeongSeong, 

I have tried to reset the alignment first:

Then, you are allowed to set the property to MiddleCenter:

However, saving the changes and reopening the designer, it would produce the same middle left alignment. It seems that the alignment is bound:

It is necessary to manage the RadButtonElement.ImageAlignemnt:

Please give it a try and see how it works for your project.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

MyeongSeong
Posted on: 28 Dec 2020 01:07

hello, Dess

The features you described are also not set.
First of all, this is the part I used before asking questions as a ticket.

 

imagePrimitive -> Alignment ->MiddleLefe   --X-->    MiddleCenter   : It cannot be changed here.

ADMIN
Dess | Tech Support Engineer, Principal
Posted on: 24 Dec 2020 10:18

Hello, MyeongSeong,   

You can center the image by managing the ImagePrimitive.Alignment property:

I believe that it would fit your scenario.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

MyeongSeong
Posted on: 24 Dec 2020 09:47
In addition, the image layout is the center.
But it is not the center.