In my app, I have a feature where you can put a frame around an image.
I use setBackground(Drawable) to apply the image of the frame to an ImageView. When the ImageView is clicked, I want to blow the content area (the image contained in the frame) up to the size of the screen. For this, I need to know the difference between the entire view and the content area, i.e. the thickness of the border.
Is there a way to get the size of the content area? (Accessing View.getWidth() for the ImageView gives content + border. I'm trying to get the border / padding.)
You can use:
Rect padding = new Rect();
view.getBackground().getPadding(padding);
int contentWidth = view.getWidth() - padding.left - padding.right;
int contentHeight = view.getHeight() - padding.top - padding.bottom;
If your background is a nine patch, the getPadding method will return the insets of the drawable
Here's an alternative approach:
The horizontal and vertical borders of the 9patch frame should not be stretched vertically and horizontally, respectively. Therefore you have constant width of the vertical border and height of the horizontal border. You can open the 9patch with any image editor that supports measuring and measure those lengths.
Use those values as margin or padding of the content view. Providing a single 9patch for all DPIs should work as the system would stretch it for higher DPIs but your padding/margin would be in DPs, so it should be the same size as the frame.
Related
I have an image 3264x1836 and I display it in a custom AppCompatImageView having dimensions 1280x720. I want to preserve the image size so I use ScaleType.CENTER, but I also want that its top-left corner is positioned at the coordinates 0,0 of my custom view, so I set the padding left and top accordingly.
Now, to achieve that I had to use 3264-1280 (the difference between the widths) as left padding and 1836-720 (the difference between the heights) as top padding while, in my opinion, these values should be both divided by 2.
Can somebody explain why?
It is likely that you are breaking the AppCompatImageView code by asking it to do something that wasn't anticipated or tested.
While the above could still be true, the padding that you are applying is correct. Here are the calculations:
For simplicity, let's take a look at the left padding needed to shift the graphic. The same sort of calculations will work for the top padding.
The width of the graphic is greater than the width of the ImageView.
d = wgraphic - wimageview
If the graphic is centered in the ImageView, then the overhang on the left and right sides will be 1/2 the difference in widths.
s = d / 2
The graphic is centered within the padding of the ImageView. The amount of padding that has to be specified must be just enough to shift the center of the graphic by the amount s.
The initial center of the ImageView without padding is
ci = wimageview / 2
The shifted center with left padding ( p ) is
cs = p + (wimageview - p) / 2
So,
s = cs - ci = p + (wimageview - p) / 2 - (wimageview / 2)
Solving for the padding needed for a shift of s we get p = 2s = d. In other words, the padding we need is twice the shift required which is what you are seeing.
A fix that doesn't involve padding would be to specify
android:scaleType="matrix"
You should remove the padding. The new scale type will apply the identity matrix to the image and place it in the top/left corner without resizing.
I am confused with setbounds method of drawable in Android. I know it is used with drawable and it set where drawable and how large it is. Briefly, it defines, bounding rectangle for drawable. But I am confused: does it set border or padding or its width or height?
This is how we use setbounds
drawableInstance.setBounds(L,T,R,B);
First scenario
So in above case, If I set 5,5,5,5 for L,T,R,B respectively, L,T,R,B of drawable will be always from its parent respectively? I mean will it be like setting hidden 5px border to every side?Besides, if image is not large enough to meets that border width to its parent, will image be bigger?
Second scenario
I set 5,5,100,100 for L,T,R,B respectively. What I am confusing is, it will starts drawing from away from parent 5px to the top and 5px to the left. That will be the start point. Then image with will be 100px because I set 100 for right. So it goes to the right 100px. Same to bottom with right.
But I tested it. I think both is not as what I think. How does it work, especially in relation to each parameter of setBounds?
The bounds values are absolute, not relative. That is, width == right - left, and height == bottom - top.
Your first example will have the top left corner of the Drawable at (5, 5), but the width and height will both be 0.
The second example will also have the top left corner at (5, 5), and the width and height will both be 95.
The bounds are not dependent on the dimensions of the Canvas to which the Drawable is drawn. For instance, if you draw a Drawable with the bounds of your second example onto a View that is only 50 by 50, its left and top sides will be inset by 5, but it will get cut off at the right and bottom borders.
I am trying to dynamically resize an image which is in the relative layout using the code
int height = v.getHeight();
int width = v.getWidth();
height += 50;
width += 50;
RelativeLayout.LayoutParams layout = new RelativeLayout.LayoutParams(height, width);
layout.setMargins(200, 200, 200, 200);
layout.addRule(RelativeLayout.CENTER_IN_PARENT);
v.setLayoutParams(layout);
Here v is a view (a imageView in this case)
The rule works perfectly. The image gets placed in the center but what i want to get is the image should be placed where it is.
That is if the image is at the location (100,100) it's size should be increased and the image should be placed at the same location or the location where i need to place it.
Can anyone suggest me please.
What you are asking, can't be done simply by creating rules.
You need to do the extra work for such alignment.
1) use addRule to align parent left & align parent top, then set the left and top margin to align the image to any position you want 100,100 or 200, 50 etc. after that you can resize the image without changing position.
2) if you keep the image aligned CENTER_IN_PARENT then the image resize is a bit typical.
you need to increase the left and top padding according to the increased size to align the image in center.
suppose image size is 100x100 and new size is 150x150
now you need to set layout parameters to width x height to 200x200 and set the left and top padding of image to 50.
I hope its clear
So I have this task to create a horizontal scrolling array of image buttons that are basically photo avatars of users. These avatars aren't constrained by aspect ratio or size, and so I've been playing with ways to scale them and format them. I've gotten them scaling via the scaletype="fitCenter" and using static width and height. But what I really want them to do is to butt up against one another. Currently if an image is taller than it is high, you get the kind of letterboxing but on the sides vs. the top (blank areas). I've tried all the different scaling values, wrapping each imagemap within a linearlayout, etc., but nothing I try seems to get rid of those (while displaying the entire image to scale). Is there any way to do this?
Just to reiterate what I think you're doing, you have three image scenarios:
Square image
Landscape image (wider than tall)
Portrait image (taller than wide)
Laying out a row of fixed-size ImageViews (or ImageButtons) using FIT_CENTER works great for what you need if all the images were either square or landscape, because the scaling will always make the image stretch to the horizontal bounds of the view (the largest dimension). However, with portrait images, the scaling causes the view to be inside the bounds of your fixed-size view so that the entire image height can be visible.
If you need to maintain the aspect ratio of the image, there really is no ScaleType to help with this because the logic would be circular (fit the view to the image, while simultaneously fitting the image to the view). The solution is to adjust the size (specifically, the width) of each ImageView to match what the image will be scaled to. Here's a sample of a factory method you might use to generate the ImageView to fit the image you want to put inside it. You could also modify this slightly to reset parameters on an existing ImageView if you like:
private ImageView getImageViewForThumbnail(Bitmap thumbnail) {
float viewHeight = //Your chosen fixed view height
float scale = ((float)thumbnail.getHeight()) / viewHeight;
float viewWidth = thumbnail.getHeight() / scale;
ImageView view = new ImageView(this);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams((int)viewWidth, (int)viewHeight);
view.setLayoutParams(params);
view.setScaleType(ScaleType.FIT_XY);
view.setImageBitmap(thumbnail);
return view;
}
You're basically just calculating what the aspect width of the ImageView should be to match the fixed height you've chosen for all of them.
HTH
Use the scaleType fitXY, it stretches the image to the layout params you assigned, if the image has less dimensions and also shrinks the image to the layout params you assigned, if the image is large. The key point is to mention the image layout params to the imageView , that is the width and height of the image.
I want to scale an image in an ImageView in the following way. The ImageView has some dimensions Width (W) and Height (H). The image I'm putting into the image view could be smaller or bigger than WxH. I want it to scale while preserving aspect ratio to fill WxH space.
It seems like the closest thing to what I want is android:scaleType="centerInside", but what I'm seeing is that if the image is smaller than WxH, it will put a small-unscaled version of that image in the center of the ImageView (like the documentation says), but I want it to scale it to "fit", while showing the entire image, and stretching it to the maximum possible size of the container without cropping anything. In other words, stretch preserving aspect ratio until either the width or the height bumps into the edge of the container (ImageView).
This seems like an obvious thing to want to do, but I can't get it to work this way!!!
From the Android docs...
public static final Matrix.ScaleToFit CENTER
Compute a scale that will maintain the original src aspect ratio, but will also ensure that src fits entirely inside dst. At least one axis (X or Y) will fit exactly. The result is centered inside dst.
The XML attribute for this is...
android:scaleType="fitCenter"