I'm trying to figure out a way to layout a series of views around a circle, in such a way that each view is rotated to be facing outward from the circle. The picture below is a rough sketch of what I'm looking for. The outside block is the layout/viewgroup, the red squares represent the views I want to rotate.
I'm familiar with the PivotX, PivotY, and Rotation view properties and suspect I will be making use of these in some way, but I'm not sure how to use these in concert with an appropriate layout to get the desired effect.
Here's an example that does this. I created a new Android project and replaced the RelativeLayout that's already there, with a FrameLayout. It's >= API 11 only because of translate and rotate calls in View:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/hello_world" />
</FrameLayout>
I'll create some quick views in code, just replace them with whatever views you have. I'm placing them all in the center of the layout, by setting the gravity of their LayoutParams to Gravity.CENTER. Then, I'm translating and rotating them to their correct positions:
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final FrameLayout main = (FrameLayout)findViewById(R.id.main);
int numViews = 8;
for(int i = 0; i < numViews; i++)
{
// Create some quick TextViews that can be placed.
TextView v = new TextView(this);
// Set a text and center it in each view.
v.setText("View " + i);
v.setGravity(Gravity.CENTER);
v.setBackgroundColor(0xffff0000);
// Force the views to a nice size (150x100 px) that fits my display.
// This should of course be done in a display size independent way.
FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(150, 100);
// Place all views in the center of the layout. We'll transform them
// away from there in the code below.
lp.gravity = Gravity.CENTER;
// Set layout params on view.
v.setLayoutParams(lp);
// Calculate the angle of the current view. Adjust by 90 degrees to
// get View 0 at the top. We need the angle in degrees and radians.
float angleDeg = i * 360.0f / numViews - 90.0f;
float angleRad = (float)(angleDeg * Math.PI / 180.0f);
// Calculate the position of the view, offset from center (300 px from
// center). Again, this should be done in a display size independent way.
v.setTranslationX(300 * (float)Math.cos(angleRad));
v.setTranslationY(300 * (float)Math.sin(angleRad));
// Set the rotation of the view.
v.setRotation(angleDeg + 90.0f);
main.addView(v);
}
}
And this is the result:
The answer by #Daniel is great.
If you need more functionality you can use this nice library on GitHub called Android-CircleMenu
The problem with properly handling multiple screen sizes on Android has been talked all over thousands of times. However I couldn't find a solution to m problem. In a nutshell I need to align my custom progress bar over an imageView. I've got 3 set of drawables for the imageView - ldpi(240x400), mdpi(320x480), hdpi(480x800). I align my custom view in Java with the following code:
//get screen density
float density = getBaseContext().getResources().getDisplayMetrics().density;
//set the progress bar position according to screen density
if ( density == 1.0f)
{
ImageView micImage = ((ImageView) findViewById(R.id.imageViewClk));
Drawable drawing = micImage.getDrawable();
Bitmap bitmap = ((BitmapDrawable)drawing).getBitmap();
// Get current dimensions
int width = bitmap.getWidth();
int height = bitmap.getHeight();
LayoutParams params = new LayoutParams((int)(height/13.94), (int)(height/13.94));
params.setMargins((int)(width/2.30), 0, 0, (int)(height/2.75));
params.addRule(RelativeLayout.ALIGN_LEFT,R.id.imageViewClk);
params.addRule(RelativeLayout.ALIGN_BOTTOM,R.id.imageViewClk);
myCustomTwistedProgressBar.setLayoutParams(params);
}else if ( density == 1.5f ){
ImageView micImage = ((ImageView) findViewById(R.id.imageViewClk));
Drawable drawing = micImage.getDrawable();
Bitmap bitmap = ((BitmapDrawable)drawing).getBitmap();
int width = bitmap.getWidth();
int height = bitmap.getHeight();
LayoutParams params = new LayoutParams((int)Math.round(height/14.13), (int)Math.round(height/14.13));
params.setMargins((int)Math.round( width/2.27), 0, 0, (int)Math.round(height/2.91));
params.addRule(RelativeLayout.ALIGN_LEFT,R.id.imageViewClk);
params.addRule(RelativeLayout.ALIGN_BOTTOM,R.id.imageViewClk);
myCustomTwistedProgressBar.setLayoutParams(params);
}else if ( density == 0.75f ){
ImageView micImage = ((ImageView) findViewById(R.id.imageViewClk));
Drawable drawing = micImage.getDrawable();
Bitmap bitmap = ((BitmapDrawable)drawing).getBitmap();
// Get current dimensions
int width = bitmap.getWidth();
int height = bitmap.getHeight();
LayoutParams params = new LayoutParams((int)(height/14.88), (int)(height/14.88));
params.setMargins((int)(width/2.27), 0, 0, (int)(height/2.69));
params.addRule(RelativeLayout.ALIGN_LEFT,R.id.imageViewClk);
params.addRule(RelativeLayout.ALIGN_BOTTOM,R.id.imageViewClk);
myCustomTwistedProgressBar.setLayoutParams(params);
}
Everything worked fined on different screen sizes however when I tried to check on 480x854 resolution the vertical alignment of the custom view was incorrect. Checked with 480x800 on the same screen size and it again works. I than went for a big jump and checked in GalaxyTab and the horizontal and vertical alignments were wrong. Now my first though was that the bitmap width and height were the one of the image not the actual resized imageview. So I spent a lot of time on trying to get the real size of the imageview and even went for viewTreeObserver but the results were all the same - the correct, unchanged (unscaled?) bitmap size. So being positive that the problem is not here I couldn't get through further. Does anyone have an idea why the alignment is not working correctly?
PS: as for the image view in layout xml file I have 2 configurations for long and notlong but this image has the same description in both:
<ImageView
android:src="#drawable/cloking"
android:id="#+id/imageViewClk"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/imageViewProcess"
android:adjustViewBounds="true"
android:cropToPadding="false"
android:layout_marginTop="60dp"
android:scaleType="fitXY">
</ImageView>
Android will scale the image but it will maintain aspect ratio for the image. You can't control aspect ratio with layout settings (as far as I know). I would solve that problem by choosing few screen ratios that I want to support and making few more resources (images that would have aspect ratios that you support). Code would look like this:
Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();
int height = display.getHeight();
ImageView image = (ImageView) findViewById(R.id.imageViewClk);
if(width/height == aspectRatio1)
{
image.setImageResource(R.id.imageAspect1);
} else if( width/height == aspectRatio2...
I have an RelativeLayout that contains a custom ImageView, the scaleType="centerInside", I load in a bitmap (usually smaller than the imageView). How can I get the top/left position of where the bitmap was drawn? I need to be able addView's on top a positions relative to the bitmap.
RelativeLayout view = (RelativeLayout) inflater.inflate(R.layout.scroll_scaled, container, false);
ContentImageView image = (ContentImageView) view.findViewById(R.id.base_page);
Bitmap bm = mInterfaceActivity.getPageImage(mPageNumber);
image.setImageBitmap(bm);`
The layout file scrolled_scaled
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:scaleType="centerInside"
android:id="#+id/base_page"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff00ff00"
android:contentDescription="#string/product_page"
android:src="#android:drawable/ic_menu_report_image" >
</ImageView>
</RelativeLayout>
You'll need to do the math yourself using the bounds of the Drawable.
ImageView test = (ImageView) findViewById(R.id.base_page);
Rect bounds = test.getDrawable().getBounds();
int x = (test.getWidth() - bounds.right) / 2;
int y = (test.getHeight() - bounds.bottom) / 2;
First we calculate the space in the View that is not being used by the image. Then since it is centered the extra space is evenly distributed before and after the image so it is draw half of that length into the View.
These numbers are relative to the location of the View but you can add the views X and Y if you need you.
This method returns the bounds of image inside imageView.
/**
* Helper method to get the bounds of image inside the imageView.
*
* #param imageView the imageView.
* #return bounding rectangle of the image.
*/
public static RectF getImageBounds(ImageView imageView) {
RectF bounds = new RectF();
Drawable drawable = imageView.getDrawable();
if (drawable != null) {
imageView.getImageMatrix().mapRect(bounds, new RectF(drawable.getBounds()));
}
return bounds;
}
UPDATE 2: getX and getY will return 0 if you're using unspecified width and height (e.g. wrap_content). Instead of iv.getX() and iv.getY() replace that with the answer to this question: Getting View's coordinates relative to the root layout then add the bounds of the image to those values.
You can do this by adding the ImageView's position to the top left bound of the drawable inside. Something like this:
ImageView iv = (ImageView)findViewById(R.id.image_view);
Drawable d = iv.getDrawable();
Rect bounds = d.getBounds();
int top = iv.getY() + bounds.top;
int left = iv.getX() + bounds.left;
UPDATE: For images that are scaled, you'll have to multiply the top and left coords by the image scale to get more accurate positioning. You can do that like this:
Matrix m = iv.getImageMatrix();
float[] values = new float[9];
m.getValues(values);
float scaleX = values[Matrix.MSCALE_X];
float scaleY = values[Matrix.MSCALE_Y];
Then you'd have to multiply top by scaleY and the left by scaleX.
Ended up with a two part solution, based on the feedback and a bit of retry.
I created the subviews an added them to the RelativeLayout in "approximate"
position, but as View.INVISIBLE.
I super-classed the RelativeLayout ViewGroup and in the onLayout I walked
the list of child views and put them in the "proper" place as I now
had the RelativeLayout self-aware of its expanded size.
Seems clunky, but it works.
Thanks to all for the suggestions, my solution was taking pieces of everyones advice.
Is there anyway so I can align bitmap in ImageView. I have an issue with my image view. I'm setting it's source via Java Code and after bitmap is resized it's centered in ImageView, but the thing that I want is to align the bitmap.
Declaring the imageView :
<RelativeLayout
android:id="#+id/collection_background"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/actionbar" >
<ImageView
android:id="#+id/collection_image_background"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:contentDescription="#string/stampii" />
// countinue ........
and here is how I'm setting the bitmap :
BitmapFactory.Options o2 = new BitmapFactory.Options();
o2.inTempStorage = new byte[8*1024];
ops = BitmapFactory.decodeStream(cis,null,o2);
ImageView view = (ImageView) findViewById (R.id.collection_image_background);
view.setImageBitmap(ops);
Any ides how to do that?
Add android:scaleType="fitStart" to your ImageView. It is ok for me.
You can use android:scaleType to change the alignement in your ImageView.
You can use setLayoutParams, as shown in this answer.
EDIT
Your problem is that you've specified the view to be as wide as its parent, while the loaded bitmap may be considerably thinner.
Try to make the view only as wide as needed by using this attribute instead:
android:layout_width="wrap_content"
Actually you can scale your bitmap depending on your screen size and set it as source of your ImageView. You can use something like this :
int screenWidth = getWindow().getWindowManager().getDefaultDisplay().getWidth();
Log.e("","screen width : "+screenWidth);
//int screenHeight = getWindow().getWindowManager().getDefaultDisplay().getHeight();
int width = ops.getWidth();
Log.e("","bitmap width : "+width);
int height = ops.getHeight();
Log.e("","bitmap height : "+height);
float scale = 0;
if(width>height){
scale = (float) width / (float) height;
} else if(height>width){
scale = (float) height / (float) width;
}
Log.e("","scale : "+scale);
float newWidth = (float) screenWidth * scale;
Log.d("","new height : "+newWidth);
Bitmap scaledBitmap = Bitmap.createScaledBitmap(ops, screenWidth, (int) newWidth, true);
Log.e("","new bitmap width : "+scaledBitmap.getWidth());
Log.e("","new bitmap height : "+scaledBitmap.getHeight());
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(screenWidth, (int)newWidth);
params.addRule(RelativeLayout.ALIGN_PARENT_TOP, RelativeLayout.TRUE);
view.setLayoutParams(params);
view.setImageBitmap(scaledBitmap);
Try this and just hit me up if it's working or not.
Additionally to the answers above you can set it programmatically with scaleType:
image.scaleType = ImageView.ScaleType.FIT_START
How to fit an image of random size to an ImageView?
When:
Initially ImageView dimensions are 250dp * 250dp
The image's larger dimension should be scaled up/down to 250dp
The image should keep its aspect ratio
The ImageView dimensions should match scaled image's dimensions after scaling
E.g. for an image of 100*150, the image and the ImageView should be 166*250.
E.g. for an image of 150*100, the image and the ImageView should be 250*166.
If I set the bounds as
<ImageView
android:id="#+id/picture"
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:adjustViewBounds="true" />
images fit properly in the ImageView, but the ImageView is always 250dp * 250dp.
May not be answer for this specific question, but if someone is, like me, searching for answer how to fit image in ImageView with bounded size (for example, maxWidth) while preserving Aspect Ratio and then get rid of excessive space occupied by ImageView, then the simplest solution is to use the following properties in XML:
android:scaleType="centerInside"
android:adjustViewBounds="true"
(The answer was heavily modified after clarifications to the original question)
After clarifications:
This cannot be done in xml only. It is not possible to scale both the image and the ImageView so that image's one dimension would always be 250dp and the ImageView would have the same dimensions as the image.
This code scales Drawable of an ImageView to stay in a square like 250dp x 250dp with one dimension exactly 250dp and keeping the aspect ratio. Then the ImageView is resized to match the dimensions of the scaled image. The code is used in an activity. I tested it via button click handler.
Enjoy. :)
private void scaleImage(ImageView view) throws NoSuchElementException {
// Get bitmap from the the ImageView.
Bitmap bitmap = null;
try {
Drawable drawing = view.getDrawable();
bitmap = ((BitmapDrawable) drawing).getBitmap();
} catch (NullPointerException e) {
throw new NoSuchElementException("No drawable on given view");
} catch (ClassCastException e) {
// Check bitmap is Ion drawable
bitmap = Ion.with(view).getBitmap();
}
// Get current dimensions AND the desired bounding box
int width = 0;
try {
width = bitmap.getWidth();
} catch (NullPointerException e) {
throw new NoSuchElementException("Can't find bitmap on given view/drawable");
}
int height = bitmap.getHeight();
int bounding = dpToPx(250);
Log.i("Test", "original width = " + Integer.toString(width));
Log.i("Test", "original height = " + Integer.toString(height));
Log.i("Test", "bounding = " + Integer.toString(bounding));
// Determine how much to scale: the dimension requiring less scaling is
// closer to the its side. This way the image always stays inside your
// bounding box AND either x/y axis touches it.
float xScale = ((float) bounding) / width;
float yScale = ((float) bounding) / height;
float scale = (xScale <= yScale) ? xScale : yScale;
Log.i("Test", "xScale = " + Float.toString(xScale));
Log.i("Test", "yScale = " + Float.toString(yScale));
Log.i("Test", "scale = " + Float.toString(scale));
// Create a matrix for the scaling and add the scaling data
Matrix matrix = new Matrix();
matrix.postScale(scale, scale);
// Create a new bitmap and convert it to a format understood by the ImageView
Bitmap scaledBitmap = Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
width = scaledBitmap.getWidth(); // re-use
height = scaledBitmap.getHeight(); // re-use
BitmapDrawable result = new BitmapDrawable(scaledBitmap);
Log.i("Test", "scaled width = " + Integer.toString(width));
Log.i("Test", "scaled height = " + Integer.toString(height));
// Apply the scaled bitmap
view.setImageDrawable(result);
// Now change ImageView's dimensions to match the scaled image
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) view.getLayoutParams();
params.width = width;
params.height = height;
view.setLayoutParams(params);
Log.i("Test", "done");
}
private int dpToPx(int dp) {
float density = getApplicationContext().getResources().getDisplayMetrics().density;
return Math.round((float)dp * density);
}
The xml code for the ImageView:
<ImageView a:id="#+id/image_box"
a:background="#ff0000"
a:src="#drawable/star"
a:layout_width="wrap_content"
a:layout_height="wrap_content"
a:layout_marginTop="20dp"
a:layout_gravity="center_horizontal"/>
Thanks to this discussion for the scaling code:
http://www.anddev.org/resize_and_rotate_image_-_example-t621.html
UPDATE 7th, November 2012:
Added null pointer check as suggested in comments
<ImageView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:adjustViewBounds="true"/>
The Below code make the bitmap perfectly with same size of the imageview. Get the bitmap image height and width and then calculate the new height and width with the help of imageview's parameters. That give you required image with best aspect ratio.
int currentBitmapWidth = bitMap.getWidth();
int currentBitmapHeight = bitMap.getHeight();
int ivWidth = imageView.getWidth();
int ivHeight = imageView.getHeight();
int newWidth = ivWidth;
newHeight = (int) Math.floor((double) currentBitmapHeight *( (double) new_width / (double) currentBitmapWidth));
Bitmap newbitMap = Bitmap.createScaledBitmap(bitMap, newWidth, newHeight, true);
imageView.setImageBitmap(newbitMap)
enjoy.
try adding android:scaleType="fitXY" to your ImageView.
The Best solution that works in most cases is
Here is an example:
<ImageView android:id="#+id/avatar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"/>
this can all be done using XML... the other methods seem pretty complicated.
Anyway, you just set the height to what ever you want in dp, then set the width to wrap content or visa versa. Use scaleType fitCenter to adjust the size of the image.
<ImageView
android:layout_height="200dp"
android:layout_width="wrap_content"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:src="#mipmap/ic_launcher"
android:layout_below="#+id/title"
android:layout_margin="5dip"
android:id="#+id/imageView1">
After searching for a day, I think this is the easiest solution:
imageView.getLayoutParams().width = 250;
imageView.getLayoutParams().height = 250;
imageView.setAdjustViewBounds(true);
Edited Jarno Argillanders answer:
How to fit Image with your Width and Height:
1) Initialize ImageView and set Image:
iv = (ImageView) findViewById(R.id.iv_image);
iv.setImageBitmap(image);
2) Now resize:
scaleImage(iv);
Edited scaleImage method: (you can replace EXPECTED bounding values)
private void scaleImage(ImageView view) {
Drawable drawing = view.getDrawable();
if (drawing == null) {
return;
}
Bitmap bitmap = ((BitmapDrawable) drawing).getBitmap();
int width = bitmap.getWidth();
int height = bitmap.getHeight();
int xBounding = ((View) view.getParent()).getWidth();//EXPECTED WIDTH
int yBounding = ((View) view.getParent()).getHeight();//EXPECTED HEIGHT
float xScale = ((float) xBounding) / width;
float yScale = ((float) yBounding) / height;
Matrix matrix = new Matrix();
matrix.postScale(xScale, yScale);
Bitmap scaledBitmap = Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
width = scaledBitmap.getWidth();
height = scaledBitmap.getHeight();
BitmapDrawable result = new BitmapDrawable(context.getResources(), scaledBitmap);
view.setImageDrawable(result);
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) view.getLayoutParams();
params.width = width;
params.height = height;
view.setLayoutParams(params);
}
And .xml:
<ImageView
android:id="#+id/iv_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />
if it's not working for you then replace android:background with android:src
android:src will play the major trick
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:src="#drawable/bg_hc" />
it's working fine like a charm
Use this code:
<ImageView android:id="#+id/avatar"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
This did it for my case.
<ImageView android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:scaleType="centerCrop"
android:adjustViewBounds="true" />
I needed to have an ImageView and an Bitmap, so the Bitmap is scaled to ImageView size, and size of the ImageView is the same of the scaled Bitmap :).
I was looking through this post for how to do it, and finally did what I want, not the way described here though.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/acpt_frag_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/imageBackground"
android:orientation="vertical">
<ImageView
android:id="#+id/acpt_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:layout_margin="#dimen/document_editor_image_margin"
android:background="#color/imageBackground"
android:elevation="#dimen/document_image_elevation" />
and then in onCreateView method
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_scanner_acpt, null);
progress = view.findViewById(R.id.progress);
imageView = view.findViewById(R.id.acpt_image);
imageView.setImageBitmap( bitmap );
imageView.getViewTreeObserver().addOnGlobalLayoutListener(()->
layoutImageView()
);
return view;
}
and then layoutImageView() code
private void layoutImageView(){
float[] matrixv = new float[ 9 ];
imageView.getImageMatrix().getValues(matrixv);
int w = (int) ( matrixv[Matrix.MSCALE_X] * bitmap.getWidth() );
int h = (int) ( matrixv[Matrix.MSCALE_Y] * bitmap.getHeight() );
imageView.setMaxHeight(h);
imageView.setMaxWidth(w);
}
And the result is that image fits inside perfectly, keeping aspect ratio,
and doesn't have extra leftover pixels from ImageView when the Bitmap is inside.
Result
It's important ImageView to have
wrap_content and adjustViewBounds to true,
then setMaxWidth and setMaxHeight will work, this is written in the source code of ImageView,
/*An optional argument to supply a maximum height for this view. Only valid if
* {#link #setAdjustViewBounds(boolean)} has been set to true. To set an image to be a
* maximum of 100 x 100 while preserving the original aspect ratio, do the following: 1) set
* adjustViewBounds to true 2) set maxWidth and maxHeight to 100 3) set the height and width
* layout params to WRAP_CONTENT. */
I needed to get this done in a constraint layout with Picasso, so I munged together some of the above answers and came up with this solution (I already know the aspect ratio of the image I'm loading, so that helps):
Called in my activity code somewhere after setContentView(...)
protected void setBoxshotBackgroundImage() {
ImageView backgroundImageView = (ImageView) findViewById(R.id.background_image_view);
if(backgroundImageView != null) {
DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
int width = displayMetrics.widthPixels;
int height = (int) Math.round(width * ImageLoader.BOXART_HEIGHT_ASPECT_RATIO);
// we adjust the height of this element, as the width is already pinned to the parent in xml
backgroundImageView.getLayoutParams().height = height;
// implement your Picasso loading code here
} else {
// fallback if no element in layout...
}
}
In my XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout_editor_absoluteY="0dp"
tools:layout_editor_absoluteX="0dp">
<ImageView
android:id="#+id/background_image_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="fitStart"
app:srcCompat="#color/background"
android:adjustViewBounds="true"
tools:layout_editor_absoluteY="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
android:layout_marginRight="0dp"
android:layout_marginLeft="0dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<!-- other elements of this layout here... -->
</android.support.constraint.ConstraintLayout>
Note the lack of a constraintBottom_toBottomOf attribute. ImageLoader is my own static class for image loading util methods and constants.
I am using a very simple solution. Here my code:
imageView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageView.getLayoutParams().height = imageView.getLayoutParams().width;
imageView.setMinimumHeight(imageView.getLayoutParams().width);
My pictures are added dynamically in a gridview. When you make these settings to the imageview, the picture can be automatically displayed in 1:1 ratio.
Use Simple math to resize the image . either you can resize ImageView or you can resize drawable image than set on ImageView . find the width and height of your bitmap which you want to set on ImageView and call the desired method. suppose your width 500 is greater than height than call method
//250 is the width you want after resize bitmap
Bitmat bmp = BitmapScaler.scaleToFitWidth(bitmap, 250) ;
ImageView image = (ImageView) findViewById(R.id.picture);
image.setImageBitmap(bmp);
You use this class for resize bitmap.
public class BitmapScaler{
// Scale and maintain aspect ratio given a desired width
// BitmapScaler.scaleToFitWidth(bitmap, 100);
public static Bitmap scaleToFitWidth(Bitmap b, int width)
{
float factor = width / (float) b.getWidth();
return Bitmap.createScaledBitmap(b, width, (int) (b.getHeight() * factor), true);
}
// Scale and maintain aspect ratio given a desired height
// BitmapScaler.scaleToFitHeight(bitmap, 100);
public static Bitmap scaleToFitHeight(Bitmap b, int height)
{
float factor = height / (float) b.getHeight();
return Bitmap.createScaledBitmap(b, (int) (b.getWidth() * factor), height, true);
}
}
xml code is
<ImageView
android:id="#+id/picture"
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:adjustViewBounds="true"
android:scaleType="fitcenter" />
Quick answer:
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="#drawable/yourImage"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
Just write it in xml
android:scaleType="centerCrop"
Worked for me
In my case, I found the answer buried in a comment on this question (credit to #vida).
android:scaleType="centerInside"
How about using android:scaleType="centerInside" instead of android:scaleType="centerCrop"? It would also not crop the image but ensure that both width and height are less than or equal the imageview's width and height :) Here's a good visual guide for scaletypes: Android ImageView ScaleType: A Visual Guide
I just use ImageView inside ConstraintLayout and set adjustviewbound in ImageView to true.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:src="#drawable/myimg"
android:adjustViewBounds="true"
/>
</androidx.constraintlayout.widget.ConstraintLayout>