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下载

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

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

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • TensorFlow学习--学习率衰减/learning rate decay

    TensorFlow学习--学习率衰减/learning rate decay学习率衰减学习率衰减(learningratedecay)在训练神经网络时,使用学习率控制参数的更新速度.学习率较小时,会大大降低参数的更新速度;学习率较大时,会使搜索过程中发生震荡,导致参数在极优值附近徘徊.为此,在训练过程中引入学习率衰减,使学习率随着训练的进行逐渐衰减.TensorFlow中实现的学习率衰减方法:tf.train.piecewise_constant…

  • ODT 学习笔记「建议收藏」

    ODT 学习笔记「建议收藏」珂朵莉,要一直幸福下去哟!warning:本文在大白天书写,脑子可能不大好用。目前代码选自题解,等有时间自己写一下。简介ODT(OldDriverTree(中文译名张舟树),又称ChthollyTree,即众人皆知的珂朵莉树)是一种非常暴力的思想或者做法(注意我没有说是数据结构)简单来说,其核心思想是把一段区间推平(这也是其适用的地方——区间赋值),推平之后,原数列变成一段一段的了(每段的数值相同),然后就可以搞事了。ODT在随机数据下,复杂度近似O(mlogn)O(mlog

  • 锐捷交换机配置保存到计算机,锐捷交换机常用配置命令汇总「建议收藏」

    锐捷交换机配置保存到计算机,锐捷交换机常用配置命令汇总「建议收藏」前面我们给大家汇总了华为、华三交换机的配置命令,都是非常适合小项目的,当然碰到大型的网络工程,还是需要厂家的专业人才来做。今天再给大家分享一下锐捷交换机的配置命令,这样国内三大家就全部都有了,学习一些基础网络知识还是不错的,尤其在视频监控系统中应用一下,还是可以的。正文:一、连接及远程登录用一台计算机作为控制台和网络设备相连接,通过计算机对网络设备进行配置。1、硬件连接把Console线一端连接在…

  • 永久免费内网穿透软件_不限速内网穿透

    永久免费内网穿透软件_不限速内网穿透三种永久免费内网穿透傻瓜式使用教程方法一(使用qydev)方法二(使用飞鸽内网穿透)方法三使用(神卓互联内网穿透)教程方法一(使用qydev)官网:点击访问1、官网页面:找到客户端下载2、找到自己电脑或者运行平台对应的版本(我的是windows64位)3、下载完成后解压到自己熟悉的文件内保存,解压后,暂时不管她,继续第4步4、登录官网后台:新增隧道点击隧道管理–>开通隧道只需要填写这4项:隧道协议选择:http隧道名称: 取一个独一无二的名字

  • Linux 系统 top 命令详解

    Linux 系统 top 命令详解文章目录前言top命令关键词详解1.VIRT:virtualmemoryusage虚拟内存2.RES:residentmemoryusage常驻内存3.SHR:sharedmemory共享内存4.DATA:数据占用的内存5.top运行中的交互命令top命令图解前言top命令是Linux下常用的性能分析工具,能够实时显示系统状况,比如cpu、内存的使用等。以下详细介绍top命令。top命令关键词详解1.VIRT:virtualmemoryusa

  • 黑苹果 MacOS 10.15 Catalina 安装详细教程带工具资料「建议收藏」

    黑苹果 MacOS 10.15 Catalina 安装详细教程带工具资料「建议收藏」图文教程悦享地址:点击打开链接视频教程B站地址:点击打开链接​一、准备工作  一个8G以上的U盘(有的U盘标的是8G,实际只有X,实际容量小于7.5G的会失败)  MacOS镜像、TransMac(刻录工具)、DiskGenius(分区工具)、EasyUEFI(引导工区)、EFI驱动文件。    二、制作启动U盘  1、将您的U盘插入电脑,为保证成功,首先将U盘以默认值格…

发表回复

您的电子邮箱地址不会被公开。

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