How to scale an Image in ImageView to keep the aspect ratio

Question

In Android  I defined an ImageView s layout width to be fill parent  which takes up the full width of the phone    If the image I put to ImageView is bigger than the layout width  Android will scale it  right  But what about the height  When Android scales the image  will it keep the aspect ratio   What I find out is that there is some white space at the top and bottom of the ImageView when Android scales an image which is bigger than the ImageView  Is that true  If yes  how can I eliminate that white space

User · Answer

Programatically apply aspect ratio to Imageview:

aspectRatio = imageWidth/imageHeight   
ratioOfWidth = imageWidth/maxWidth  
ratioOfHeight = imageHeight/maxHeight  


if(ratioOfWidth > ratioOfHeight){???????
    imageWidth = maxWidth 
    imageHeight = imageWidth/aspectRatio
}??????? else if(ratioOfHeight > ratioOfWidth){???????
    imageHeight = maxHeight
    imageWidth = imageHeight * aspectRatio
}???????

After that you can use scaled bitmap to image view

Bitmap scaledBitmap= Bitmap.createScaledBitmap(bitmap, (int) imageWidth , (int) imageHeight , true);

User · Answer

imageView setImageBitmap Bitmap createScaledBitmap bitmap  130  110  false

User · Answer

For anyone of you who wants the image to fit exact the imageview with proper scaling and no cropping use  imageView setScaleType ScaleType FIT XY     where imageView is the view representing your ImageView

User · Answer

You can calculate screen width  And you can scale bitmap    public static float getScreenWidth Activity activity            Display display   activity getWindowManager   getDefaultDisplay            DisplayMetrics outMetrics   new DisplayMetrics            display getMetrics outMetrics           float pxWidth   outMetrics widthPixels          return pxWidth            calculate screen width and scaled image height by screen width   float screenWidth getScreenWidth act    float newHeight   screenWidth    if  bitmap getWidth      0  amp  amp  bitmap getHeight      0         newHeight    screenWidth   bitmap getHeight      bitmap getWidth          After you can scale bitmap   Bitmap scaledBitmap Bitmap createScaledBitmap bitmap   int  screenWidth   int  newHeight  true

User · Answer

Try using android layout gravity for ImageView   android layout width  wrap content  android layout height  0dp  android layout gravity  center vertical center horizontal  android layout weight  1    The example above worked for me

User · Answer

I use this     lt ImageView android id    id logo  android layout width  fill parent  android layout height  fill parent  android layout centerInParent  true  android scaleType  centerInside  android src   drawable logo    gt

User · Answer

in case of using cardviewfor rounding imageview and fixed android layout height for header this worked for me to load image with Glide       lt  xml version  1 0  encoding  utf-8   gt   lt FrameLayout xmlns android  http   schemas android com apk res android               xmlns tools  http   schemas android com tools               android layout width  match parent               android layout height  220dp               xmlns card view  http   schemas android com apk res-auto                gt        lt android support v7 widget CardView             android id    id card view              android layout width  wrap content              android layout height  wrap content              android layout gravity  center top              card view cardBackgroundColor   color colorPrimary              card view cardCornerRadius  10dp              card view cardElevation  10dp              card view cardPreventCornerOverlap  false              card view cardUseCompatPadding  true  gt            lt ImageView                 android adjustViewBounds  true                  android maxHeight  220dp                  android id    id iv full                  android layout width  wrap content                  android layout height  wrap content                  android scaleType  fitCenter   gt        lt  android support v7 widget CardView gt   lt  FrameLayout gt

User · Answer

this solved my problem  android adjustViewBounds  true  android scaleType  fitXY

User · Answer

This worked for me   android layout width  wrap content  android layout height  wrap content  android maxWidth  39dip  android scaleType  centerCrop  android adjustViewBounds   true

User · Answer

I have an image smaller than the screen  To have it stretched proportionally to the max and centered in the view I had to use the following code    lt ImageView     android id    id my image      android layout width  fill parent      android layout height  fill parent      android layout centerInParent  true      android adjustViewBounds  true      android layout weight  1      android scaleType  fitCenter    gt    Have in mind though  that if you have a relative layout and have some elements set to be above or below the ImageView  they will be most likely overlapped by the image

User · Answer

When doing this programmatically  be sure to call the setters in the correct order   imageView setAdjustViewBounds true  imageView setScaleType ImageView ScaleType CENTER CROP

User · Answer

Take a look at ImageView ScaleType to control and understand the way resizing happens in an ImageView  When the image is resized  while maintaining its aspect ratio   chances are that either the image s height or width becomes smaller than ImageView s dimensions

User · Answer

Pass your ImageView and based on screen height and width you can make it       public void setScaleImage EventAssetValueListenerView view              Get the ImageView and its bitmap         Drawable drawing   view getDrawable            Bitmap bitmap     BitmapDrawable drawing  getBitmap               Get current dimensions         int width   bitmap getWidth            int height   bitmap getHeight             float xScale     float  4    width          float yScale     float  4    height          float scale    xScale  lt   yScale    xScale   yScale           Matrix matrix   new Matrix            matrix postScale scale  scale            Bitmap scaledBitmap   Bitmap createBitmap bitmap  0  0  width  height  matrix  true           BitmapDrawable result   new BitmapDrawable scaledBitmap           width   scaledBitmap getWidth            height   scaledBitmap getHeight             view setImageDrawable result            LinearLayout LayoutParams params    LinearLayout LayoutParams  view getLayoutParams            params width   width          params height   height          view setLayoutParams params

User · Answer

I have an algorithm to scale a bitmap to bestFit the container dimensions  maintaining its aspect ratio  Please find my solution here Hope this helps someone down the lane

User · Answer

Below code Working for scale image as aspect ratio   Bitmap bitmapImage   BitmapFactory decodeFile  Your path    int nh    int    bitmapImage getHeight      512 0   bitmapImage getWidth       Bitmap scaled   Bitmap createScaledBitmap bitmapImage  512  nh  true   your imageview setImageBitmap scaled

User · Answer

If you want an ImageView that both scales up and down while keeping the proper aspect ratio  add this to your XML   android adjustViewBounds  true  android scaleType  fitCenter    Add this to your code      We need to adjust the height if the width of the bitmap is    smaller than the view width  otherwise the image will be boxed  final double viewWidthToBitmapWidthRatio    double image getWidth      double bitmap getWidth    image getLayoutParams   height    int   bitmap getHeight     viewWidthToBitmapWidthRatio     It took me a while to get this working  but this appears to work in the cases both where the image is smaller than the screen width and larger than the screen width  and it does not box the image

User · Answer

You can scale image that will also reduce the size of your image  There is a library for it you can download and use it  https   github com niraj124124 Images-Files-scale-and-compress git  How to use 1 Import the compressor-v1 0  jar to your project  2 Add the below sample code to test      ResizeLimiter resize   ImageResizer build        resize scale  inputImagePath    outputImagePath  imageWidth  imageHeight   Many more methods are there according to your requirement

User · Answer

Quick answer    lt 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    gt

User · Answer

Yes  by default Android will scale your image down to fit the ImageView  maintaining the aspect ratio  However  make sure you re setting the image to the ImageView using android src  quot     quot  rather than android background  quot     quot   src  makes it scale the image maintaining aspect ratio  but background  makes it scale and distort the image to make it fit exactly to the size of the ImageView   You can use a background and a source at the same time though  which can be useful for things like displaying a frame around the main image  using just one ImageView    You should also see android adjustViewBounds to make the ImageView resize itself to fit the rescaled image  For example  if you have a rectangular image in what would normally be a square ImageView  adjustViewBounds true will make it resize the ImageView to be rectangular as well  This then affects how other Views are laid out around the ImageView  Then as Samuh wrote  you can change the way it default scales images using the android scaleType parameter  By the way  the easiest way to discover how this works would simply have been to experiment a bit yourself  Just remember to look at the layouts in the emulator itself  or an actual phone  as the preview in Eclipse is usually wrong

User · Answer

To anyone else having this particular issue  You have an ImageView that you want to have a width of fill parent and a height scaled proportionately   Add these two attributes to your ImageView   android adjustViewBounds  true  android scaleType  centerCrop    And set the ImageView width to fill parent and height to wrap content   Also  if you don t want your image to be cropped  try this    android adjustViewBounds  true   android layout centerInParent  true

User · Answer

If you want your image occupy the maximum possible space then the best option would be  android layout weight  1  android scaleType  fitCenter

User · Answer

Use these properties in ImageView to keep aspect ratio   android adjustViewBounds  true  android scaleType  fitXY    lt ImageView     android layout width  wrap content      android layout height  wrap content      android adjustViewBounds  true      android scaleType  fitXY        gt

User · Answer

This is how it worked for me inside a ConstraintLayout    lt ImageView     android id    id myImg      android layout width  300dp      android layout height  300dp      android scaleType  fitCenter      android adjustViewBounds  true   gt    Then in code  I set the drawable as   ImageView imgView   findViewById R id myImg   imgView setImageDrawable ResourcesCompat getDrawable getResources    R drawable image to show  null      This fits the image nicely according to its aspect ratio and keeps it in centre

User · Answer

See android adjustViewBounds      Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable

User · Answer

Yo don t need any java code  You just have to     lt ImageView android layout width  match parent  android layout height  match parent  android adjustViewBounds  true  android scaleType  centerCrop    gt    The key is in the match parent for width and height

User · Answer

If image quality decreases in   use  android adjustViewBounds  true    instead of   android adjustViewBounds  true  android scaleType  fitXY

[android] How to scale an Image in ImageView to keep the aspect ratio

Examples related to android

Examples related to android-imageview

Examples related to image-scaling