I have Image placed in Table cell.
Image is created from TextureRegion with size 128x128
How can I scale down Image to have size 100x100. And will table cell automatically get the same size, as Image?
Call setSize(100, 100) on the Image actor. The Table cell will automatically change its size, too.
Related
Using VisualEditor on last version of mediawiki, I am trying to create table with image in it.
The columns width automatically fit to the image size, excepte for small images. Even for a 25pixel image, the column minimum size is 200 pixel
I have tried all th parameters for the image. I do not change the width of the column. If I remove the image, the column immediately fit to minimum size.
What can I do to make column fit to small image?
Another solution would be to not use image. I would like "green check" and "red cross" in my tab? Maybe there is a solution without using images? Any ideas?
I have an image in an SSRS report, and it doesn't seem to be doing "FitProportional" (by which I assume means it will grow or shrink proportionally, depending on the cell size).
FitProportional keeps it small, proportional to the cell size.
Clip clips it to the cell size of the upper left corner of the photo.
Fit stretches the photo out of proportion
AutoSize skews the whole report to the size of a large photograph.
is there an additional setting I can apply to have the photo actually increase or shrink proportional to the cell size? Or should I make sure the photos are already sized properly, before being used by the SSRS report.
Thank you!
Not really an answer but too much to fit in a comment.
I'm not sure what other option you could want other centering, these cover everything else.
AutoSize : Resizes the cell to the size of the image's original size
Fit : stretches and scales the image to fit the cell perfectly, image ratio is no maintained and the image fills the cell.
FitProportial : keeps the image width vs height ratio the same but set the image size to be as wide or tall as possible to fill the cell either vertically or horizontally.
Clip : Anchors the image in the top left corner of the cell. The image is not resized but only the portion of the image that fits within the cell is visible.
If you still think there is something missing, maybe post some screen shots with examples of what you want to achieve.
Edit: I am using LibGDX framework.
There is an Image Actor, which is:
Attached to a Stage.
Has an OnClickListener, e.g.:image.addListener(new OnClickListener() { ... });
This Image's touchable area is fixed on the image's width and height.
I want to increase the touchable area by N pixels.
How can I achieve this?
Here's an illustration:
(red rectangle = touchable/clickable area)
Image already supports this out of the box. The actor can be bigger than the drawn image itself. You can supply a Scaling strategy for the drawn picture and in case you use Scaling.none, the drawn picture will be independent of the actor's size.
image.setScaling(Scaling.none)
int N = 30;
image.setSize(image.getImageWidth() + N, image.getImageHeight() + N);
The way I would approach it, is to have a custom image view, with the actual Image View inside a RelativeLayout. The relative layout has padding and/or margin set, so that it is bigger than the imageView. then, when you set the onClicklistener, set it on the relative layout as well as the image layout (in your custom class)
Html canvases have max sizes depending on device/browser. Eg some mobiles have roughly a 1000x1000 canvas max. What about images stored in memory? Can these be up to the ram of the phone/pc? Can you 'drawImage' large images to these 1000x1000 canvases where it does auto-cropping? (I don't have a phone to test this even for a specific device.)
The max size of an image object is probably browser or memory dependent.
More to your question...
The image object you draw into the canvas can be larger than the canvas.
This causes the canvas to become a "viewport" into the image.
For example:
Your canvas is 1000x1000.
Your image is 1500x1500.
If you do this then the image pixels will be cropped at x>1000 and y>1000.
// canvas shows image pixels from x=0-999 and y=0-999
drawImage(yourImage,0,0)
If you do this then image pixels will be cropped at x<200 & x>1200 and y<200 and y>1200.
// canvas shows image pixels from x=200-1999 and y=200-1999
drawImage(yourImage,-200,-200)
A mental exercise to see how this works is to imagine a piece of paper with a rectangle "viewport" cut from it. Then move a larger-than-viewport image behind the paper. Only a part of the image will only be visible through the viewport. You can move the image and a different portion of the image will be revealed in the viewport.
Is it possible to set the width and height of a canvas element and have the existing content scale to fit these new dimensions?
Right now the user uploads an image and my page creates a canvas element containing this image and whose dimensions are the same size as the image. I want to limit the size that I'm working with, however, so here is an example of what I want to have happen:
The user uploads an image that is 1600 x 1200 pixels (Not saved to server)
The data goes right to an html5 canvas object
The canvas height and width are set to 800 x 600 and the image content scales appropriately and then is displayed.
Right now if I set the canvas width and height it just crops the image at those dimension, not resizing as I would like. Thanks!
There are many ways to call drawImage
One is:
ctx.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)
Where dx,dy,dw,dh are the destination x, y, width, and height.
If you make dw and dh always 800x600, the image will drawn will always automatically be scaled to 800x600.
Here's a tiny example that will always draw any size image to 800x600 http://jsfiddle.net/jAT8Y/
Another alternative is to use context.scale function. Your image quality will remain better if you use scale.