OpenCV を使ってお絵かきアプリを作る方法(改良版)

0.最初に

「opencv お絵描き」でggって一番上に出てくる記事のものを改良したので紹介します。

参考記事：

1.紹介

参考にした @igor-bond16 さんのはこんな感じ。

マウスを速く動かしたときに連続せず点々になっているのが気になりますね。

次に改良したのがこんな感じ。

点々をなくしたのと、右クリックで第2色を使えるようにしたのと、Deleteキーで消せるようにしてみました。

2.コード

#参考：https://qiita.com/igor-bond16/items/ef26167a1139a34e24af

import cv2
import numpy as np
import threading
import time

def nothing(x):
    pass

class OEKAKI:
    def __init__(self):
        self.drawing=False
        self.kesigomu=False
        self.lastClickPos=(-1,-1) #わざわざ初期化する必要もないのだが、変数を宣言という意味で入れてる
    def draw_circle(self,event,x,y,flags,param):
        #この関数は、cv2のWindow内でのマウスイベントが起こった時に毎回呼ばれる。
        #(該当ウィンドウ内で)クリックした、マウスが動いた、マウスを離したのイベント時。
        #最高で1秒間に120回程呼ばれる。
        b = cv2.getTrackbarPos('B','image')
        g = cv2.getTrackbarPos('G','image')
        r = cv2.getTrackbarPos('R','image')
        s = cv2.getTrackbarPos('Size','image')
        #i = cv2.getTrackbarPos(switch,'image')

        if event == cv2.EVENT_RBUTTONDOWN:
            self.kesigomu=True
        elif event == cv2.EVENT_RBUTTONUP:
            self.kesigomu=False

        if self.kesigomu==True: #消しゴムモードのとき
            b,g,r = 0,0,0 #描画色を背景色に

        if event == cv2.EVENT_LBUTTONDOWN or event == cv2.EVENT_RBUTTONDOWN:
            self.drawing = True 
            cv2.circle(img,(x,y),s,(b,g,r),-1) #変更点：クリックした瞬間に描画する
        elif event == cv2.EVENT_MOUSEMOVE:
            if self.drawing == True:
                #cv2.circle(img,(x,y),s,(b,g,r),-1) #動かせばその時描画する
                cv2.polylines(img,[np.array([self.lastClickPos,(x,y)])],False,(b,g,r),s*2)#直前の点と現在の点を直線で結ぶ
        elif event == cv2.EVENT_LBUTTONUP or event == cv2.EVENT_RBUTTONUP:
            self.drawing = False
            #変更点：離したときには描画しない

        if self.drawing==True:
            self.lastClickPos=(x,y) #点々になるのを防ぐため


img = np.full((800,800,3),255,np.uint8)
cv2.namedWindow('image')

cv2.createTrackbar('B','image',0,255,nothing)
cv2.createTrackbar('G','image',0,255,nothing)
cv2.createTrackbar('R','image',0,255,nothing)
cv2.createTrackbar('Size', 'image',1,30,nothing)
oekaki=OEKAKI()
cv2.setMouseCallback('image',oekaki.draw_circle)
#switch = '0 : OFF \n1 : ON'
#cv2.createTrackbar(switch, 'image',0,1,nothing)

while True:
    key=cv2.waitKey(1)
    if key & 0xFF == ord('q'):
        break
    elif key& 0xFF == 0: #DELETEキー
        img = np.full((800,800,3),255,np.uint8) #リセット
    cv2.imshow('image',img)
cv2.destroyAllWindows()

やったのは

• グローバル変数の使用をやめた
• トラックバーで"i"の変数を変更して色1/色2の切り替えをしていたところを、右クリックで色2になるようにした
• 削除機能を付けた
• なめらかに描画されるようにした

くらいです。よければぜひ。