Python + PySide6桌面程式開發範例 (初版)

使用PySide6來構建應用程序並使用Qt Designer生成的.ui文件來設計UI,這樣可以使UI設計更直觀和可視化。我將更新專案範例以使用PySide6並解釋如何加載和使用.ui文件。

專案結構

TaskManager/
│
├── model.py
├── view.py
├── controller.py
├── main.py
├── view.ui
├── requirements.txt
└── README.md

requirements.txt內容

PySide6==6.5.1
transitions==0.8.11
pykka==2.0.3
Rx==3.2.0

view.ui內容

這是一個簡單的.ui文件範例,您可以使用Qt Designer創建並保存為view.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>TaskView</class>
 <widget class="QMainWindow" name="TaskView">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>300</width>
    <height>200</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Task Manager</string>
  </property>
  <widget class="QWidget" name="centralwidget">
   <layout class="QVBoxLayout" name="verticalLayout">
    <item>
     <widget class="QLabel" name="label">
      <property name="text">
       <string>Current Task State: pending</string>
      </property>
     </widget>
    </item>
    <item>
     <widget class="QPushButton" name="start_button">
      <property name="text">
       <string>Start Task</string>
      </property>
     </widget>
    </item>
    <item>
     <widget class="QPushButton" name="complete_button">
      <property name="text">
       <string>Complete Task</string>
      </property>
     </widget>
    </item>
   </layout>
  </widget>
 </widget>
 <resources/>
 <connections/>
</ui>

model.py內容

from transitions import Machine
from rx.subject import Subject

class TaskModel:
    # 定義任務的狀態
    states = ['pending', 'in_progress', 'completed']

    def __init__(self):
        # 初始化狀態機
        self.machine = Machine(model=self, states=TaskModel.states, initial='pending')
        self.machine.add_transition(trigger='start', source='pending', dest='in_progress')
        self.machine.add_transition(trigger='complete', source='in_progress', dest='completed')
        self.state_changes = Subject()

    def start_task(self):
        # 開始任務並通知狀態變化
        self.start()
        self.state_changes.on_next(self.state)

    def complete_task(self):
        # 完成任務並通知狀態變化
        self.complete()
        self.state_changes.on_next(self.state)

view.py內容

from PySide6.QtWidgets import QMainWindow
from PySide6.QtUiTools import QUiLoader

class TaskView(QMainWindow):
    def __init__(self):
        super().__init__()

        # 加載UI文件
        loader = QUiLoader()
        self.ui = loader.load("view.ui", self)

        # 設置窗口標題
        self.setWindowTitle("Task Manager")

        # 訪問UI元素
        self.label = self.ui.findChild(QLabel, 'label')
        self.start_button = self.ui.findChild(QPushButton, 'start_button')
        self.complete_button = self.ui.findChild(QPushButton, 'complete_button')

controller.py內容

from rx import operators as ops

class TaskController:
    def __init__(self, model, view):
        self.model = model
        self.view = view

        # 連接視圖的按鈕到模型的方法
        self.view.start_button.clicked.connect(self.model.start_task)
        self.view.complete_button.clicked.connect(self.model.complete_task)

        # 根據模型的狀態變化更新視圖
        self.model.state_changes.pipe(
            ops.map(lambda state: f"Current Task State: {state}")
        ).subscribe(self.view.label.setText)

main.py內容

from PySide6.QtWidgets import QApplication
from model import TaskModel
from view import TaskView
from controller import TaskController

def main():
    app = QApplication([])

    # 初始化MVC組件
    model = TaskModel()
    view = TaskView()
    controller = TaskController(model, view)

    view.show()
    app.exec()

if __name__ == "__main__":
    main()

使用指南

  1. 建立虛擬環境並安裝依賴
    • 創建虛擬環境:python -m venv venv
    • 激活虛擬環境:source venv/bin/activate(Linux/macOS)或 venv\\\\Scripts\\\\activate(Windows)
    • 安裝依賴:pip install -r requirements.txt
  2. 運行應用程序
    • 在終端中運行:python main.py

功能展示

  • 模型(Model)TaskModel 管理任務的狀態和業務邏輯。
  • 視圖(View)TaskView 使用PySide6的UI加載器來顯示用戶界面。
  • 控制器(Controller)TaskController 將模型與視圖連接起來,處理用戶輸入並更新視圖。

💡 Python 建議

  • 使用Qt Designer設計UI界面,然後通過PySide6的UI加載器加載,這樣可以使代碼更簡潔,UI設計更直觀。
  • 確保在模型中封裝業務邏輯,這樣可以讓視圖和控制器保持簡單和專注。

🧠 深度主題:UI設計與程序邏輯分離

  • 💡思考啟示:在設計應用程序時,如何有效地分離UI設計與程序邏輯,以提高代碼的可維護性和可重用性?

發表迴響