0
0

openCV实践项目：拖拽虚拟方块

一、项目效果：

学校宿舍今天搬家，累麻了，突然发现展示处理的也很粗糙，就这样吧嘿嘿~~~

二、核心流程：

1、openCV读取视频流、在每一帧图片上画一个矩形。

2、使用mediapipe获取手指关键点坐标。

3、根据手指坐标位置和矩形的坐标位置，判断手指点是否在矩形上，如果在则矩形跟随手指移动。

三、代码流程：

环境准备：

  • python: 3.8.8
  • opencv: 4.2.0.32
  • mediapipe: 0.8.10.1

注：

1、opencv版本过高或过低可能出现一些如摄像头打不开、闪退等问题，python版本影响opencv可选择的版本。

2、pip install mediapipe 后可能导致openCV无法正常使用，卸了重新下载，习惯了就好。

1. 读取摄像头视频，画矩形：

  1. import cv2
  2. import time
  3. import numpy as np
  5. # 调用摄像头 0 默认摄像头 
  6. cap = cv2.VideoCapture(0)
  8. # 初始方块数据
  9. x = 100
  10. y = 100
  11. w = 100
  12. h = 100
  14. # 读取一帧帧照片
  15. while True:
  16.     # 返回frame图片
  17.     rec,frame = cap.read()
  18.     
  19.     # 镜像
  20.     frame = cv2.flip(frame,1)
  21.     
  22.     # 画矩形 
  23.     cv2.rectangle(frame, (x, y), (x + w, y + h), (255, 0, 255), -1)
  25.     # 显示画面
  26.     cv2.imshow('frame',frame)
  27.     
  28.     # 退出条件
  29.     if cv2.waitKey(1) & 0xFF == ord('q'):
  30.         break
  31.     
  32. cap.release()
  33. cv2.destroyAllWindows()

这是很基础的一步操作，此时我们运行这段代码，摄像头打开，我们会惊讶地看到自己英俊的脸庞，且左上角有个100*100的紫色矩形。

2. 导入mediapipe处理手指坐标

  1. pip install mediapipe

此时可能出现一些问题，比如openCV突然用不了了，没关系，卸载了重新下。

mediapipe详细信息：Hands - mediapipe (google.github.io)

简单来说，它会返回给我们21个手指关键点的坐标，即它在视频画面的位置比例( 0~1 )，我们乘以对应画面的宽高，就能得到手指对应的坐标了。

本次用到食指和中指指尖，也就是8号和12号。

2.1 配置一些基础信息：

  1. import cv2
  2. import time
  3. import numpy as np
  4. import mediapipe as mp
  6. mp_drawing = mp.solutions.drawing_utils
  7. mp_drawing_styles = mp.solutions.drawing_styles
  8. mp_hands = mp.solutions.hands
  10. hands =  mp_hands.Hands(
  11.     static_image_mode=True,
  12.     max_num_hands=2,
  13.     min_detection_confidence=0.5)

2.2 在处理每一帧图像时，加入：

  1.     frame.flags.writeable = False
  2.     frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
  3.     # 返回结果
  4.     results = hands.process(frame)
  6.     frame.flags.writeable = True
  7.     frame = cv2.cvtColor(frame, cv2.COLOR_RGB2BGR)

当我们在视频流中读取每一帧图片时，将其从BGR转为RGB供给mediapipe生成的hands对象读取，它会返回这张图片中手指关键点的信息，我们只需要继续对其作画，画在每一帧图片上。

  1.     # 如果结果不为空
  2.     if results.multi_hand_landmarks:
  4.         # 遍历双手(根据读取顺序，一只只手遍历、画画)
  5.         for hand_landmarks in results.multi_hand_landmarks:
  6.             mp_drawing.draw_landmarks(
  7.                 frame,
  8.                 hand_landmarks,
  9.                 mp_hands.HAND_CONNECTIONS,
  10.                 mp_drawing_styles.get_default_hand_landmarks_style(),
  11.                 mp_drawing_styles.get_default_hand_connections_style())

2.3 至此步骤完整代码

  1. import cv2
  2. import time
  3. import numpy as np
  4. import mediapipe as mp
  6. mp_drawing = mp.solutions.drawing_utils
  7. mp_drawing_styles = mp.solutions.drawing_styles
  8. mp_hands = mp.solutions.hands
  10. hands =  mp_hands.Hands(
  11.     static_image_mode=True,
  12.     max_num_hands=2,
  13.     min_detection_confidence=0.5)
  15. # 调用摄像头 0 默认摄像头 
  16. cap = cv2.VideoCapture(0)
  18. # 方块初始数组
  19. x = 100
  20. y = 100
  21. w = 100
  22. h = 100
  24. # 读取一帧帧照片
  25. while True:
  26.     # 返回frame图片
  27.     rec,frame = cap.read()
  28.     
  29.     # 镜像
  30.     frame = cv2.flip(frame,1)
  31.     
  32.     
  33.     
  34.     frame.flags.writeable = False
  35.     frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
  36.     # 返回结果
  37.     results = hands.process(frame)
  39.     frame.flags.writeable = True
  40.     frame = cv2.cvtColor(frame, cv2.COLOR_RGB2BGR)
  41.     
  42.     
  43.     # 如果结果不为空
  44.     if results.multi_hand_landmarks:
  46.         # 遍历双手(根据读取顺序，一只只手遍历、画画)
  47.         # results.multi_hand_landmarks n双手
  48.         # hand_landmarks 每只手上21个点信息
  49.         for hand_landmarks in results.multi_hand_landmarks:
  50.             mp_drawing.draw_landmarks(
  51.                 frame,
  52.                 hand_landmarks,
  53.                 mp_hands.HAND_CONNECTIONS,
  54.                 mp_drawing_styles.get_default_hand_landmarks_style(),
  55.                 mp_drawing_styles.get_default_hand_connections_style())
  56.     
  57.     
  58.     # 画矩形 
  59.     cv2.rectangle(frame, (x, y), (x + w, y + h), (255, 0, 255), -1)
  61.     # 显示画面
  62.     cv2.imshow('frame',frame)
  63.     
  64.     # 退出条件
  65.     if cv2.waitKey(1) & 0xFF == ord('q'):
  66.         break
  67.     
  68. cap.release()
  69. cv2.destroyAllWindows()

此时我们运行看一下还挺有意思的：

3. 位置计算

我们这个实验要求拖动方块，那肯定也有不拖动的时候，因此不妨根据上一步获取**食指(8)和中指(12)**指尖的位置，如果这俩离得近，我们就在他与方块重合的时候，根据手指的位置改变方块的坐标。

完整代码：

  1. import cv2
  2. import time
  3. import math
  4. import numpy as np
  5. import mediapipe as mp
  7. # mediapipe配置
  8. mp_drawing = mp.solutions.drawing_utils
  9. mp_drawing_styles = mp.solutions.drawing_styles
  10. mp_hands = mp.solutions.hands
  11. hands =  mp_hands.Hands(
  12.     static_image_mode=True,
  13.     max_num_hands=2,
  14.     min_detection_confidence=0.5)
  16. # 调用摄像头 0 默认摄像头 
  17. cap = cv2.VideoCapture(0)
  19. # cv2.namedWindow("frame", 0)
  20. # cv2.resizeWindow("frame", 960, 640)
  22. # 获取画面宽度、高度
  23. width = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH))
  24. height = int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT))
  26. # 方块初始数组
  27. x = 100
  28. y = 100
  29. w = 100
  30. h = 100
  32. L1 = 0
  33. L2 = 0
  35. on_square = False
  36. square_color = (0, 255, 0)
  38. # 读取一帧帧照片
  39. while True:
  40.     # 返回frame图片
  41.     rec,frame = cap.read()
  42.     
  43.     # 镜像
  44.     frame = cv2.flip(frame,1)
  45.     
  46.     
  47.     
  48.     frame.flags.writeable = False
  49.     frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
  50.     # 返回结果
  51.     results = hands.process(frame)
  53.     frame.flags.writeable = True
  54.     frame = cv2.cvtColor(frame, cv2.COLOR_RGB2BGR)
  55.     
  56.     
  57.     # 如果结果不为空
  58.     if results.multi_hand_landmarks:
  60.         # 遍历双手(根据读取顺序，一只只手遍历、画画)
  61.         # results.multi_hand_landmarks n双手
  62.         # hand_landmarks 每只手上21个点信息
  63.         for hand_landmarks in results.multi_hand_landmarks:
  64.             mp_drawing.draw_landmarks(
  65.                 frame,
  66.                 hand_landmarks,
  67.                 mp_hands.HAND_CONNECTIONS,
  68.                 mp_drawing_styles.get_default_hand_landmarks_style(),
  69.                 mp_drawing_styles.get_default_hand_connections_style())
  70.             
  71.             # 记录手指每个点的x y 坐标
  72.             x_list = []
  73.             y_list = []
  74.             for landmark in hand_landmarks.landmark:
  75.                 x_list.append(landmark.x)
  76.                 y_list.append(landmark.y)
  77.                 
  78.             
  79.             # 获取食指指尖
  80.             index_finger_x, index_finger_y = int(x_list[8] * width),int(y_list[8] * height)
  82.             # 获取中指
  83.             middle_finger_x,middle_finger_y = int(x_list[12] * width), int(y_list[12] * height)
  85.             # 计算两指尖距离
  86.             finger_distance = math.hypot((middle_finger_x - index_finger_x), (middle_finger_y - index_finger_y))
  88.             # 如果双指合并(两之间距离近)
  89.             if finger_distance < 60:
  91.                 # X坐标范围 Y坐标范围
  92.                 if (index_finger_x > x and index_finger_x < (x + w)) and (
  93.                         index_finger_y > y and index_finger_y < (y + h)):
  95.                     if on_square == False:
  96.                         L1 = index_finger_x - x
  97.                         L2 = index_finger_y - y
  98.                         square_color = (255, 0, 255)
  99.                         on_square = True
  101.             else:
  102.                 # 双指不合并/分开
  103.                 on_square = False
  104.                 square_color = (0, 255, 0)
  106.             # 更新坐标
  107.             if on_square:
  108.                 x = index_finger_x - L1
  109.                 y = index_finger_y - L2
  110.             
  111.             
  113.     # 图像融合 使方块不遮挡视频图片
  114.     overlay = frame.copy()
  115.     cv2.rectangle(frame, (x, y), (x + w, y + h), square_color, -1)
  116.     frame = cv2.addWeighted(overlay, 0.5, frame, 1 - 0.5, 0)
  117.     
  119.     # 显示画面
  120.     cv2.imshow('frame',frame)
  121.     
  122.     # 退出条件
  123.     if cv2.waitKey(1) & 0xFF == ord('q'):
  124.         break
  125.     
  126. cap.release()
  127. cv2.destroyAllWindows()
标签： opencv 计算机视觉 人工智能
本文转载自: https://blog.csdn.net/suic009/article/details/126534975
版权归原作者 老师我作业忘带了 所有， 如有侵权，请联系我们删除。
登录后发布评论

“openCV实践项目：拖拽虚拟方块”的评论:

还没有评论
关于作者
...
overfit同步小助手
文章同步
相关阅读

网络安全法-网络运行安全

使用selenium/drissionpage时如何阻止chrome自动跳转http到https

docker desktop 里部署的Open WebUI 管理员密码忘记了的处理方法

在ubuntu20.04中搭建onsite比赛运行环境

利用开源的低代码表单设计器FcDesigner高效管理和渲染复杂表单结构

Kafka学习笔记

【前端】浏览器输入url到页面呈现发生了什么？