iOS 判断触摸位置是否在图片的透明区域

news/2024/7/20 20:33:43 标签: ios, swift, 图像处理

装扮功能系列:

  1. Swift 使用UIScrollerView 实现装扮功能(基础)
  2. Swift 使用UIScrollerView 实现装扮功能(拓展)
  3. iOS 判断触摸位置是否在图片的透明区域

背景

在装扮功能中,一般都是长按使道具进入编辑状态,两个物品重叠一部分并且上面一个道具具有较大的透明区域时,明明想编辑的是下面一个道具,然而进入编辑状态的却是在上面的较大的一个道具。那么我们可以如何优化用户体验呢?可以通过判断触摸点的位置,如果是透明区域就不响应不进入编辑状态,从上到下遍历,直到找到非透明的道具然后将它设为编辑状态。
请添加图片描述

图片组成

图片的组成主要由像素(Pixels)和元数据(Metadata)两部分构成。

  1. 像素:图片是由一个个像素点组成的。每个像素代表图像中的一个小区域,并包含了该区域的颜色信息。常见的颜色模型是RGB(红绿蓝),每个像素的颜色由红、绿、蓝三个分量的数值来表示。每个分量的数值通常以8位无符号整数(0-255)的形式表示,可以通过不同的数值组合形成各种颜色。除了红、绿、蓝三个分量,每个像素还可以包含一个透明度分量。透明度分量用于表示像素的不透明度或透明度,决定了像素在图像中的可见程度。透明度值通常以8位无符号整数(0-255)表示,其中0表示完全透明,255表示完全不透明。
  2. 元数据:除了像素数据之外,图片还包含了一些描述图像属性和特征的元数据。元数据可以包括图像的尺寸、分辨率、创建日期、拍摄设备信息、拍摄参数、版权信息等。元数据提供了对图像的更多信息和上下文,使得图片的使用和管理更加方便和有意义。常见的图像文件格式如JPEG、PNG等都支持存储元数据。

分析和实现需求

当我们理解啦图片的基本构成后,我们的需求就可以理解成:判断当前触摸点在图片上对应的位置上的像素点,获取像素点的颜色信息中的透明度的值,透明度的值为0的话,就判定当前点击的位置是图片的透明区域,否则就是非透明区域。

一、位置转换
前提:图片是等比例缩放布局显示的
将当前触摸点的位置转换为图片上的位置。

  1. 获取触摸点位置
  2. 获取图片大小
  3. 根据控件坐标转换成图片坐标
       @objc func tapClick(_ gesture:UITapGestureRecognizer){
    
        //在图片控件中的位置
        let treePoint = gesture.location(in: treeImageV)
        print("treePoint:\(treePoint)")
        
        //真实图片上的位置
        let imageW = treeImageV.image?.size.width ?? 0
        let imageH = treeImageV.image?.size.height ?? 0
        let treeImagePointX = treePoint.x * imageW/treeImageV.yh_width
        let treeImagePointY = treePoint.y * imageH/treeImageV.yh_height
        
        let treeImagePoint = CGPoint(x: treeImagePointX, y: treeImagePointY)
        
        print("treeImagePoint:\(treeImagePoint)")
        
        
        if let treeImage = treeImageV.image, isPointTransparent(treeImagePoint, in: treeImage){
            print("当前点击的是treeImage的透明区域")
        }

    }

二、透明度
通过转换后的坐标,拿到当前坐标的像素点,然后再根据像素中的颜色信息判断是否透明

// 判断图像中指定位置是否透明
    func isPointTransparent(_ point: CGPoint, in image: UIImage) -> Bool {
        guard let cgImage = image.cgImage else {
            return false
        }
        
        let width = cgImage.width
        let height = cgImage.height
        
        let targetX = Int(point.x)
        let targetY = Int(point.y)
        
        // 检查目标点是否在图像范围内
        if targetX < 0 || targetX >= width || targetY < 0 || targetY >= height {
            return false
        }
        //获取图像的数据提供者
        guard let provider = cgImage.dataProvider else {
            return false
        }

        // 获取图像的数据并将其转换为字节数组
        guard let pixelData = provider.data, let data = CFDataGetBytePtr(pixelData) else {
            return false
        }
        //获取图像的alpha信息
        let alphaInfo = cgImage.alphaInfo
      
        let bytesPerPixel = cgImage.bitsPerPixel / 8
        let pixelOffset = (targetY * cgImage.bytesPerRow) + (targetX * bytesPerPixel)
        if alphaInfo == .none {
            // 对于没有透明度通道的图像,直接判断颜色通道是否为0
            return data[pixelOffset] == 0 && data[pixelOffset + 1] == 0 && data[pixelOffset + 2] == 0
        } else {
            // 对于有透明度通道的图像,判断透明度是否为0
            return data[pixelOffset + bytesPerPixel - 1] == 0
        }
    }

感谢您的阅读和参与,HH思无邪愿与您一起在技术的道路上不断探索。如果您喜欢这篇文章,不妨留下您宝贵的赞!如果您对文章有任何疑问或建议,欢迎在评论区留言,我会第一时间处理,您的支持是我前行的动力,愿我们都能成为更好的自己!


http://www.niftyadmin.cn/n/5426960.html

相关文章

【农村屋顶安装的光伏发电靠谱吗?】分布式光伏运维平台在公益场馆屋顶光伏发电系统的解决方案

摘要&#xff1a;伴随着能源危机和环境恶化问题的日益加重&#xff0c;科技工作者进一步加大对新能源的开发和利用。太阳能光伏发电作为新型清洁能源的主力军&#xff0c;在实际生产生活中得到了广泛的应用。然而&#xff0c;光伏发电效率偏低&#xff0c;成为制约光伏发电发展…

人工智能迷惑行为大赏——需求与科技的较量

目录 前言 一、 机器行为学 二、人工智能迷惑行为的现象 三、产生迷惑行为的技术原因 四、社会影响分析 五、解决措施 总结 前言 随着ChatGPT热度的攀升&#xff0c;越来越多的公司也相继推出了自己的AI大模型&#xff0c;如文心一言、通义千问等。各大应用也开始内置…

计算机网络自顶向下笔记-第一章:计算机网络和英特网

英特网&#xff1a;是一个世界范围的计算机网络&#xff0c;即它是一个互联了遍及全世界数十亿计算设备的网络。 协议&#xff08;Protocol&#xff09; :定义了在两个或多个通信实体之间交换的报文的格式和顺序&#xff0c;一级报文发送、或接收一条报文或其他时间锁采取的动…

云仓酒庄北京朝阳区旗舰店发布活动盛况:红酒品鉴沙龙共筑美好

原标题&#xff1a;云仓酒庄北京朝阳区旗舰店活动盛况&#xff1a;红酒品鉴沙龙与招商交流共筑美好未来 在繁忙的都市中&#xff0c;有一片静谧的天地&#xff0c;那便是云仓酒庄北京朝阳区旗舰店。这里不仅是红酒爱好者的聚集地&#xff0c;更是商业交流的新平台。近日&#…

蓝桥杯算法训练VIP-数组查找及替换

题目 1634: 蓝桥杯算法训练VIP-数组查找及替换 时间限制: 3s 内存限制: 192MB 提交: 1629 解决: 890 题目描述 给定某整数数组和某一整数b。要求删除数组中可以被b整除的所有元素&#xff0c;同时将该数组各元素按从小到大排序。如果数组元素数值在A到Z的ASCII之间&#xff0…

多线程并发模拟实现与分析:基于Scapy的TCP SYN洪水攻击实验研究

简介 实现基于Python实现的多线程TCP SYN洪水攻击。该实例利用Scapy库构造并发送TCP SYN数据包&#xff0c;通过多线程技术模拟并发的网络攻击行为。 实现原理 SYN Flood攻击是一种经典的分布式拒绝服务&#xff08;DDoS&#xff09;攻击方式&#xff0c;利用了TCP协议握手过…

Spring Boot+Vue前后端分离项目如何部署到服务器

&#x1f31f; 前言 欢迎来到我的技术小宇宙&#xff01;&#x1f30c; 这里不仅是我记录技术点滴的后花园&#xff0c;也是我分享学习心得和项目经验的乐园。&#x1f4da; 无论你是技术小白还是资深大牛&#xff0c;这里总有一些内容能触动你的好奇心。&#x1f50d; &#x…

Linux-vim常用操作

本文介绍一些本人在使用vim时最常用操作&#xff1a; 打开文件 vi 1.cpp同时打开多个文件 vi -O 1.cpp 2.cpp此时会分成左右两个区域分别对应两个文件。按ctrlw两次切换当前编辑的文件 命令模式操作&#xff1a; o新起一行dd剪切一行ndd剪切n行yy复制一行nyy复制n行p在当前光…