Displaying large image on a TUniButton or a TUniSpeedButton

[cdev]

Hi,

 

I have a large image (250 x 60 pixels) that I want to be displayed an a button without caption. 

So, I put a TUniButton or a TUniSpeedButton on my form an size the button to the same dimensions.

What can I do to avoid that the image is shrunk ? 

[Hayri ASLAN]

1 hour ago, cdev said:

Hi,

 

I have a large image (250 x 60 pixels) that I want to be displayed an a button without caption. 

So, I put a TUniButton or a TUniSpeedButton on my form an size the button to the same dimensions.

What can I do to avoid that the image is shrunk ? 

Hello

can you please create a test case so we can work on it?

[cdev]

I made a small test project.

At the left I placed a TUniImage and loaded a 120x120 pixels png-image in the Picture-property.  At the left I placed a TUniBitBtn and loaded the same image in the Glyph-property.  I set the caption := '' as I only want the button to look exactly as the image at the left. 

In design time it looks like this : (which looks as the way I want it)

 

In my browser it looks like this:

 

Enclosed you can find the source files.

 

LargeImageOnButtonProject.7z

[Sherzod]

21 minutes ago, cdev said:

LargeImageOnButtonProject.7z 5.3 MB · 0 downloads

Hello,

One possible solution.

1. CustomCSS:

.customIconCls {
    width: 100% !important;
    height: 100%;
}

2. UniBitBtn1 -> ClientEvents -> UniEvents ->

function beforeInit(sender, config)
{
    config.iconCls = 'customIconCls';
}

 

[cdev]

This class has to be applied for the button I guess.

I get this :

 

[Sherzod]

I have tested the above solution on your test case.

[cdev]

And you obtain the same results as in my screenshot ?  A button that got larger and the image on the button that got shrunk ?  That is not what I wanted.

The goal is to have a button with the same size as the image on the left, without a shrunk image.  They should look almost equal: the image and the button.

[Sherzod]

No. Works for me. 

[cdev]

So, you don't have the result with the large button as in my last screenshot ?  I don't understand.  Can you send me your code ?

[Sherzod]

1 hour ago, cdev said:

Can you send me your code ?

LargeImageOnButtonProject.rar