內容目錄

看完這篇文章你會得到的成果圖

這篇文章，主要是設計給我自己要用的 Video Player 畫 ROI 工具。
所以很多功能都是替我自己客製化。

此篇文章的範例程式碼 github

https://github.com/howarder3/ironman2021_PyQt5_photoshop/tree/main/day27_video_roi_project

之前內容的重點複習 (前情提要)

我們接下來的討論，會基於讀者已經先讀過我 day5 文章的架構下去進行程式設計
如果還不清楚我程式設計的邏輯 (UI.py、controller.py、start.py 分別在幹麻)
建議先閱讀 day5 文章後再來閱讀此文。

【PyQt5】Day 5 – 開始來設計我們的 controller.py，改以「程式角度」來說明如何建立 PyQt 的系統

設計我們的 UI

這篇文章由於是我在撰寫 day25 的時候另外寫的，還沒有做出 day26 的優化更新，
如果有興趣的可以自己再改，這邊只專注在講新增的功能

主要就是新增滑條的部分，新元素的名稱：

self.button_clear_points：清除目前有的點
self.button_generate_rois：產生 roi 用按鈕
self.text_save_points：顯示儲存的點
self.text_output_rois：顯示 roi 結果

轉換 day27.ui -> UI.py

pyuic5 -x day27.ui -o UI.py

執行看看 UI.py 畫面是否如同我們想像

一樣，這程式只有介面 (視覺上的呈現)，沒有任何互動功能

看看我們製作出來的介面

python UI.py

設計我們的 controller

video_controller 新增功能

連結按鍵

連結這兩個按鍵至兩個對應的 function

def set_video_player(self):
    self.ui.button_clear_points.clicked.connect(self.clear_points)
    self.ui.button_generate_rois.clicked.connect(self.generate_rois)

以按鍵更新文字框

按下按鍵後，就要進行對應的文字更新，

如果是清除鍵，除了文字清空外，也要把儲存的點清空。
如果是產生 roi 鍵，就把現有的點輸出成我要的格式。

def clear_points(self):
    self.list_collect_points = []
    self.__update_text_show_points()

def __update_text_show_points(self):
    msg = "Current points (right click to return origin):\n"
    for ele in self.list_collect_points:
        msg += f"({ele[0]},{ele[1]})\n"
    self.ui.text_save_points.setText(msg)

def generate_rois(self):
    msg = "[\n"
    for ele in self.list_collect_points:
        msg += f"[{ele[0]},{ele[1]}],\n"
    msg += "]"
    self.ui.text_output_rois.setText(msg)

設定滑鼠控制，建立「畫點畫線」的機制

替我們的 Qlabel 定義一個按鍵 funct