PyQt4 精彩例項分析* 例項6 實現QQ抽屜效果
抽屜效果是軟體介面設計中的一種常用形式,目前很多流行軟體都採用了抽屜效果,如騰訊公司的QQ軟體,抽屜效果可以以一種動態直觀的方式在有限大小的介面上擴展出更多的功能。本例項在Qt下實現抽屜效果,如下圖所示。
具體實現程式碼如下:
# -*- coding: utf-8 -*- from PyQt4.QtGui import * from PyQt4.QtCore import * import sys QTextCodec.setCodecForTr(QTextCodec.codecForName("utf8")) class MyQQ(QToolBox): def __init__(self,parent=None): super(MyQQ,self).__init__(parent) toolButton1_1=QToolButton() toolButton1_1.setText(self.tr("朽木")) toolButton1_1.setIcon(QIcon("image/9.gif")) toolButton1_1.setIconSize(QSize(60,60)) toolButton1_1.setAutoRaise(True) toolButton1_1.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton1_2=QToolButton() toolButton1_2.setText(self.tr("Cindy")) toolButton1_2.setIcon(QIcon("image/8.gif")) toolButton1_2.setIconSize(QSize(60,60)) toolButton1_2.setAutoRaise(True) toolButton1_2.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton1_3=QToolButton() toolButton1_3.setText(self.tr("了了")) toolButton1_3.setIcon(QIcon("image/1.gif")) toolButton1_3.setIconSize(QSize(60,60)) toolButton1_3.setAutoRaise(True) toolButton1_3.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton1_4=QToolButton() toolButton1_4.setText(self.tr("張三虎")) toolButton1_4.setIcon(QIcon("image/3.gif")) toolButton1_4.setIconSize(QSize(60,60)) toolButton1_4.setAutoRaise(True) toolButton1_4.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton1_5=QToolButton() toolButton1_5.setText(self.tr("CSDN")) toolButton1_5.setIcon(QIcon("image/4.gif")) toolButton1_5.setIconSize(QSize(60,60)) toolButton1_5.setAutoRaise(True) toolButton1_5.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton2_1=QToolButton() toolButton2_1.setText(self.tr("天的另一邊")) toolButton2_1.setIcon(QIcon("image/5.gif")) toolButton2_1.setIconSize(QSize(60,60)) toolButton2_1.setAutoRaise(True) toolButton2_1.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton2_2=QToolButton() toolButton2_2.setText(self.tr("藍綠不分")) toolButton2_2.setIcon(QIcon("image/6.gif")) toolButton2_2.setIconSize(QSize(60,60)) toolButton2_2.setAutoRaise(True) toolButton2_2.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton3_1=QToolButton() toolButton3_1.setText(self.tr("老牛")) toolButton3_1.setIcon(QIcon("image/7.gif")) toolButton3_1.setIconSize(QSize(60,60)) toolButton3_1.setAutoRaise(True) toolButton3_1.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) toolButton3_2=QToolButton() toolButton3_2.setText(self.tr("張三瘋")) toolButton3_2.setIcon(QIcon("image/8.gif")) toolButton3_2.setIconSize(QSize(60,60)) toolButton3_2.setAutoRaise(True) toolButton3_2.setToolButtonStyle(Qt.ToolButtonTextUnderIcon) groupbox1=QGroupBox() vlayout1=QVBoxLayout(groupbox1) vlayout1.setMargin(10) vlayout1.setAlignment(Qt.AlignCenter) vlayout1.addWidget(toolButton1_1) vlayout1.addWidget(toolButton1_2) vlayout1.addWidget(toolButton1_3) vlayout1.addWidget(toolButton1_4) vlayout1.addWidget(toolButton1_5) vlayout1.addStretch() groupbox2=QGroupBox() vlayout2=QVBoxLayout(groupbox2) vlayout2.setMargin(10) vlayout2.setAlignment(Qt.AlignCenter) vlayout2.addWidget(toolButton2_1) vlayout2.addWidget(toolButton2_2) groupbox3=QGroupBox() vlayout3=QVBoxLayout(groupbox3) vlayout3.setMargin(10) vlayout3.setAlignment(Qt.AlignCenter) vlayout3.addWidget(toolButton3_1) vlayout3.addWidget(toolButton3_2) self.addItem(groupbox1,self.tr("我的好友")) self.addItem(groupbox2,self.tr("同事")) self.addItem(groupbox3,self.tr("黑名單")) app=QApplication(sys.argv) myqq=MyQQ() myqq.setWindowTitle("My QQ") myqq.show() app.exec_()
MyQQ類繼承自QToolBox,QToolBox提供了一種列狀的層疊窗體,本例項通過QToolBox來實現一種抽屜效果,QToolButton提供了一種快速訪問命令或選擇項的按鈕,通常在工具條中使用。
第75行建立了一個QGroupBox類例項,在本例中對應每一個抽屜。
第12行建立了一個QToolButton類例項,在這裡QToolButton分別對應於抽屜中的每一個按鈕。
第13-15行對按鈕的文字,圖示以及大小等進行設定。
第16行設定按鈕的AutoRaise屬性為True,即當滑鼠離開時,按鈕自動恢復成彈起狀態。
第17行設定按鈕的ToolButtonStyle屬性,ToolButtonStyle屬性主要用來描述按鈕的文字和圖示的顯示方式。Qt定義了4種QToolButtonStyle型別,分別介紹如下。
Qt.ToolButtonIconOnly:只顯示圖示。
Qt.ToolButtonTextOnly:只顯示文字。
Qt.ToolButtonTextBesideIcon:文字顯示在圖示旁邊。
Qt.ToolButtonTextUnderIcon:文字顯示在圖示下面。
程式設計師可以根據顯示需要調整顯示方式。
第76行建立一個QVBoxLayout類例項,用來設定抽屜內各按鈕的佈局。
第77,78行設定佈局中各按鈕的顯示間距和顯示位置。
第79-83行將抽屜內的各個按鈕加入。
第84行呼叫addStretch()方法在按鈕之後插入一個佔位符,使得所有按鈕能靠上對齊。並且在整個抽屜大小發生改變時,保證按鈕的大小不發生變化。
其它行都是實現類似的功能。
第100-102行把準備好的抽屜插入至QToolBox中。