ARTICLE · INTELLIGENCE

战地情报 · 详情页

来自尧图项目组的一线实战观察与深度解析

SuperImageView 配置详解:XML 属性与代码 API 两种姿势一篇掌握

SuperImageView 配置详解:XML 属性与代码 API 两种姿势一篇掌握 SuperImageView 配置详解XML 属性与代码 API 两种姿势一篇掌握【免费下载链接】SuperImageViewCrop and Rounded Corners added to an ImageView.项目地址: https://gitcode.com/gh_mirrors/su/SuperImageViewSuperImageView 是一个为 Android ImageView 添加图片裁剪Crop与圆角Rounded Corners能力的开源增强库它的核心卖点在于同一个控件既能按任意方向裁剪图片又能轻松绘制圆角且配置方式极其灵活。这篇 SuperImageView 配置详解将带你掌握它的两种主流用法——XML 属性声明式配置与代码 API 动态配置从零开始一篇学会。SuperImageView 是什么先认识它的两个超能力 ⚡SuperImageView 本身继承自AppCompatImageView因此它具备普通 ImageView 的全部能力同时又通过功能插拔的方式提供了两个独立模块功能模块作用核心实现类图片裁剪将图片按 9 个方向左上、居中、右下……对齐裁剪到控件边界CroppedImage圆角绘制为图片绘制整体或单边圆角RoundedCornersImage关键的设计思路是**反射 接口实现**你在布局里通过属性指定要加载哪个功能类SuperImageView.java 会自动实例化并接入绘制流程代码结构非常干净。SuperImageView 对任意图片都能按指定方向完成裁剪与圆角处理方式一XML 属性配置 SuperImageView布局优先场景如果你希望写死在布局里、一次配置到处复用XML 属性是最直观的方式。整个配置只需要两步。第一步引入依赖模块SuperImageView 采用多模块结构按需引入即可核心控件superimageview模块裁剪功能superimageview-imagecrop模块圆角功能superimageview-roundedcorners模块在settings.gradle中声明项目后给对应模块添加依赖例如裁剪模块依赖project(:superimageview-imagecrop)、圆角模块依赖project(:superimageview-roundedcorners)核心模块则由它们自动带入。第二步在布局中声明控件并配置属性在 XML 里把普通 ImageView 换成SuperImageView然后通过 attrs.xml 中定义的两个核心属性来指定功能实现类com.codeforvictory.android.superimageview.SuperImageView android:layout_widthmatch_parent android:layout_height200dp android:srcdrawable/sample app:siv_cropImplementationcom.codeforvictory.android.superimageview.crop.CroppedImage app:siv_roundedCornersImplementationcom.codeforvictory.android.superimageview.roundedcorners.RoundedCornersImage / 两个属性都填上就能同时获得裁剪 圆角能力只填一个则只启用对应功能。图片裁剪方向怎么配一张表看懂siv_crop裁剪模块在 attrs.xml 中定义了siv_crop枚举属性取值与含义对应如下属性值含义topLeft/centerLeft/bottomLeft图片靠左顶部 / 居中 / 底部对齐topRight/centerRight/bottomRight图片靠右顶部 / 居中 / 底部对齐centerTop/centerBottom图片水平居中靠上 / 靠下对齐典型配置示例让图片右下角对齐裁剪com.codeforvictory.android.superimageview.SuperImageView android:layout_width300dp android:layout_height300dp app:siv_cropImplementationcom.codeforvictory.android.superimageview.crop.CroppedImage app:siv_cropbottomRight /圆角半径怎么配整体与单角任选圆角模块在 attrs.xml 中提供了 5 个维度属性siv_cornerRadius四个角统一圆角半径siv_cornerRadiusTopLeft/siv_cornerRadiusTopRight单独控制左上、右上siv_cornerRadiusBottomLeft/siv_cornerRadiusBottomRight单独控制左下、右下最省事的写法是只配整体半径想要一个角直角、其余圆角的个性化效果时再用单角属性覆盖。com.codeforvictory.android.superimageview.SuperImageView android:layout_width200dp android:layout_height200dp app:siv_roundedCornersImplementationcom.codeforvictory.android.superimageview.roundedcorners.RoundedCornersImage app:siv_cornerRadius16dp /方式二代码 API 动态配置 SuperImageView运行时切换场景当裁剪方向需要跟随用户操作动态变化时比如相册编辑、头像选择XML 就力不从心了。这时使用代码 API 更合适。用getFeature()拿到功能实例SuperImageView提供了泛型方法getFeature(ClassT)传入功能实现类即可取出对应实例SuperImageView imageView findViewById(R.id.image_view); CroppedImage croppedImage imageView.getFeature(CroppedImage.class);代码动态设置裁剪方向拿到CroppedImage实例后调用 CroppedImage.java 中定义的setCropType()方法即可随时切换croppedImage.setCropType(CropType.BOTTOM_RIGHT); // 右下对齐裁剪 int current croppedImage.getCropType(); // 读取当前裁剪方向方向常量定义在 CropType.java 中共 9 种NONE不裁剪、TOP_LEFT、LEFT、BOTTOM_LEFT、TOP_RIGHT、RIGHT、BOTTOM_RIGHT、TOP、BOTTOM覆盖了所有常见的对齐需求。⚠️ 注意裁剪功能依赖ScaleType.MATRIX才能正常工作。CroppedImage在设置裁剪类型时会自动切换 scaleType因此请勿在代码里手动覆盖setScaleType()否则裁剪会被重置。代码动态设置圆角同理通过getFeature(RoundedCornersImage.class)拿到圆角实例后可以在运行时调整圆角半径。圆角与裁剪互不干扰二者可以放心叠加使用这是 SuperImageView 相比单功能图片库的一大优势。XML 与代码 API 如何选型一张表帮你决策 对比维度XML 属性配置代码 API 配置适用场景布局固定、样式写死运行时动态切换、交互联动配置成本一行属性搞定需写获取实例的代码可读性布局即文档一目了然逻辑集中在 Java/Kotlin灵活性低改配置需改 XML高可响应用户操作建议静态展示类图片列表封面、头像展示用 XML编辑类、交互类场景裁剪预览、圆角调节用代码 API。两者并非二选一——同一控件里裁剪用 XML、圆角用代码 API 混搭也完全没问题。常见问题与避坑指南 ️属性不生效检查是否在布局根节点声明了命名空间xmlns:apphttp://schemas.android.com/apk/res-auto且siv_cropImplementation填写的类名必须完整含包名。裁剪没反应确认siv_crop已设置且图片源已加载另外功能类需要在对应模块引入后才能被反射找到请核对依赖是否齐全。圆角出现黑边/锯齿优先使用偶数圆角值并在设置图片时避免超大尺寸位图必要时在代码中配合抗锯齿绘制RoundedCornersImage内部已使用ANTI_ALIAS_FLAG。总结SuperImageView 把裁剪 圆角两大高频图片处理需求封装进了一个普通 ImageView 里配置上给出了XML 属性和代码 API两套完整方案让新手可以零成本上手、老手可以精细控制。掌握本篇的配置思路后你的列表封面、头像、商品图都能一张控件优雅搞定。动手把依赖加进项目试试吧【免费下载链接】SuperImageViewCrop and Rounded Corners added to an ImageView.项目地址: https://gitcode.com/gh_mirrors/su/SuperImageView创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED READING

延伸阅读

更多一线实战笔记与深度复盘,助您持续精进