CODEWITHSUNDEEP
javascripthtmlimageextjsextjs4
Art F
Art F

Reputation: 4200

ExtJs, keep an image from stretching in Ext.Img

I am not sure if this can be done, but is it possible in ExtJS, in an Ext.Img component to keep the image from stretching to the size of the component and instead have it keep its proportions? To keep it from looking stretched?

Let me try to clarify this a bit from researching this, if in HTML I do something like this

<img src=# />

The image is not altered and is just the size I need it to be, if in ExtJs I do something like this

    xtype:'image',
    id: 'south_image',
    src: '#',
    region: 'south',
    width: 700,
    height: 200

Then the image turns out to be stretched, is there a way, assuming that Ext.Img is larger than the image, how do I get the image to keep its natural size like in HTML?

Upvotes: 3

Views: 6231

Answers (2)

Art F
Art F

Reputation: 4200

So I was able to find the answer, I had to put the Ext.Img inside of an Ext.container.Container, the size would be specified inside the container, while the size of the Ext.Img would be left blank:

    xtype: 'container',
    region: 'south',
    width: 700,
    height: 200,
    autoScroll: true,
    items: [{
        xtype:'image',
        id: 'south_image',
        src: '#',
        region: 'south',
        autoScroll: true
    }]

Upvotes: 8

Varun Achar
Varun Achar

Reputation: 15109

Yes.. Set the maxHeight and maxWidth of the Ext.Img

Doc here

Upvotes: 2

Related Questions