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

此篇文章的範例程式碼 github

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

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

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

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

設計我們的 UI

我們在裡面加入了一些我們需要的元素：

• self.button_stop：停止鍵
• self.button_play：播放鍵
• self.button_pause：暫停鍵
• self.button_openfile：開啟檔案鍵

• self.label_videoframe：顯示畫面

• self.label_framecnt：顯示目前 frame 數/ 全部 frame 數
• self.label_filepath：顯示檔案路徑

一些 UI 設計小細節

1. 與之前設計圖片不同的是，我們拿掉了可以捲動的滑條，
   我希望能夠強制更改比例以符合視窗 (方便一個視窗就能瀏覽)。

2. 我設計的顯示框為 800×450，等於 16:9，
   符合目前最常見的影片比例 1920×1080、1280×720

轉換 day25.ui -> UI.py

pyuic5 -x day25.ui -o UI.py

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

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

• 看看我們製作出來的介面

python UI.py

設計我們的 controller

設計使用狀態 (state)

我們要設計一個播放器，我們必須要想好播放器的架構可能會有哪幾種 ”state (狀態)“，
我們可以簡單地想一下：

• 按下 play 後，進行 play 狀態，