iT邦幫忙

2022 iThome 鐵人賽
DAY 7
0
Software Development

[Python QT] 玩玩 Pyside 的各種功能系列 第 7 篇

【Day07】試著把 QPushButton 按鈕放進 QTableWidget 表格

14th鐵人賽
1338 瀏覽

  • 分享至 

  • xImage
    •  

補充昨天的話題, 昨天程式碼裡有兩行不知道大家有沒有注意到, 就是
resizeRowsToContents() 和
resizeColumnsToContents()
這兩個功能主要是讓表格內容的長跟寬自動根據內容物大小調整, 讓我們看看如果沒有這兩行的話, 表格會長得如何
https://ithelp.ithome.com.tw/upload/images/20220909/20151144gQ0gf53W24.png
雖然表格可以讓人手動調整大小
resize
但是一打開程式沒辦法看到完整的圖跟文字, 要自己手動調整令人感到煩躁, 因此
resizeRowsToContents() 和
resizeColumnsToContents()
在這裡就很重要了~ 自動調整, 方便又舒服!

回到今天的主題, 昨天我們在表格裡塞入了 QLabel, 讓圖片可以在表格裡呈現, 今天我們來試試把按鈕放進表格裡!
但是這就有一個疑問了, 按鈕按下去要有什麼反應?
想了想還是打開腳色介紹的網頁好了, 那開始動工吧
我們先把每個腳色的網頁加到 list 裡
可惜網站的名稱沒辦法像昨天的圖片一樣可以自訂, 不然直接使用變數多方便
然後表格多加一列專門放按鈕
我們把所有按鈕都加進最新的一列

import sys
from PySide6.QtCore import Qt
from PySide6.QtGui import QIcon, QPixmap
from PySide6.QtWidgets import (QApplication, QTableWidget, QPushButton,
                            QTableWidgetItem, QLabel)

servants = [("EMIYA", "Archer", "https://gamepress.gg/grandorder/servant/emiya"),
        ("Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/gilgamesh"),
        ("Cu Chulainn", "Lancer", "https://gamepress.gg/grandorder/servant/cu-chulainn"),
        ("Alexander", "Rider", "https://gamepress.gg/grandorder/servant/alexander"),
        ("Zhuge Liang (El-Melloi II)", "Caster", "https://gamepress.gg/grandorder/servant/zhuge-liang-el-melloi-ii"),
        ("Cu Chulainn (Caster)", "Caster", "https://gamepress.gg/grandorder/servant/cu-chulainn-caster"),
        ("Solomon (Grand Caster)", "Caster (Grand)", "https://gamepress.gg/grandorder/servant/solomon-grand-caster"),
        ("Arjuna", "Archer", "https://gamepress.gg/grandorder/servant/arjuna"),
        ("Karna", "Lancer", "https://gamepress.gg/grandorder/servant/karna"),
        ("Kid Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/kid-gilgamesh"),
        ("Edmond Dantes", "Avenger", "https://gamepress.gg/grandorder/servant/edmond-dantes"),
        ("Cu Chulainn (Alter)", "Berserker", "https://gamepress.gg/grandorder/servant/cu-chulainn-alter")]

if __name__ == "__main__":
    app = QApplication([])
    QApplication.setApplicationName("Hello")
    QApplication.setWindowIcon(QIcon("214.png"))
    table = QTableWidget()
    table.setRowCount(len(servants))
    table.setColumnCount(len(servants[0])+1)
    table.setHorizontalHeaderLabels(["Icon", "Name", "Class", "Go to details"])
    for i, (name, _class, url) in enumerate(servants):
        servantIcon = QLabel("")
        servantIcon.setPixmap(QPixmap("%s.png" % name))
        servantName = QTableWidgetItem(name)
        servantClass = QTableWidgetItem(_class)
        servantUrl = QPushButton(">>")
        table.setCellWidget(i, 0, servantIcon)
        table.setItem(i, 1, servantName)
        table.setItem(i, 2, servantClass)
        table.setCellWidget(i, 3, servantUrl)

    table.resizeRowsToContents()
    table.resizeColumnsToContents()

    table.show()
    sys.exit(app.exec())

途中成果展示
https://ithelp.ithome.com.tw/upload/images/20220909/201511440tJEt5C11p.png

按鈕自動填滿整個格子看起來好醜, 我們來自定一下按鈕大小
在 for 迴圈中加 servantUrl.setFixedSize(50, 30)
看一下成果如何
https://ithelp.ithome.com.tw/upload/images/20220909/20151144xv9hgpizMY.png

行高被按鈕的高度影響到了啊!!
那只好改個方法了, 我們把 table.resizeRowsToContents() 移除, 改成在 for 迴圈裡按照圖片大小調整每一行高度

import sys
from PySide6.QtCore import Qt
from PySide6.QtGui import QIcon, QPixmap
from PySide6.QtWidgets import (QApplication, QTableWidget, QPushButton,
                            QTableWidgetItem, QLabel)

servants = [("EMIYA", "Archer", "https://gamepress.gg/grandorder/servant/emiya"),
        ("Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/gilgamesh"),
        ("Cu Chulainn", "Lancer", "https://gamepress.gg/grandorder/servant/cu-chulainn"),
        ("Alexander", "Rider", "https://gamepress.gg/grandorder/servant/alexander"),
        ("Zhuge Liang (El-Melloi II)", "Caster", "https://gamepress.gg/grandorder/servant/zhuge-liang-el-melloi-ii"),
        ("Cu Chulainn (Caster)", "Caster", "https://gamepress.gg/grandorder/servant/cu-chulainn-caster"),
        ("Solomon (Grand Caster)", "Caster (Grand)", "https://gamepress.gg/grandorder/servant/solomon-grand-caster"),
        ("Arjuna", "Archer", "https://gamepress.gg/grandorder/servant/arjuna"),
        ("Karna", "Lancer", "https://gamepress.gg/grandorder/servant/karna"),
        ("Kid Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/kid-gilgamesh"),
        ("Edmond Dantes", "Avenger", "https://gamepress.gg/grandorder/servant/edmond-dantes"),
        ("Cu Chulainn (Alter)", "Berserker", "https://gamepress.gg/grandorder/servant/cu-chulainn-alter")]

if __name__ == "__main__":
    app = QApplication([])
    QApplication.setApplicationName("Hello")
    QApplication.setWindowIcon(QIcon("214.png"))
    table = QTableWidget()
    table.setRowCount(len(servants))
    table.setColumnCount(len(servants[0])+1)
    table.setHorizontalHeaderLabels(["Icon", "Name", "Class", "Go to details"])
    for i, (name, _class, url) in enumerate(servants):
        servantIcon = QLabel("")
        servantIcon.setPixmap(QPixmap("%s.png" % name))
        servantName = QTableWidgetItem(name)
        servantClass = QTableWidgetItem(_class)
        servantUrl = QPushButton(">>")
        servantUrl.setFixedSize(50, 30)
        table.setCellWidget(i, 0, servantIcon)
        table.setItem(i, 1, servantName)
        table.setItem(i, 2, servantClass)
        table.setCellWidget(i, 3, servantUrl)
        table.setRowHeight(i, servantIcon.height())

    table.resizeColumnsToContents()

    table.show()
    sys.exit(app.exec())

途中成果展示
https://ithelp.ithome.com.tw/upload/images/20220909/20151144K0I1opwcin.png

接下來試試把所有的按鈕連接上開啟網頁的功能

import sys
import webbrowser
from PySide6.QtCore import Qt
from PySide6.QtGui import QIcon, QPixmap
from PySide6.QtWidgets import (QApplication, QTableWidget, QPushButton,
                            QTableWidgetItem, QLabel)

servants = [("EMIYA", "Archer", "https://gamepress.gg/grandorder/servant/emiya"),
        ("Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/gilgamesh"),
        ("Cu Chulainn", "Lancer", "https://gamepress.gg/grandorder/servant/cu-chulainn"),
        ("Alexander", "Rider", "https://gamepress.gg/grandorder/servant/alexander"),
        ("Zhuge Liang (El-Melloi II)", "Caster", "https://gamepress.gg/grandorder/servant/zhuge-liang-el-melloi-ii"),
        ("Cu Chulainn (Caster)", "Caster", "https://gamepress.gg/grandorder/servant/cu-chulainn-caster"),
        ("Solomon (Grand Caster)", "Caster (Grand)", "https://gamepress.gg/grandorder/servant/solomon-grand-caster"),
        ("Arjuna", "Archer", "https://gamepress.gg/grandorder/servant/arjuna"),
        ("Karna", "Lancer", "https://gamepress.gg/grandorder/servant/karna"),
        ("Kid Gilgamesh", "Archer", "https://gamepress.gg/grandorder/servant/kid-gilgamesh"),
        ("Edmond Dantes", "Avenger", "https://gamepress.gg/grandorder/servant/edmond-dantes"),
        ("Cu Chulainn (Alter)", "Berserker", "https://gamepress.gg/grandorder/servant/cu-chulainn-alter")]

if __name__ == "__main__":
    app = QApplication([])
    QApplication.setApplicationName("Hello")
    QApplication.setWindowIcon(QIcon("214.png"))
    table = QTableWidget()
    table.setRowCount(len(servants))
    table.setColumnCount(len(servants[0])+1)
    table.setHorizontalHeaderLabels(["Icon", "Name", "Class", "Go to details"])
    servantUrl = []
    for i in range(12):
        btn = QPushButton(">>")
        btn.clicked.connect(lambda: webbrowser.open(servants[i][2]))
        servantUrl.append(btn)

    for i, (name, _class, _url) in enumerate(servants):
        servantIcon = QLabel("")
        servantIcon.setPixmap(QPixmap("%s.png" % name))
        servantName = QTableWidgetItem(name)
        servantClass = QTableWidgetItem(_class)
        servantUrl[i].setFixedSize(50, 30)
        table.setCellWidget(i, 0, servantIcon)
        table.setItem(i, 1, servantName)
        table.setItem(i, 2, servantClass)
        table.setCellWidget(i, 3, servantUrl[i])
        table.setRowHeight(i, servantIcon.height())

    table.resizeColumnsToContents()

    table.show()
    sys.exit(app.exec())

看看結果如何
fail
失敗..., 明天再來看看找是哪裡出錯...


上一篇
【Day06】QTableWidget 表格 with Images 圖片
下一篇
【Day08】把 QPushButton 按鈕放進 QTableWidget 表格 續
系列文
[Python QT] 玩玩 Pyside 的各種功能 共 31 篇
  1. 27
    【Day27】QTreeView 完全新手 - 續續之圖片
  2. 28
    【Day28】QTreeView 完全新手 - 續續續之假按鈕
  3. 29
    【Day29】QHelpContentWidget
  4. 30
    【Day30】QHelpContentWidget + QToolBar 之說明視窗
  5. 31
    【Day30】30 天心得
完整目錄
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言
iThome鐵人賽
參賽組數
1064 組
團體組數
40 組
累計文章數
22081 篇
完賽人數
594 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙