這一次，徹底幫你搞明白 ImageView ScaleType

一、概述

ImageView 的 ScaleType 一共八種型別，分別是：

1. CENTER；
2. CENTER_CROP；
3. CENTER_INSIDE；
4. FIT_CENTER；
5. FIT_END；
6. FIT_START；
7. FIT_XY；
8. MATRIX；

由於不同型別的 ScaleType 最終展示的 ImageView 不一樣，再加上 ImageView 的使用頻率非常高，因此，瞭解不同型別的 ScaleType 的作用是十分有必要的。

二、詳述

1. CENTER

   Center the image in the view, but perform no scaling

   在不縮放的前提下，將 Image 的中間顯示在 ImageView 的中間

   • Image 尺寸比 ImageView 尺寸大
     • 只顯示 Image 中間與 ImageView 尺寸相等的部分
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 完整地顯示在 ImageView 中間
   

2. CENTER_CROP

   Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding). The image is then centered in the view.

   Image Width Height 等比例縮放至至少一個方向上 Image 與 ImageView 尺寸一樣（Image 短邊縮放至與 ImageView 對應邊相等（Width 對應 Width，Height 對應 Height）），之後將縮放後的 Image 的中間顯示在 ImageView 的中間

   • Image 尺寸比 ImageView 尺寸大
     • Image 短邊縮小至與 ImageView 對應邊相等，Image 長邊根據相應的縮放係數進行縮放，之後將 Image 中間顯示在 ImageView 中間。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 短邊放大至與 ImageView 對應邊相等，Image 長邊根據相應的縮放係數進行縮放，之後將 Image 中間顯示在 ImageView 中間。
   

3. CENTER_INSIDE

   Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). The image is then centered in the view.

   完整地將 Image 顯示在 ImageView 中間。如果 Image 比 ImageView 尺寸大，則將長邊縮放至與 ImageView 對應邊相等，同時，短邊根據縮放係數縮放。之後，將縮放後的 Image 完整地顯示在 ImageView 上；如果 Image 比 ImageView 尺寸小，直接將 Image 顯示在 ImageView 中間。

   • Image 尺寸比 ImageView 尺寸大
     • Image 長邊縮小至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 中間。
   • Image 尺寸與 Image View 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 不進行任何處理，直接顯示在 ImageView 中間。
   

4. FIT_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.

   完整地將 Image 顯示在 ImageView 中間。如果 Image 比 ImageView 尺寸大，則將長邊縮放至與 ImageView 對應邊相等，同時，短邊根據縮放係數縮放，之後將縮放後的 Image 完整地顯示在 ImageView 上；如果 Image 比 ImageView 尺寸小，則將長邊放大至與 ImageView 對應邊相等，之後將縮放後的 Image 完整地顯示在 ImageView 上。總之，在保證 Image 完整顯示在 ImageView 裡面的前提下，保證在一個方向上，Image 與 ImageView 是相等的。

   • Image 尺寸比 ImageView 尺寸大
     • Image 長邊縮小至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 中間。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 長邊放大至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 中間。
   

5. FIT_END

   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. END aligns the result to the right and bottom edges of dst.

   完整地將 Image 顯示在 ImageView 右邊或下邊。 如果 Image 比 ImageView 尺寸大，則將長邊縮放至與 ImageView 對應邊相等，同時，短邊根據縮放係數縮放，之後將縮放後的 Image 完整地顯示在 ImageView 右邊或下邊；如果 Image 比 ImageView 尺寸小，則將長邊放大至與 ImageView 對應邊相等，之後將縮放後的 Image 完整地顯示在 ImageView 右邊或下邊。總之，在保證 Image 完整顯示在 ImageView 裡面的前提下，保證在一個方向上，Image 與 ImageView 是相等的。

   • Image 尺寸比 ImageView 尺寸大
     • Image 長邊縮小至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 右邊或下邊。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 長邊放大至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 右邊或下邊。
   

6. FIT_START

   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. START aligns the result to the left and top edges of dst.

   完整地將 Image 顯示在 ImageView 左邊或上邊。 如果 Image 比 ImageView 尺寸大，則將長邊縮放至與 ImageView 對應邊相等，同時，短邊根據縮放係數縮放，之後將縮放後的 Image 完整地顯示在 ImageView 左邊或上；如果 Image 比 ImageView 尺寸小，則將長邊放大至與 ImageView 對應邊相等，之後將縮放後的 Image 完整地顯示在 ImageView 左邊或上邊。總之，在保證 Image 完整顯示在 ImageView 裡面的前提下，保證在一個方向上，Image 與 ImageView 是相等的。

   • Image 尺寸比 ImageView 尺寸大
     • Image 長邊縮小至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 左邊或上邊。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 長邊放大至與 ImageView 對應邊相等，Image 短邊根據相應的縮放係數進行縮放，之後將 Image 顯示在 ImageView 左邊或上邊。
   

7. FIT_XY

   Scale in X and Y independently, so that src matches dst exactly. This may change the aspect ratio of the src.

   完整地將 Image 顯示在 ImageView 裡面。 Image X、Y 方向上分別縮放至與 ImageView 對應邊相等，Image 的 Width 和 Height 縮放係數可以不一致。

   • Image 尺寸比 ImageView 尺寸大
     • Image 的 Width、Height 分別縮放至與 ImageView 對應邊相等，之後將 Image 完整地顯示在 ImageView 裡面。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 的 Width、Height 分別縮放至與 ImageView 對應邊相等，之後將 Image 完整地顯示在 ImageView 裡面。
   

8. MATRIX

   Scale using the image matrix when drawing.

   將 Image 從 ImageView 左上角開始顯示。

   • Image 尺寸比 ImageView 尺寸大
     • ImageView 只顯示 Image 中從左上角開始與 ImageView 尺寸相等的部分，多餘的地方不顯示。
   • Image 尺寸與 ImageView 尺寸相等
     • 完整顯示
   • Image 尺寸比 ImageView 尺寸小
     • Image 顯示在 ImageView 的左上角。
   

9. ORIGIN

   ImageView ScaleType 的預設值（我自己加的，用於做對比）， ScaleType 的預設值為 FIT_CENTER。

   

下面是對上面所有情況的彙總，從左至右、從上到下，分別對應上面提到的條目：