图片尺寸自适应算法

废话不说，直接到正题。

 

将用户选择的图片，直接加载到一个固定大小的容器内。如果被加载的图片大小和容器的大小及宽高一致，那么图片比例失调的概率极大。如何让图片加载到容器内有保持比例不失调呢？想一个算法吧！

 

设容器宽为W，高为H，则宽高比例为W/H=A；

设被加载图片宽为W'，高为H'，则被加载图片宽高为W'/H'=A'；

设修正后的被加载图片宽为W''，高为H''。

 

下面分情况讨论：

 

A>1的情况

1. 若A'>A，这时被加载图片相对容器更宽，更矮。

因此，被加载图片宽度 = 容器宽度， 被加载图片高度 = 原有宽高比率下的现有宽度对应的高度；

则，W'' = W, H'' = W'' / A' = W / ( W' / H' ) = W * H' / W' = H' * ( W / W' ); 

2. 若A'<A且A'>1，这时被加载图片相对容器更高，更窄。

因此，被加载图片高度 = 容器高度， 被加载图片宽度 = 原有宽高比率下的现有宽度对应的宽度；

则，H'' = H, W'' = H'' * A' = H * ( W' / H' ) = H * W' / H' = W' * ( H / H' );

3. 若A'<A且A'<1，这时被加载图片相对容器更高，更窄。

因此，被加载图片高度 = 容器高度， 被加载图片宽度 = 原有宽高比率下的现有宽度对应的宽度；

则，H'' = H, W'' = H'' * A' = H * ( W' / H' ) = H * W' / H' = W' * ( H / H' );

4. 若A'<A且A'=1，这时被加载图片为正方形。

因此，应该取容器最小变作为被加载图片的边长；由于目前容器更宽，因此取容器高为被加载图片的边长；

则算法同2，3.

5. 若A' = A，这时被加载图片和容器的宽高比率相同。

因此，W'' = W, H'' = H。

 

A<1的情况

1. 若A'>A且A'>1，这时被加载图片相对容器更宽，更矮。

因此，算法同（A>1的情况中的算法1）

2. 若A'>A且A'=1，这时被加载图片为正方形，相对容器较宽，较矮。

因此，算法同（A>1的情况中的算法1）

3. 若A'>A且A'<1，这时被加载图片相对容器更宽，更矮。

因此，算法同（A>1的情况中的算法1）

4. 若A'<A，这时被加载图片相对容器更高，更窄。

因此，算法同（A>1的情况中的算法2，3）

5. 若A' = A，这时被加载图片和容器宽高比率相同。

因此，W'' = W, H'' = H;

 

 

在A=1的情况下

1. 若A'>A，这时被加载图片相对容器更宽，更矮。

因此，算法同（A>1的情况中的算法1）

2. 若A'<A，这时被加载图片相对容器更高，更窄。

因此，算法同（A>1的情况中的算法2，3）

3. 若A' = A，W'' = W, H'' = H.

 

综合上述三种情况，可以得出以下结论：

若被加载图片相对容器更宽，更矮：

即当A' > A时，W'' = W, H'' = W / A';

若被加载图片相对容器更高，更窄：

即当A' < A时，H'' = H, W'' = H * A';

若被加载图片宽高比与容器相当：

即当A' = A时，W'' = W, H'' = H。

 

测试文件已经上传，欢迎大家评点