Pythonでアーム角度を自動検出して動画に追加する。(Tkinterで使いやすい画像処理ツールを作る。）※Tkinterが学べる

https://github.com/sassa4771/Find_Arm_Angle_Tkinter
ここのファイルの中身説明↑

## このサイトでできること
・角度・位置座標を自動検出したいアーム動画を処理して動画に骨組みを表示する。

![ex14.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/fe232c65-055e-5404-f1be-5af523425b95.gif)
・本ツールを通して、Tkinterでできること（ファイル読み出し、動画トリミング、マウス追従、スライダー作成などなど）

![ex15.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/7940d170-b468-0e1e-35dd-1f61f58567bb.gif)

このFind Angleツールを作るまでに学んだ機能などをレッスンとして
lesson1~27までまとめてあるので参考にしてみてください。
<a href='https://github.com/sassa4771/Find_Angle_Tkinter/tree/main/tk_lesson'>Tkinter Lesson</a>
<参考サイト：https://www.youtube.com/watch?v=sAu7uxW85_Y&list=PL1FgJUcJJ03sm4WuVCPMbT0RIf2uMmoAj&index=17>

## 目次
①Tkinterとは？
②必要なライブラリ・動作環境(※とりあえず動かしてみたい人はここから)
③ツールの使い方とTkinterの機能紹介
④Tkinter学び方(参考スクリプト付き)
⑤本ツールの作り方（簡易版）

## ①Tkinterとは？
【Tkinterとは】
Tkinterとは、「ティーキンター」や「ティーケーインター」と呼ばれ、Window,Mac,Linuxといった
主要なOSにも対応しているクロスプラットフォームなGUIライブラリです。
(参考：https://www.acrovision.jp/service/data/?p=616)

要するに<h3>GUIが作れる！</h3>

## ②必要なライブラリ・動作環境
【動作環境：(Let's Note)】
OS:windows10 Pro
CPU:Corei7
メモリ:12GB

【必要なライブラリ】
・dlib
・opencv
・numpy
・PIL(Pillow)


【Anaconda環境データ】
今回使用しているAnacondaの環境データ(yamlファイル）もGitにあるので利用してみてください。
https://github.com/sassa4771/Find_Angle_Tkinter/tree/main/Anaconda%20Environment

Anaconda環境インストールコマンド
```cd 【find_angle.yamlがあるとディレクトリ】
conda env create -n find_arm_angle -f find_angle.yaml
```
環境をインストールしたらmainファイルの<a href='https://github.com/sassa4771/Find_Arm_Angle_Tkinter/tree/main/main'>run.bat</a>を起動するとソフトが起動できる。
![run.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/f6128c0e-65dc-ffdf-b1f9-7d7021866aea.png)



【撮影環境】
・背景を黒色
・目標点を白色
にする必要がある。（※二値化→輪郭抽出で座標を特定するため）

## ③ツールの使い方とTkinterの機能紹介
【1.ファイルを開く】
まずは、ファイルを開きましょう。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ファイル参照] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson23(Browsing%20A%20File).py

![ex1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/183b29f6-ce2d-4527-c1f6-db9637707817.gif)


【2.選択した動画の閲覧】
no filterを選択して「Show Selected Video」を押すと表示することができる。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ラジオボタン] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson8(Radio%20Button).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py

![ex2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/66668924-1f50-9a2e-d456-8040318d10d3.gif)


【3.動画の縮小をする】
ただこのままだと、元の動画が大きすぎるのでリサイズをします。
スライダーを利用して、縮小割合を決定します。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[スライダー] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson27(Slider).py

![ex3.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/3af01d14-d075-a65a-59fb-a172ac101258.gif)


【4.フィルター処理した動画の閲覧】
ラジオボタンで・フィルターなし・グレースケール・二値化の処理を選択して表示することができます。
※二値化処理したものを輪郭抽出で自動追従しているため、背景が黒で、目標点が白でないといけない。
フィルターに関して詳しくは、eyetrackのところで説明しています。
Webカメラでeye tracking（アイトラッキング・視線計測）をする【Windows10】:https://github.com/sassa4771/eyetrack

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py

![ex4.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/f4b6ae0b-c498-b628-f473-202d02b9cec5.gif)


【5.動画の範囲トリミングする】
自動トラッキングしたい点（白色のみトラッキング可能。背景は黒色がベスト）が移動する範囲をトリミングしましょう。
※この処理は、目標点の追従する際に範囲を絞ってノイズが入るのを防ぐために行います。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[画像トリミング] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson25(Image_Triming).py

![ex5.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/13732cb8-13e6-221e-b87f-00bbec94f2c4.gif)


【6.目標点を追従できているかを確認する】
「Check Cut Range」を押して、トリミングした範囲で動画を表示します。
「no filter」を選択した場合、目標点が赤枠で囲われていることを確認できる。
この赤枠がほかの箇所にも表示されている場合は、トリミング範囲の修正が必要。または、動画の撮り直しや撮影環境の見直しが必要です。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py

![ex6.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/d1fc5813-6445-ec22-2cfb-3d1e17502e8b.gif)


【7.自動追従が失敗する場合の例】
仮にトリミング範囲を大きくしてみましょう。
そうすると、目標点と思われる場所がプログラム上で判断できなくなってしまうため、手にも赤枠が表示されているのがわかると思います。
これを避けるために、目標点の自動追従範囲を絞る必要があります。

![ex7.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/0b0da061-ffcf-600a-f01a-3780aaa2e022.gif)


【8.回転中心を決定する】
次に、回転中心（Pivot）を決定します。
「Put Pivot On Image」を押して、マウスをドラックすることで赤点を操作できます。
その赤点を回転中心におきましょう。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py
[マウストラッキング] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson26(mouse_tracking).py

![ex8.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/9f8e1d16-ae78-a504-8a2f-8322cbef5b23.gif)


【9.角度表示を行う】
ここまで出来たら、最後の処理を行いましょう。
「Make Frame Image」を押すことで、処理された動画を確認することができます。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py

![ex9.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/971c2524-259e-228a-3774-6975eda0e18e.gif)


【10.作成した動画を保存】
「Video Save」にチェックを入れて、「Check Cut Range」を押すと、動画を保存できます。
pythonのファイルがある場所に、今の日付時間のフォルダーを作成して、その中に保存されます。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py
[チェックボタン] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson7(Check%20Button).py

![ex10.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/06ec3135-f5a1-770a-ff11-13232800ac9a.gif)


【11.作成した動画をフレームごとに分けて画像で保存】
「Frame Image Save」にチェックを入れて、「Check Cut Range」を押すと、動画をフレームごとに分けて画像で保存できます。
pythonのファイルがある場所に、今の日付時間のフォルダーを作成して、その中に保存されます。

このTkinter機能は、こちらのスクリプトを参考にしてください。
[ラベル] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson2(Labels).py
[ボタンと機能呼び出し] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson4(Button%20And%20Button%20Commands).py
[チェックボタン] https://github.com/sassa4771/Find_Angle_Tkinter/blob/main/tk_lesson/tk_lesson7(Check%20Button).py

![ex11.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/66d355fa-c1c7-e3a8-4442-de567bc6a446.gif)


【12.角度情報を数値で取得】
動画で表示するだけでなく、数値で位置座標を取得したい場合はコマンドプロンプトから取得することができます。

![ex13.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/40c48e1a-56ba-c92e-03c4-0cafb94b5a04.gif)


【13.完成！】
これで一通り完成です！


## ④Tkinter学び方(参考スクリプト付き)
本ツールで利用した機能などはlesson1~27までを用意しているので、チェックしてください。
https://github.com/sassa4771/Find_Angle_Tkinter/tree/main/tk_lesson

機能一つ一つを確認できるようにしてあるので、オリジナルを作るのに役立つと思います。
![ex16.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1043128/9b7c2051-3a02-afc3-2ea4-359295b8c073.gif)


## ⑤本ツールの作り方（簡易版）
本ツールのフィルターや画像処理に関しては、eyetrackのところで同じフィルターについて解説をしているので参考にしてください。
Github: https://github.com/sassa4771/eyetrack
Qiita: https://qiita.com/sassa4771/items/fbfb0012744350cf4d93

また、Tkinterの機能に関しても前章の「④Tkinter学び方(参考スクリプト付き)」ですべてできているので参考にしてください。