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

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

    2. 导入mediapipe处理手指坐标

    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
    5.  
    6.  
    7. mp_drawing = mp.solutions.drawing_utils
    8. mp_drawing_styles = mp.solutions.drawing_styles
    9. mp_hands = mp.solutions.hands
    10.  
    11. hands =  mp_hands.Hands(
    12.     static_image_mode=True,
    13.     max_num_hands=2,
    14.     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)
    5.  
    6.     frame.flags.writeable = True
    7.     frame = cv2.cvtColor(frame, cv2.COLOR_RGB2BGR)

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

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

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

    3. 位置计算

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

    完整代码：

    1. import cv2
    2. import time
    3. import math
    4. import numpy as np
    5. import mediapipe as mp
    6.  
    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)
    15.  
    16.  
    17. # 调用摄像头 0 默认摄像头 
    18. cap = cv2.VideoCapture(0)
    19.  
    20. # cv2.namedWindow("frame", 0)
    21. # cv2.resizeWindow("frame", 960, 640)
    22.  
    23.  
    24. # 获取画面宽度、高度
    25. width = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH))
    26. height = int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT))
    27.  
    28.  
    29. # 方块初始数组
    30. x = 100
    31. y = 100
    32. w = 100
    33. h = 100
    34.  
    35. L1 = 0
    36. L2 = 0
    37.  
    38. on_square = False
    39. square_color = (0, 255, 0)
    40.  
    41. # 读取一帧帧照片
    42. while True:
    43.     # 返回frame图片
    44.     rec,frame = cap.read()
    45.     
    46.     # 镜像
    47.     frame = cv2.flip(frame,1)
    48.     
    49.     
    50.     
    51.     frame.flags.writeable = False
    52.     frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
    53.     # 返回结果
    54.     results = hands.process(frame)
    55.  
    56.     frame.flags.writeable = True
    57.     frame = cv2.cvtColor(frame, cv2.COLOR_RGB2BGR)
    58.     
    59.     
    60.     # 如果结果不为空
    61.     if results.multi_hand_landmarks:
    62.  
    63.  
    64.         # 遍历双手(根据读取顺序，一只只手遍历、画画)
    65.         # results.multi_hand_landmarks n双手
    66.         # hand_landmarks 每只手上21个点信息
    67.         for hand_landmarks in results.multi_hand_landmarks:
    68.             mp_drawing.draw_landmarks(
    69.                 frame,
    70.                 hand_landmarks,
    71.                 mp_hands.HAND_CONNECTIONS,
    72.                 mp_drawing_styles.get_default_hand_landmarks_style(),
    73.                 mp_drawing_styles.get_default_hand_connections_style())
    74.             
    75.             # 记录手指每个点的x y 坐标
    76.             x_list = []
    77.             y_list = []
    78.             for landmark in hand_landmarks.landmark:
    79.                 x_list.append(landmark.x)
    80.                 y_list.append(landmark.y)
    81.                 
    82.             
    83.             # 获取食指指尖
    84.             index_finger_x, index_finger_y = int(x_list[8] * width),int(y_list[8] * height)
    85.  
    86.             # 获取中指
    87.             middle_finger_x,middle_finger_y = int(x_list[12] * width), int(y_list[12] * height)
    88.  
    89.  
    90.             # 计算两指尖距离
    91.             finger_distance = math.hypot((middle_finger_x - index_finger_x), (middle_finger_y - index_finger_y))
    92.  
    93.             # 如果双指合并(两之间距离近)
    94.             if finger_distance < 60:
    95.  
    96.                 # X坐标范围 Y坐标范围
    97.                 if (index_finger_x > x and index_finger_x < (x + w)) and (
    98.                         index_finger_y > y and index_finger_y < (y + h)):
    99.  
    100.                     if on_square == False:
    101.                         L1 = index_finger_x - x
    102.                         L2 = index_finger_y - y
    103.                         square_color = (255, 0, 255)
    104.                         on_square = True
    105.  
    106.             else:
    107.                 # 双指不合并/分开
    108.                 on_square = False
    109.                 square_color = (0, 255, 0)
    110.  
    111.             # 更新坐标
    112.             if on_square:
    113.                 x = index_finger_x - L1
    114.                 y = index_finger_y - L2
    115.             
    116.             
    117.  
    118.     # 图像融合 使方块不遮挡视频图片
    119.     overlay = frame.copy()
    120.     cv2.rectangle(frame, (x, y), (x + w, y + h), square_color, -1)
    121.     frame = cv2.addWeighted(overlay, 0.5, frame, 1 - 0.5, 0)
    122.     
    123.  
    124.     # 显示画面
    125.     cv2.imshow('frame',frame)
    126.     
    127.     # 退出条件
    128.     if cv2.waitKey(1) & 0xFF == ord('q'):
    129.         break
    130.     
    131. cap.release()
    132. cv2.destroyAllWindows()

  • 相关阅读:
    python学习笔记4-二分查找
    C++笔记 13 （STL初识）
    竞争性谈判文件
    一个月备考通过PMP
    C语言程序设计笔记（浙大翁恺版） 第十三周：文件
    如何快速开通使用腾讯云云点播服务？
    Django项目 - 合并PDF文件
    sqlite3的lib和头文件在哪下载 2023/9/19 上午10:46:43
    想要成功申请公派访问学者，特别需要注意这两点 ！
    Windows的内存管理机制
  • 原文地址：https://blog.csdn.net/suic009/article/details/126534975