看完这篇文章你会得到的成果图

前言

我们接下来的讨论，会基於读者已经先读过我 day5 文章 的架构下去进行程序设计
如果还不清楚我程序设计的逻辑 (UI.py、controller.py、start.py 分别在干麻)
建议先阅读 day5 文章後再来阅读此文。

https://www.wongwonggoods.com/python/pyqt5-5/

此篇文章的范例程序码 github

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

以 QFileDialog 读取系统的档案、资料夹

我们可以使用 QFileDialog 来开启每个作业系统的档案功能，
这部分我们会在 controller.py 当中进行实作。

UI 设计部份 (UI.py)

这次我们设计两个按钮，与对应的显示档案路径的地方，
这次我们使用 QTextEdit 来帮助我们显示路径

(相对 Qlabel 的好处是，如果文字太长的话，会自动换行)

一样记得改一下变数，不然等等容易搞不清楚谁是谁。

而今天的 UI 设计部份就比较简单，
因为等等的档案处理我们会花比较多一点时间来实作。

转换成 UI.py

一样的编译指令，我们加上 -x (也可不加)，
我们就可以先检视看看转换後的视窗是不是跟我们想像的一样。

转换 day10.ui -> UI.py

pyuic5 -x day10.ui -o UI.py

执行看看 UI.py 画面是否如同我们想像

一样，这程序只有介面 (视觉上的呈现)，没有任何互动功能

• 看看我们制作出来的介面

python UI.py

接下来我们要开始去改变里面的内容。

controller 设计部份 (controller.py)

设定开启 档案/资料夹 的功能

接下来我们想藉由按键来触发开启 档案/资料夹 的功能，
我们呼叫 QFileDialog 来协助完成这个功能，
在这个功能的底层，已经有针对不同作业系统实作对应开启档案的功能。

请不要只看表面误会以为 Windows, Mac, Linux 开启档案都是同一种实作方式
实际上这部份依据不同作业系统的实作是在 Qt 底层已经做掉了，我们才能如此方便。

先从 UI.py 取得变数名称 (也是我们刚刚在 Qt designer 中命名的部份)

这次我们的变数有

两个按钮

• self.file_button
• self.folder_button

两个显示路径用方框 (QTextEdit)

• self.show_file_path
• self.show_folder_path

取得名称後，去修改 controller.py

还记得我们在 day5 中的模板吗？这边我们直接复制过来使用并修改。

from PyQt5 import QtCore, QtWidgets
from PyQt5.QtGui import QImage, QPixmap
from PyQt5.QtWidgets import QFileDialog
import cv2

from UI import Ui_MainWindow

class MainWindow_controller(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__() # in python3, super(Class, self).xxx = super().xxx
        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)
        self.setup_control()

    def setup_control(self):
        self.ui.file_button.clicked.connect(self.open_file) 
        self.ui.folder_button.clicked.connect(self.open_folder)

    def open_file(self):
        filename, filetype = QFileDialog.getOpenFileName(self,
                  "Open file",
                  "./")                 # start path
        print(filename, filetype)
        self.ui.show_file_path.setText(filename)

    def open_folder(self):
        folder_path = QFileDialog.getExistingDirectory(self,
                  "Open folder",
                  "./")                 # start path
        print(folder_path)
        self.ui.show_folder_path.setText(folder_path)

setup_control() 修改的部份

• 「self.ui.file_button.clicked.connect(self.open_file) 」、「self.ui.folder_button.clicked.connect(self.open_folder)」：我们分别设定对应要使用的函数名称，等等会去 call 我们写好开启 档案/资料夹 的 function

open_file() 的部份 (开启档案)

• filename, filetype = QFileDialog.getOpenFileName(self, "Open file", "./")

我们可以直接使用 QFileDialog.getOpenFileName 这个已经设定好的函式，
直接帮助我们完成开启档案的功能，
而不同作业系统的问题，在这个功能的底层已经帮我们处理掉了，我们可以直接使用。
"Open file" 是开始视窗後上方标题列的名称，
"./" 代表从哪里开启这个目录，「"./"」就是当前目录

这里会回传两个参数(tuple) filename, filetype，我们要使用的是第一个路径，
而第二个是档案的副档名 (与我们有没有过滤档案副档名有关，因为不是我主要使用的功能，这边先不细部讨论)

• self.ui.show_file_path.setText(filename)

取得开启後的「档案路径」，并显示在画面上

open_folder() 的部份 (开启档案)

• folder_path = QFileDialog.getExistingDirectory(self, "Open folder", "./")

我们可以直接使用 QFileDialog.getExistingDirectory 这个已经设定好的函式完成开启资料夹的功能，
一样不同作业系统的问题，在这个功能的底层已经帮我们处理掉了，我们可以直接使用。
"Open folder" 是开始视窗後上方标题列的名称，
"./" 代表从哪里开启这个目录，「"./"」就是当前目录

• self.ui.show_folder_path.setText(folder_path)

取得开启後的「资料夹路径」，并显示在画面上

执行结果

照我们 day5 的程序架构，我们执行

python start.py

开启档案的视窗

将结果呈现在画面上

Reference

★ 本文也同步发於我的个人网站(会有内容目录与显示各个小节，阅读起来更流畅)：【PyQt5】Day 10 - 以 QFileDialog 读取系统的档案、资料夹