Merge branch 'develop'

takeyamayuki · Sep 11, 2021 · a49d6fa · a49d6fa
2 parents ceb6382 + f74108c
commit a49d6fa
Show file tree

Hide file tree

Showing 6 changed files with 131 additions and 70 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,4 +2,7 @@ dist/
 build/
 __pycache__/
 venv/
-app.spec
+app.spec
+dist-mac/
+dist-win/
+dist-linux/
diff --git a/README-ja.md b/README-ja.md
@@ -2,15 +2,37 @@
 
 Webカメラで自分の手元を写すことで、あたかも実体のないマウスがあるかのように見えるPythonスクリプトです。     
 動作状況は[Youtube](https://youtu.be/ufvOJUTCF8M)にも公開しています。  
-(感度調整なしのver.1は[こちら](https://github.com/takeyamayuki/NonMouse))   
 
-![github_drug](https://user-images.githubusercontent.com/22733958/129838994-f1499648-a179-4e0d-a62f-a4d983ba380a.gif)  
 
 ![github_e](https://user-images.githubusercontent.com/22733958/129839012-82915bcf-10a5-49d1-8e03-e4f0def7b778.gif)  
 
-
 # インストール
-
+実行可能形式ファイルをリリースしました。
+## 1.実行可能形式ファイルとして実行
+リリースからOSに合わせたバイナリをダウンロードしてください。そして、解凍して、以下の手順に従います。
+### Windows
+![image](https://user-images.githubusercontent.com/22733958/132952932-a0001c1b-b28b-44be-a7bd-30755ae8ca94.png)  
+を実行。
+### Mac
+<img width="400" alt="スクリーンショット 2021-09-12 午前0 21 58" src="https://user-images.githubusercontent.com/22733958/132952856-21526499-14c0-4548-8b9d-17235373bfd0.png">
+を実行。すると、以下の画面が出るので、OKをクリック
+<img width="372" alt="スクリーンショット 2021-09-11 午後11 56 39" src="https://user-images.githubusercontent.com/22733958/132952245-36befc8c-d751-4665-980e-a2fd2d5c2424.png">
+次に、システム環境設定から「セキリュティとプライバシー」の「一般」の項目を開いて、一番下の「このまま開く」をクリック
+<img width="780" alt="スクリーンショット 2021-09-11 午後11 56 56" src="https://user-images.githubusercontent.com/22733958/132952272-0850fcd2-498a-45dd-a046-257742ff2adb.png">
+以下の画面が出るので、「開く」をクリック
+<img width="372" alt="スクリーンショット 2021-09-11 午後11 57 08" src="https://user-images.githubusercontent.com/22733958/132952293-72de3d98-4164-425e-a479-d2b423d4e428.png">
+
+これでも、アプリがカメラとマウスカーソルにアクセスできないので、システム環境設定から「セキリュティとプライバシー」の「プライバシー」で、「アクセシビリティ」と「カメラ」の項目において、以下のようにターミナルを追加。
+
+<img width="780" alt="スクリーンショット 2021-09-12 午前0 02 20" src="https://user-images.githubusercontent.com/22733958/132952303-60625f12-ab31-4480-a0f9-31e5bb302333.png">
+<img width="780" alt="スクリーンショット 2021-09-12 午前0 02 31" src="https://user-images.githubusercontent.com/22733958/132952309-e400f479-c082-456f-a82c-bd71f5ba15a9.png">  
+最初に、以上の手順を踏めば次からはクリックだけで実行できます。
+
+### Linux
+<img width="700" alt="スクリーンショット 2021-09-12 午前0 02 20" src="https://user-images.githubusercontent.com/22733958/132953337-cf808fd8-0bf6-4cbc-9b9f-fb80268bd060.png">   
+フォルダー内のNonMouseを実行。ただ、いまのところ、10fps程度しか出ないので、pythonとして実行することをおすすめします。
+
+## 2.pythonファイルとして実行
 以下のスクリプトを実行します。
 mediapipeのインストールだけ、OS毎に異なります。困ったら、[公式サイト](https://google.github.io/mediapipe/getting_started/install.html)を見てください。macとlinuxのやり方は、以下に示します。  
 mac
@@ -60,45 +82,53 @@ $ python3 app.py
 実行すると、以下の画面が出ます。  
 以下の画面でまずはカメラ、感度、モードの設定をします。
 
-<img width="392" alt="スクリーンショット 2021-09-08 午後8 19 35" src="https://user-images.githubusercontent.com/22733958/132500418-569f03e8-7b18-454e-adf3-a896ed18333c.png">
-
-- Camera  
-カメラデバイスを選択してください。複数カメラが接続されている場合は、小さい番号から、順番に試してみてください。  
-
-- Sensitivity  
-感度を設定します。あまり大きくしすぎると、マウスカーソルが小刻みに揺れます。
+<img width="392" alt="スクリーンショット 2021-09-11 午後0 04 57" src="https://user-images.githubusercontent.com/22733958/132934634-581a47f7-7539-47f3-9dfd-272b383981b3.png">
 
 - Mode  
 Gesture, Mouse, Touchモードがあります。
    - Gesture  
       - webカメラを自分に向ける or ノートパソコンの内蔵カメラを使用する。
       - カメラに向かって、ジェスチャーのようにNonMouseの[手の動き](#手の動き)をする。
-      <img width="1392" alt="スクリーンショット 2021-09-04 午後7 28 46" src="https://user-images.githubusercontent.com/22733958/132091539-c897226a-9d60-4344-88a1-cb87d7ab64b4.png">
+      <img width="1392" alt="スクリーンショット 2021-09-11 午後0 25 43" src="https://user-images.githubusercontent.com/22733958/132934740-25641174-eefe-4b93-8bac-34c339a45b64.png">
+
       
    - Mouse  
       - webカメラを自分の手元に向ける。
       - 手元でNonMouseの[手の動き](#手の動き)をする。
-      <img width="1392" alt="スクリーンショット 2021-09-08 午後8 12 39" src="https://user-images.githubusercontent.com/22733958/132499605-17ec6cfb-6638-43bc-a3a7-6fb19f7b2428.png">
+      <img width="1392" alt="スクリーンショット 2021-09-11 午後0 28 23" src="https://user-images.githubusercontent.com/22733958/132934790-e870d88e-42de-4789-b200-ff54ce427cbc.png">
+
 
-   - Touch:開発中  
+   - Touch    
       - webカメラをディスプレイに向ける。
-      - これを選択すると、最初にディスプレイの四隅を選択する画面が出るので、指示に従うとディスプレイにおける自分の人差し指の先端が絶対的な位置として認識される。
+      - ディスプレイ上で[手の動き](#手の動き)をすることで、タッチしているようにカーソルを動かせる。
+      <img width="1392" alt="スクリーンショット 2021-09-11 午後0 01 17" src="https://user-images.githubusercontent.com/22733958/132934076-b65d4013-4f28-4376-b56c-349754a56501.png">
 
-設定が終わったら、continueをクリックしてください。すると、選択した設定でNonMouseが使えるようになります。
+- Camera  
+カメラデバイスを選択してください。複数カメラが接続されている場合は、小さい番号から、順番に試してみてください。  
+
+- Sensitivity  
+感度を設定します。あまり大きくしすぎると、マウスカーソルが小刻みに揺れます。
+
+
+設定が終わったら、continueをクリックしてください。すると、上記のようなカメラの映像が映し出され、選択した設定でNonMouseが使えるようになります。
 
 ## 手の動き
 * カーソル
-   * マウスカーソル: 人差し指の先端  
-   * マウスカーソルの動きを止める: 人指し指の指先と中指の指先をくっつける   
+   * マウスカーソル: 人差し指の先端 → 青色の円が人差し指の先端に表示される
+   * マウスカーソルの動きを止める: 人指し指の指先と中指の指先をくっつける → 青色の円が消える
 * 左クリック
-   * 左クリック: 親指の指先と人差し指の第２関節をくっつける
-   * 左クリックのリリース: 親指の指先と人差し指の第２関節を離す  
+   * 左クリック: 親指の指先と人差し指の第２関節をくっつける → 黄色の円が人差し指の先端に表示される
+   * 左クリックのリリース: 親指の指先と人差し指の第２関節を離す → 黄色の円が消える
    * ダブルクリック: 左クリックを0.5秒以内に2回行う
 * その他
-   * 右クリック: カーソルを動かさずに、クリック状態を１秒続ける
+   * 右クリック: カーソルを動かさずに、クリック状態を１秒続ける → 赤色の円が人差し指の先端に表示される
    * スクロール: 人差し指を90°回転させて横にした状態で人差し指でスクロール
 
+† 手元を明るくして使ってください。  
+† カメラに対して、なるべく手をまっすぐ向けてください。
+
 ## プログラムの止め方
 ターミナルウィンドウがアクティブのとき、Ctrl+C  
 アプリケーションウィンドウがアクティブのときは、Escを押してください  
-※ウィンドウのバツを押しても消えません。
+
+† ウィンドウのバツを押しても消えません。
diff --git a/README.md b/README.md
@@ -2,16 +2,40 @@
 日本語のREADMEは[こちら](README-ja.md)  
 
 This is a Python script that uses a web camera to capture your hand, making it appear as if there is a mouse without any substance.     
-The operation status is also available on [Youtube](https://youtu.be/ufvOJUTCF8M)  
-(Ver.1 without sensitivity adjustment is [here](https://github.com/takeyamayuki/NonMouse))  
-
-
-![github_drug](https://user-images.githubusercontent.com/22733958/129838867-e5b28dfc-3e7c-4064-9d17-93e24e7f7064.gif)
+The operation status is also available on [Youtube](https://youtu.be/ufvOJUTCF8M)   
 
 ![github_e](https://user-images.githubusercontent.com/22733958/129838897-86da6861-b3a5-4e14-98fe-400a27c894d7.gif)
 
 
 # Installation
+## 1.Run as executable file. 
+Download the binary that matches your OS from the release. Then unzip it and follow the steps below.
+### Windows
+![image](https://user-images.githubusercontent.com/22733958/132952932-a0001c1b-b28b-44be-a7bd-30755ae8ca94.png)  
+Run NonMouse.exe
+
+### Mac  
+<img width="400" alt="スクリーンショット 2021-09-12 午前0 21 58" src="https://user-images.githubusercontent.com/22733958/132952856-21526499-14c0-4548-8b9d-17235373bfd0.png">    
+
+Run NonMouse, then the following screen will appear, click OK.  
+<img width="372" alt="スクリーンショット 2021-09-11 午後11 56 39" src="https://user-images.githubusercontent.com/22733958/132952245-36befc8c-d751-4665-980e-a2fd2d5c2424.png">  
+
+Next, go to System Preferences, go to "Security and Privacy," open the "General" section, and click "Open As..." at the bottom.  
+<img width="780" alt="スクリーンショット 2021-09-11 午後11 56 56" src="https://user-images.githubusercontent.com/22733958/132952272-0850fcd2-498a-45dd-a046-257742ff2adb.png">  
+
+When the following screen appears, click "Open".  
+<img width="372" alt="スクリーンショット 2021-09-11 午後11 57 08" src="https://user-images.githubusercontent.com/22733958/132952293-72de3d98-4164-425e-a479-d2b423d4e428.png">  
+
+This still doesn't allow the app to access the camera and mouse cursor, so I went to System Preferences and under "Privacy" in "Security and Privacy", in the "Accessibility" and "Camera" sections, I added a terminal as shown below.  
+
+<img width="780" alt="スクリーンショット 2021-09-12 午前0 02 20" src="https://user-images.githubusercontent.com/22733958/132952303-60625f12-ab31-4480-a0f9-31e5bb302333.png">  
+<img width="780" alt="スクリーンショット 2021-09-12 午前0 02 31" src="https://user-images.githubusercontent.com/22733958/132952309-e400f479-c082-456f-a82c-bd71f5ba15a9.png">    
+The first step is to follow the instructions above, and the next is just a click away.  
+
+### Linux
+![Screenshot from 2021-09-12 00-36-46](https://user-images.githubusercontent.com/22733958/132953337-cf808fd8-0bf6-4cbc-9b9f-fb80268bd060.png)  
+Run NonMouse in the folder. However, at the moment, it only gives about 10 fps, so I recommend running it as python.
+## 2.Run as python
 Run the following script.
 Only the installation of mediapipe is different for each OS. If you have trouble, see the [official site](https://google.github.io/mediapipe/getting_started/install.html). The mac and linux instructions are shown below.   
 
@@ -62,45 +86,51 @@ $ python3 app.py
 When you run it, you will see the following screen.  
 In the following screen, you will first set the camera, sensitivity, and mode.
 
-<img width="392" alt="スクリーンショット 2021-09-08 午後8 19 35" src="https://user-images.githubusercontent.com/22733958/132500418-569f03e8-7b18-454e-adf3-a896ed18333c.png">
-
-- Camera  
-Select your camera device. If you have multiple cameras connected, try them in order, starting with the smallest number.  
-
-- Sensitivity  
-Set the sensitivity. If you set it too high, the mouse cursor will wiggle.
+<img width="392" alt="スクリーンショット 2021-09-11 午後0 04 57" src="https://user-images.githubusercontent.com/22733958/132934634-581a47f7-7539-47f3-9dfd-272b383981b3.png">
 
 - Mode  
 There are Gesture, Mouse, and Touch modes.
     - Gesture    
-        Point the web camera at yourself or use the built-in camera of your laptop.  
-        Make NonMouse hand movements like a gesture toward the camera.
-        <img width="1392" alt="スクリーンショット 2021-09-04 午後7 28 46" src="https://user-images.githubusercontent.com/22733958/132091539-c897226a-9d60-4344-88a1-cb87d7ab64b4.png">
+        - Point the web camera at yourself or use the built-in camera of your laptop.  
+        - Make NonMouse hand movements like a gesture toward the camera.  
+
+        <img width="1392" alt="スクリーンショット 2021-09-11 午後0 25 43" src="https://user-images.githubusercontent.com/22733958/132934740-25641174-eefe-4b93-8bac-34c339a45b64.png">
 
     - Mouse    
-        Point the web camera at your hand.  
-        Make NonMouse hand movements with your hand.  
-        <img width="1392" alt="スクリーンショット 2021-09-08 午後8 12 39" src="https://user-images.githubusercontent.com/22733958/132499605-17ec6cfb-6638-43bc-a3a7-6fb19f7b2428.png">
-    - Touch: under development  
-        Point the web camera at the display.  
-        When you select this option, you will first be prompted to select the four corners of the display, and if you follow the instructions, the tip of your index finger will be recognized as the absolute position on the display.
+        - Point the web camera at your hand.  
+        - Make NonMouse [hand movements](#HandMovements) with your hand.  
+        
+        <img width="1392" alt="スクリーンショット 2021-09-11 午後0 28 23" src="https://user-images.githubusercontent.com/22733958/132934790-e870d88e-42de-4789-b200-ff54ce427cbc.png">
+    - Touch  
+        - Point the web camera at the display.
+        - You can move the cursor as if you were touching it by doing [hand movements](#HandMovements) on the display.
 
-When you are done with the settings, click continue. Then you can use NonMouse with the settings you selected.
+        <img width="1392" alt="スクリーンショット 2021-09-11 午後0 01 17" src="https://user-images.githubusercontent.com/22733958/132934076-b65d4013-4f28-4376-b56c-349754a56501.png">
+
+- Camera  
+Select your camera device. If you have multiple cameras connected, try them in order, starting with the smallest number.  
+
+- Sensitivity  
+Set the sensitivity. If you set it too high, the mouse cursor will wiggle.
 
+When you are done with the settings, click continue. Then you can use NonMouse with the settings you selected.
 
 ### Hand Movements
 - cursor
-    * Mouse cursor: tip of index finger  
-    * Stop mouse cursor: Attach the tip of your index finger to the tip of your middle finger  
+    * Mouse cursor: tip of index finger → A blue circle will appear at the tip of your index finger. 
+    * Stop mouse cursor: Attach the tip of your index finger to the tip of your middle finger. → The blue circle disappears.
 - left click
-    * Left click: Attach the fingertips of your thumb to the second joint of your index finger
-    * Left click release: Release the thumb fingertip and the second joint of the index finger  
-    * Double click: Left click twice within 0.5 seconds
+    * Left click: Attach the fingertips of your thumb to the second joint of your index finger → A yellow circle will appear on the tip of your index finger.
+    * Left click release: Release the thumb fingertip and the second joint of the index finger. → The yellow circle disappears.
+    * Double click: Left click twice within 0.5 seconds.
 - etc
-    * Right click: Hold the click state for 1 second without moving the cursor
+    * Right click: Hold the click state for 1 second without moving the cursor. → A red circle will appear at the tip of your index finger.
     * Scrolling: Scroll with your index finger while rotating your index finger 90° to the side.
 
+† Use it with a bright light at hand.
+† Keep your hand as straight as possible to the camera.
 ### Stop a program
 Press Ctrl+C, when a terminal window is active.     
-Press Esc, when an application window is active.    
-The window will not disappear even if you press the "X" button on the window.
+Press Esc, when an application window is active.  
+
+† The window will not disappear even if you press the "X" button on the window.
diff --git a/app.py b/app.py
@@ -17,34 +17,33 @@ def tk_arg():
     root.geometry("280x280")
     Val1 = tk.IntVar()
     Val2 = tk.IntVar()
-    Val3 = tk.IntVar()
     Val4 = tk.IntVar()
     Val4.set(30)                            # デフォルトマウス感度
     Mode = ['Gesture', 'Mouse', 'Touch']
+    # Mode
+    Static2 = tk.Label(text=u'Mode').grid(row=1)
+    for j in range(3):
+        tk.Radiobutton(root,
+                       value=j,
+                       variable=Val2,
+                       text=Mode[j]
+                       ).grid(row=2, column=j*2)
+    St2 = tk.Label(text=u'     ').grid(row=3)
     # Camera
-    Static1 = tk.Label(text=u'Camera').grid(row=1)
+    Static1 = tk.Label(text=u'Camera').grid(row=4)
     for i in range(3):
         tk.Radiobutton(root,
                        value=i,
                        variable=Val1,
                        text='Device{}'.format(i)
-                       ).grid(row=2, column=i*2)
-    St1 = tk.Label(text=u'     ').grid(row=3)
+                       ).grid(row=5, column=i*2)
+    St1 = tk.Label(text=u'     ').grid(row=6)
     # Sensitivity
-    Static4 = tk.Label(text=u'Sensitivity').grid(row=4)
+    Static4 = tk.Label(text=u'Sensitivity').grid(row=7)
     s1 = tk.Scale(root, orient='h',
                   from_=1, to=100, variable=Val4
-                  ).grid(row=5, column=2)
-    St4 = tk.Label(text=u'     ').grid(row=6)
-    # Mode
-    Static2 = tk.Label(text=u'Mode').grid(row=7)
-    for j in range(3):
-        tk.Radiobutton(root,
-                       value=j,
-                       variable=Val2,
-                       text=Mode[j]
-                       ).grid(row=8, column=j*2)
-    St2 = tk.Label(text=u'     ').grid(row=9)
+                  ).grid(row=8, column=2)
+    St4 = tk.Label(text=u'     ').grid(row=9)
     # continue
     Button = tk.Button(text="continue", command=root.quit).grid(
         row=10, column=2)

diff --git a/icon.ico b/icon.ico
diff --git a/requirements.txt b/requirements.txt
@@ -2,4 +2,3 @@ mediapipe==0.8.5
 numpy==1.20.3
 opencv-python==4.5.2.54
 pynput==1.6.8
-PyAutoGUI==0.9.53