android学习笔记之ImageView的scaleType属性

android学习笔记之ImageView的scaleType属性我们知道,ImageView有一个属性叫做scaleType,它的取值一共有八种,分别是:matrix,fitXY,fitStart,fitCenter,fitEnd,center,centerCrop,centerInside。那我们下面一起来看看这八种取值分别代表什么意思。我用两张图片来做demo,这两张图片的分辨率一大一小,图片分别叫做big和small。原图如下:big:small:OK,

大家好,又见面了,我是你们的朋友全栈君。

我们知道,ImageView有一个属性叫做scaleType,它的取值一共有八种,分别是:matrix,fitXY,fitStart,fitCenter,fitEnd,center,centerCrop,centerInside。那我们下面一起来看看这八种取值分别代表什么意思。

我用两张图片来做demo,这两张图片的分辨率一大一小,图片分别叫做big和small。原图如下:

big:

android学习笔记之ImageView的scaleType属性

small:

android学习笔记之ImageView的scaleType属性

OK,准备工作已经完成。

matrix

matrix表示原图从ImageView的左上角开始绘制,如果原图大于ImageView,那么多余的部分则剪裁掉,如果原图小于ImageView,那么对原图不做任何处理。比如我的两张大小不同的图片,分别显示在96dp×96dp的ImageView上,会有不同的效果,代码如下:

    <ImageView
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:adjustViewBounds="false"
        android:background="#ffaa77"
        android:scaleType="matrix"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:adjustViewBounds="false"
        android:background="#aa99cc"
        android:scaleType="matrix"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

我们看到,big图片由于比较大,因此只有左上角显示出来了,其他部分则被剪裁掉了,而small图片由于分辨率比较小,因此完整的显示在ImageView的左上角。

fitXY

fitXY的目标是填充整个ImageView,为了完成这个目标,它需要对图片进行一些缩放操作,在缩放的过程中,它不会按照原图的比例来缩放。比如下面一个栗子:

    <ImageView
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:background="#ffaa77"
        android:scaleType="fitXY"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="96dp"
        android:layout_height="128dp"
        android:background="#aa99cc"
        android:scaleType="fitXY"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

两张图片都被显示出来了,但是都有一定程度的变形,因为在这里系统只考虑将ImageView填充满,而不会按照原图比例去缩放。

fitStart

将图片按比例缩放至View的宽度或者高度(取宽和高的最小值),然后居上或者居左显示(与前面缩放至宽还是高有关),我们来看下面一个例子:

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="fitStart"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="36dp"
        android:background="#aa99cc"
        android:scaleType="fitStart"
        android:src="@drawable/small" />

显示效果:

android学习笔记之ImageView的scaleType属性

big图片是缩放至ImageView的宽度,然后居上显示,small图片是缩放至ImageView的高度,然后居左显示。

fitCenter

fitCenter和fitStart基本一样,唯一不同的是fitCenter将图片按比例缩放之后是居中显示,看下面一个例子:

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="fitCenter"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="48dp"
        android:background="#aa99cc"
        android:scaleType="fitCenter"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

fitEnd

fitEnd和fitStart也基本一样,唯一不同的是fitEnd将图片按比例缩放之后是居右或者居下显示,比如下面一个Demo:

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="fitEnd"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="48dp"
        android:background="#aa99cc"
        android:scaleType="fitEnd"
        android:src="@drawable/small" />


android学习笔记之ImageView的scaleType属性

center

center表示将原图按照原来的大小居中显示,如果原图的大小超过了ImageView的大小,那么剪裁掉多余部分,只显示中间一部分图像,比如下面一个Demo:

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="center"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="24dp"
        android:background="#aa99cc"
        android:scaleType="center"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

centerCrop

centerCrop的目标是将ImageView填充满,故按比例缩放原图,使得可以将ImageView填充满,同时将多余的宽或者高剪裁掉,比如下面一个Demo :

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="centerCrop"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="48dp"
        android:background="#aa99cc"
        android:scaleType="centerCrop"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

centerInsid

centerInside的目标是将原图完整的显示出来,故按比例缩放原图,使得ImageView可以将原图完整显示,比如下面一个Demo:

    <ImageView
        android:layout_width="48dp"
        android:layout_height="256dp"
        android:background="#ffaa77"
        android:scaleType="centerInside"
        android:src="@drawable/big" />

    <ImageView
        android:layout_width="256dp"
        android:layout_height="48dp"
        android:background="#aa99cc"
        android:scaleType="centerInside"
        android:src="@drawable/small" />

显示效果如下:

android学习笔记之ImageView的scaleType属性

OK,关于scaleType属性我们就说这么多,一般情况下,当我们给ImageView的宽高都为固定值的时候我们才有可能用到这些属性。

Demo下载

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/148306.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 扩展卡尔曼滤波算法及仿真实例[通俗易懂]

    扩展卡尔曼滤波算法及仿真实例[通俗易懂]在阅读本篇博客之前希望读者已经具备线性卡尔曼滤波器的基础,或者提前研读我的前一篇关于线性卡尔曼滤波器的文章:线性卡尔曼滤波算法及示例。下面不说废话,直奔主题了。一、扩展卡尔曼滤波器(EKF)理论基础扩展Kalman滤波器算法实质上是一种在线线性化技术,即安装估计轨道进行线性化处理—-泰勒级数展开,再进行线性的Kalman滤波。实际非线性滤波处理,通常对过程噪声和观测噪声近似为高斯分布,…

    2022年6月22日
    105
  • C++实现字符串分割函数split()「建议收藏」

    C++实现字符串分割函数split()「建议收藏」目录使用strtok()完成分割使用strsep()完成分割使用strtok_r()完成分割实现字符串分割前言最近遇到了一个字符串分割的问题,在C++的标准库里面没有字符分割函数split()。我想这个问题今后可能还会再遇见,所以使用C/C++中的字符串分割方法完成相应的功能。需求:对一个字符串进行分割,然后将分割后的数据存起来,想用的时候像用数组那样拿就行了。所以在完…

    2022年6月3日
    42
  • 产品密钥无法激活成功,最后使用visio2013激活软件激活成功。「建议收藏」

    产品密钥无法激活成功,最后使用visio2013激活软件激活成功。「建议收藏」装了visio2013,使用网上搜索的产品密钥,没有一个能够激活成功。最后发现了visio的一个激活软件KMSpico,成功激活。激活成功教程工具KMSpico_setup.exe下载地址:https://pan.baidu.com/s/1wElfmRaufSpQGloLgQC64g提取码:kv2h安装后,从开始->程序->KMSpico->启动KMSpic…

    2022年6月24日
    66
  • java 可达性分析算法_js并发请求

    java 可达性分析算法_js并发请求作者:Grey原文地址:OkHttpClient调优案例实际案例系统运行一段时间后,线程数量飙升,持续居高不下排查工具https://fastthread.io/这个工具是在线的,可以将日志文件上传上去后直接生成分析报告,并且可以导出为PDF以下是我导出的分析结果值得关注的指标:和占了前两位,由于很多同事开发的时候,没有定义有意义的线程名称,所以这2031个线程不好排查,我们就从这里的线程数入手,很显然,这里是的使用问题,所以,我们排查了一下系统中所有使用的地方,发现所有的用法都是这样用的:因为我们

    2025年6月2日
    6
  • css增加横着滚动条_CSS 设置滚动条样式的实现「建议收藏」

    webkit滚动条样式重置1、scrollbar包含scrollbarbuttons和一个track。track进一步细分为trackpieces和thumb。tracepieces为thumb的上半部分和半下部分。2、scrollbarcorner为横向和竖向的交叉角区域3、resize用来设置滚动条的交汇处上用于拖动调整元素大小的小控件组成结构图如下:一旦发现滚动条的自定义样式,浏览器…

    2022年4月8日
    703
  • ioszip怎么解压_苹果解压app推荐

    ioszip怎么解压_苹果解压app推荐本文介绍了iOS中如何实现gzip解压!

    2025年9月28日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号