Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

本文主要是介绍Android使用ImageView.ScaleType实现图片的缩放与裁剪功能,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

《Android使用ImageView.ScaleType实现图片的缩放与裁剪功能》ImageView是最常用的控件之一,它用于展示各种类型的图片,为了能够根据需求调整图片的显示效果,Android提...

什么是 ImageView.ScaleType?

ImageView.ScaleType 是一个枚举类,它定义了不同的缩放方式,用于控制图片如何在 ImageView 中展示。

public enum ScaleType {
      MATRIX      (0),
      FIT_XY      (1),
      FIT_START   (2),
      FIT_CENTER  (3),
      FIT_END     (4),
      CENTER      (5),
      CENTER_CROP (6),
      CENTER_INSIDE (7);

      ScaleType(int ni) {
         nativeInt = ni;
      }
      final int nativeInt;
}

先看下源图:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

图片1尺寸是1200x857,且宽 > 高;图片2尺寸967x1301,且宽<高;图片3尺寸60x60,且宽=高。 XML代码如下:

<LinearLayout
    andrjsoid:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:orientation="horizontal"
    android:gravity="center">

    <ImageView
        android:id="@+id/iv_1"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:background="@color/gray_normal"
        android:src="@drawable/icon_cat_w" />

    <ImageView
        android:id="@+id/iv_2"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:background="@color/gray_normal"
        android:layout_marginStart="10dp"
        android:src="@drawable/icon_cat_h" />

    <ImageView
        android:id="@+id/iv_3"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_marginStart="10dp"
        android:background="@color/gray_normal"
        android:src="@drawable/chat_ask_message_error" />
</LineChina编程arLayout>

我的测试机上density = 3,而ImageView控件的目标宽高都是120dp,即宽高都是360x360。

FIT_XY

图片完全填充 ImageView,不保持原始宽高比,可能会导致图片拉伸或压缩变形。本质上使用 Matrix.ScaleToFit.FILL 来实现,上面代码中加上android:scaleType="fitXY",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

FIT_START

等比缩放图片,使其宽高都不超过 ImageView 的尺寸,然后左上角对齐。上面代码中加上android:scaleType="fitStart",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

FIT_CENTER

等比缩放图片,使其宽高都不超过 ImageView 的尺寸,然后居中显示。上面代China编程码中加上android:scaleType="fitCenter",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

FIT_END

等比缩放图片,使其宽高都不超过 ImageView 的尺寸,然后对齐到底部或右侧。上面代码中加上android:scaleType="fitEnd",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

CENTER

不缩放图片,直接居中显示,如果图片大于 ImageView,超出的部分不会显示。上面代码中加上android:scaleType="center",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

CENTER_CROP

等比放大图片,确保 ImageView 填满,超出的部分裁剪掉,居中对齐,适用于头像、封面图等,填满 ImageView 且保持图片比例。上面代码中加上android:scaleType="centerCrop",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

CENTER_INSIDE

等比缩小图片,确保整个图片显示在 ImageView 里。如果图片小于 ImageView,不会放大。上面代码中加上android:scaleType="fitStart",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

MATRIX

完全由开发者控制,允许精确地设置图片的缩放、旋转、平移等变换。ScaleType.MATRIX不会自动进行缩放或平移,开发者需要通过 Matrix 来手动调整。默认上面代码中加上android:scaleType="matrix",效果如下:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

特殊需求:从顶部裁剪图片

在某些情况下,你可能希望图片从顶部开始展示,裁剪掉底部溢出的部分。默认的 CENTER_CROP 会居中裁剪图片,但如果希望图片从顶部开始裁剪,可以使用 scaleType="matrix",然后通过 Matrix 来控制,代码如下:

imageView.post {
    val drawable = imageView.drawable
    drawable?.let {
        val matrix = Matrix()
        //计算缩放比例,确保宽度填充满 ImageView
        val scale = imageView.width.toFloat() / it.intrinsicWidth
        matrix.setScale(scale, scale)
        //不平移,确保图片从顶部开始展示
        matrix.postTranslate(0f, 0f)
        //应用 Matrix 到 ImageView
        imageView.imageMatrix = matrix
    }
}

执行效果:

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

可以看到结果中,图片1 因为宽>高,所以会直接从上往下排完;而图片2 宽<高,所以从上往下排列后,底部被裁剪了;图片3 宽等于高,所以还是可以完全展示。

结论

  • FIT_开头的4种(fitCenter、fitXY、fitStart、fitEnd),都可以对图片进行缩放;
  • CENTER_开头的3种(center、centerCrop、centerInside),都可以居中显示;图片中心点与ImagChina编程eView中心点重叠;
  • fitCentercenterInside 都可以居中展示,两者区别:centerInside 只缩小,不放大;fitCenter 可放大可缩小。
  • MATRIX 是最灵活的 ScaleType,能够完全控制图片的缩放、平移和旋转,适合需要自定义展示的场景。
ScaleType缩放方式是否填满ImageView是否裁剪对齐方式
MATRIX自定义由 Matrix 决定
FIT_XY拉伸填充是(可能会变形)填充整个 ImageView
FIT_START等比缩放顶部/左侧对齐
FIT_CENTER等比缩放居中对齐
FIT_END等比缩放底部/右侧对齐
CENTER不缩放可能裁剪居中对齐
CENTER_CROP等比放大可能裁剪居中对齐
CENTER_INSIDE等比缩小居中对齐

选择合适的 ScaleType,可编程China编程以大大提高图片显示的效果和用户体验。理解并灵活应用这些选项,可以帮助我们更好地处理不同的图片展示需求。

以上就是Android使用ImageView.ScaleType实现图片的缩放与裁剪功能的详细内容,更多关于Android ImageView.ScaleType图片缩放与裁剪的资料请关注China编程(www.chinasem.cn)其它相关文章!

这篇关于Android使用ImageView.ScaleType实现图片的缩放与裁剪功能的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1154394

相关文章

Python并行处理实战之如何使用ProcessPoolExecutor加速计算

《Python并行处理实战之如何使用ProcessPoolExecutor加速计算》Python提供了多种并行处理的方式,其中concurrent.futures模块的ProcessPoolExecu... 目录简介完整代码示例代码解释1. 导入必要的模块2. 定义处理函数3. 主函数4. 生成数字列表5.

Python中help()和dir()函数的使用

《Python中help()和dir()函数的使用》我们经常需要查看某个对象(如模块、类、函数等)的属性和方法,Python提供了两个内置函数help()和dir(),它们可以帮助我们快速了解代... 目录1. 引言2. help() 函数2.1 作用2.2 使用方法2.3 示例(1) 查看内置函数的帮助(

Linux脚本(shell)的使用方式

《Linux脚本(shell)的使用方式》:本文主要介绍Linux脚本(shell)的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录概述语法详解数学运算表达式Shell变量变量分类环境变量Shell内部变量自定义变量:定义、赋值自定义变量:引用、修改、删

Python实现精准提取 PDF中的文本,表格与图片

《Python实现精准提取PDF中的文本,表格与图片》在实际的系统开发中,处理PDF文件不仅限于读取整页文本,还有提取文档中的表格数据,图片或特定区域的内容,下面我们来看看如何使用Python实... 目录安装 python 库提取 PDF 文本内容:获取整页文本与指定区域内容获取页面上的所有文本内容获取

基于Python实现一个Windows Tree命令工具

《基于Python实现一个WindowsTree命令工具》今天想要在Windows平台的CMD命令终端窗口中使用像Linux下的tree命令,打印一下目录结构层级树,然而还真有tree命令,但是发现... 目录引言实现代码使用说明可用选项示例用法功能特点添加到环境变量方法一:创建批处理文件并添加到PATH1

Java使用HttpClient实现图片下载与本地保存功能

《Java使用HttpClient实现图片下载与本地保存功能》在当今数字化时代,网络资源的获取与处理已成为软件开发中的常见需求,其中,图片作为网络上最常见的资源之一,其下载与保存功能在许多应用场景中都... 目录引言一、Apache HttpClient简介二、技术栈与环境准备三、实现图片下载与保存功能1.

Python中使用uv创建环境及原理举例详解

《Python中使用uv创建环境及原理举例详解》uv是Astral团队开发的高性能Python工具,整合包管理、虚拟环境、Python版本控制等功能,:本文主要介绍Python中使用uv创建环境及... 目录一、uv工具简介核心特点:二、安装uv1. 通过pip安装2. 通过脚本安装验证安装:配置镜像源(可

LiteFlow轻量级工作流引擎使用示例详解

《LiteFlow轻量级工作流引擎使用示例详解》:本文主要介绍LiteFlow是一个灵活、简洁且轻量的工作流引擎,适合用于中小型项目和微服务架构中的流程编排,本文给大家介绍LiteFlow轻量级工... 目录1. LiteFlow 主要特点2. 工作流定义方式3. LiteFlow 流程示例4. LiteF

使用Python开发一个现代化屏幕取色器

《使用Python开发一个现代化屏幕取色器》在UI设计、网页开发等场景中,颜色拾取是高频需求,:本文主要介绍如何使用Python开发一个现代化屏幕取色器,有需要的小伙伴可以参考一下... 目录一、项目概述二、核心功能解析2.1 实时颜色追踪2.2 智能颜色显示三、效果展示四、实现步骤详解4.1 环境配置4.

canal实现mysql数据同步的详细过程

《canal实现mysql数据同步的详细过程》:本文主要介绍canal实现mysql数据同步的详细过程,本文通过实例图文相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的... 目录1、canal下载2、mysql同步用户创建和授权3、canal admin安装和启动4、canal