Flutter 之图像镜像功能

2,152 阅读5分钟

🌹 ⭐️ 🌹请首先看我 🌹 ⭐️ 🌹

  1. 下面介绍的功能都是有 iimage 库提供。
  2. 下面该功能需要 iimage ^ 0.0.1 以及以上可以使用。
  3. iimage 包的引入方式如下:
    1. 可以手动引入 idkit 包,就是将 iimage ^ 0.0.1 放在项目的 pubspec.yaml 文件的 dependencies 模块下,然后执行 flutter pub get 指令即可。
    2. 可以使用后指令 flutter pub add iimage 在项目根目录终端下执行即可。

[》跳过拾光记忆]

拾光记忆

1. Flutter 项目资产管理,看这一篇就够了!

简介: 针对 Flutter 项目资产管理的脚本服务。Fam 具有以下特点: 支持多种平台以及各平台无差异化、界面美观、功能齐全、快捷方便。
推荐: ⭐️⭐️⭐️⭐️⭐️

2. Flutter 手势在多指触摸时一些方法会多次触发

简介: 针对 Flutter 多手指检测以及手势触发其他手势也触发的问题。
推荐: ⭐️⭐️⭐️⭐️⭐️

3. Dart 的枚举类型的高阶用法

简介: 这是让开发者更深入的了解 Dart 的枚举以及相关使用和方法。
推荐: ⭐️⭐️⭐️

4. Flutter 可以快速实现单项或者多项选择,你知道吗?

简介: 这是让开发者更加便捷的实现单选、多选功能,无需你对数据处理。
推荐: ⭐️⭐️⭐️⭐️⭐️

5. Flutter 的吸收指针和忽略指针的作用以及区别

简介: 这是让开发者更深入的了解 Flutter 的两种指针的介绍以及相关使用和方法。
推荐: ⭐️⭐️⭐️

6. Flutter 项目滑动轨道的高阶用法

简介: 这是让开发者更加便捷的实现多种样式的轨道滑块,比如:轨道渐变色、触控笔悬浮标等。
推荐: ⭐️⭐️⭐️⭐️⭐️

7. Flutter 的 Debug 日志管理,可自定义多种输出样式

简介: 这是让开发者更加便捷的查看日志,通过日志能够分析变量当前数值以及业务逻辑走势,同时也能作为日志收集日志文本。
推荐: ⭐️⭐️⭐️⭐️⭐️

8. Flutter 中 Image 图像便捷添加图片水印或者文字水印

简介: 这是让开发者更加便捷的实现图像添加图片类型的水印和文字类型的水印,支持水印多种样式的设定。
推荐: ⭐️⭐️⭐️⭐️⭐️

9. Flutter 中 Image 图像的高阶用法,你知道多少?

简介: IImage 是 IDKit 的其中一个功能模块,它提供了许多方便的图像处理方法,例如:尺寸调整、相对某点的矩形位置、大小调整、图像缩放、背景去除、真实内容尺寸获取以及真实内容图像获取等等。
推荐: ⭐️⭐️⭐️⭐️⭐️

10. Flutter 中的 Matrix4,它有 16 个参数,您都知道它们的含义吗?

简介: 该篇主要介绍 Matrix4 的 16 个参数的含义。
推荐: ⭐️⭐️⭐️⭐️

11. Flutter中道颜色(Color)的差异,你知道是如何计算的吗?

简介: 该篇主要介绍 Flutter 中所有颜色的模式以及对应颜色的一些便捷方法有和LAB 颜色的支持以及颜色差异提供算法。
推荐: ⭐️⭐️⭐️⭐️⭐️

12. Flutter 中有填充或者泛洪或者油漆桶功能可以处理图像,你知道吗?

简介: 该篇主要介绍 Flutter 中如何实现图像的油漆桶、填充功能或者图像泛洪算法。
推荐: ⭐️⭐️⭐️⭐️⭐️

[返回拾光记忆《]

一、简述

在使用一些图像处理软件时,我们可能会使用到镜像这个功能。图像镜像就是把图像照镜子,镜子中显示的图像就是要得到的图像。目前,该功能已经在各种编辑软件中普及,那么 Flutter 怎么实现这种功能呢? 淡定!!!, 复杂的事情,总会有人做! 在 Flutter 中有个 iimage 包就提供了实现的方法。

二、iimage 提供镜像方法介绍

iimage 提供了三种图像实现镜像的方法,如下所示:

  • static Future<Image> mirrorFromUint32List({ required Uint32List uint32list, required int imageWidth, required int imageHeight, MirrorType mirrorType = MirrorType.none, PixelFormat pixelFormat = PixelFormat.rgba8888, })

    该方法是由图像的像素 Uint32List 集合以及图像的宽与高来实现图像的镜像的,方法返回一个 Future<Image> 类型。它的参数介绍如下:

    • uint32list: 要实现镜像的图像的像素集合。

    • imageWidth & imageHeight: 要实现镜像的图像的宽与高。

    • mirrorType: 要实现镜像的形式,有 lr(左右) 和 td(上下) 两种形式,默认为 none。

    • pixelFormat: 要以什么像素格式将 Uint32List 像素集合生成图像。

    注意: uint32list 是图像的像素数据集合,不是图像的二进制 Uint8List 转化生成的 Uint32List 集合。图像像素集合的获取方法是 image.toByteData(),该方法有一个 ImageByteFormat 类型的 format 参数,你可根据自己的需求调整该参数。

  • static Future<Image?> mirrorFromImage({ required Image image, MirrorType mirrorType = MirrorType.none, ImageByteFormat byteFormat = ImageByteFormat.rawRgba, PixelFormat pixelFormat = PixelFormat.rgba8888, bool isDispose = false, })

    该方法是由图像为参数直接镜像,方法返回 Future<Image?> 类型的结果。它的参数介绍如下:

    • image: 要镜像的图像。

    • mirrorType: 要实现镜像的形式,有 lr(左右) 和 td(上下) 两种形式,默认为 none。

    • pixelFormat: 要以什么像素格式将 Uint32List 像素集合生成图像。

    • isDispose: 是否在图像镜像完毕后释放要镜像的图像。

  • static void mirrorUint32List({ required Uint32List uint32list, required int imageWidth, required int imageHeight, MirrorType mirrorType = MirrorType.none, })

    该方法是将传入的图像像素的 Uint32List 的集合镜像。要注意的是镜像之后,则 uint32list 就是镜像的结果。该方法的参数介绍:

    • uint32list: 要实现镜像的图像的像素集合。

    • imageWidth & imageHeight: 要实现镜像的图像的宽与高。

    • mirrorType: 要实现镜像的形式,有 lr(左右) 和 td(上下) 两种形式,默认为 none。

三、镜像的原理

图像的镜像原理其实很简单,下面我们将介绍左右镜像和上下镜像:

  • 上下镜像

    image.png

  • 左右镜像

    image.png

注意: 我们要区分组件镜像和图像镜像的区别。组件镜像了,但是传入组件的图像并没有镜像,它还是原始图像。图像的镜像则是彻底的修改图像原始数据而改变的。大家要区分开来,合理的选择来完成自己的业务。

四、 图像镜像应用

下面是图像镜像的一个小例子,视图效果如下:

mirror.gif

附上次演示的视频的 demo 地址,欢迎获取。如果您感觉还行,请留下你的爱心以示对我的支持和鼓励。