軟件實戰(zhàn)開始，快速提供編程能力；通過實戰(zhàn)，分析產(chǎn)品需求，梳理設(shè)計需求，提升項目分析和架構(gòu)的能力。快點跟著木辛老師一起學(xué)習(xí)吧！

請點擊右上角“關(guān)注”按鈕關(guān)注我們喲：跟著木辛老師學(xué)習(xí)Python編程知識，變身快樂的編程達人吧~

我們今天的課程還是繼續(xù)上一節(jié)課的內(nèi)容，講解一下如何通過編碼設(shè)置較為復(fù)雜的交互界面邏輯。

我們今天還是沿用登錄頁面，繼續(xù)完善它的功能吧

大家是否還記得上節(jié)課，我們給控件們起了各自的名字？

• 背景圖用的QLabel 叫做：lbl_bg_of_login。
• 顯示軟件logo的控件，我們也是用QLabel，命名為：lbl_logo_of_login。
• 軟件標(biāo)題的部分也是一個Qlabel，命名為：lbl_title_of_app。
• QListWidget是用來選擇用戶身份的，命名為：lst_identities_of_user。
• QLineEdit用來輸入用戶學(xué)號和密碼的，命名為：edit_name_of_user，edit_pwd_of_user。
• “記住我”選項框，是一個QCheckbox，命名為：chk_remember_me。
• QPushButton負(fù)責(zé)，用戶點擊之后將讀取到用戶輸入的相關(guān)數(shù)據(jù)提交到服務(wù)器上，命名為：btn_confrim_login
• “去注冊”按鈕命名為：btn_register。

大家如果有所忘記，可以前往前一節(jié)課進行復(fù)習(xí)，傳送門：《木辛老師的編程課堂之Python和Qt實戰(zhàn)慕課軟件開發(fā) 登錄界面(1)》

下面我們對圖片顯示控件的一些代碼邏輯進行完善吧，首先將.ui文件，通過PyCharm的PyUIC插件轉(zhuǎn)換為python文件。

然后，新建一個頁面和邏輯分離的Python程序，負(fù)責(zé)調(diào)用頁面顯示邏輯。姑且就叫它：CallLoginMainWin.py吧。

具體代碼咱們可以這么寫

調(diào)用頁面的邏輯代碼

右鍵單擊CallLoginMainWin.py，選擇運行程序，查看效果。

QLabel加載背景圖片和LOGO

好了，目前的界面控件都放好了，但是實在是太不好看了。那我們開始美化吧。

第一個是增加登錄頁面左側(cè)背景圖片。

我們需要Python能讀到指定的圖片資源，所以我們在項目的根目錄下新建一個images目錄，并將圖片資源拷貝過來。

我在登錄頁面中使用的背景圖片就像這樣：

./images/auth_slider_bg.png

打開CallLoginMainWin.py，在類ClassLoginMainWin中的__init__方法中添加如下代碼

self.lbl_bg_of_login.setPixmap(QPixmap('images/auth_slider_bg.png'))

通過QLabel的setPixmap方法設(shè)置auth_slider_bg圖片作為背景圖片。

同樣道理，我們將logo也設(shè)置到界面上。

添加如下代碼：

self.lbl_logo_of_login.setGeometry(QRect(64, 80, 96, 70))self.lbl_logo_of_login.setScaledContents(True)self.lbl_logo_of_login.setPixmap(QPixmap('images/logo_slider.png'))

setGeometry方法就是設(shè)置控件的geometry屬性；

咱們之前的課程里講到過，geometry屬性控制控件的位置和尺寸，通過這種方式的布局稱為絕對布局，傳送門：《木辛老師的編程課堂：Python和Qt之頁面布局實戰(zhàn)篇(一)》。

現(xiàn)在來看一下效果吧

調(diào)整窗口和控件尺寸

有的同學(xué)遇到了一些問題，比如，界面尺寸不對，加載的背景圖片并沒有鋪滿整個窗口的左側(cè)。

這時候呢，有一個比較方便的調(diào)整的辦法，就是回到Qt Designer工具，通過圖形化的操作進行調(diào)整。

比如，按照我們的設(shè)計稿，我們的登錄窗口應(yīng)該是520 x 480 px的，所以我們通過屬性編輯窗口，對整個主窗口的尺寸進行了調(diào)整

調(diào)整主窗口尺寸

當(dāng)然了，我們是按照自己的標(biāo)準(zhǔn)進行調(diào)整的，同學(xué)們完全可以按照自己喜歡的尺寸調(diào)整，只要顯示美觀即可，這個沒有特殊要求喲！

此時，調(diào)整了主窗口，我們左側(cè)用于顯示背景的QLabel的位置和尺寸也需要同時做一下修改，還是通過這個控件的屬性編輯窗口進行：

調(diào)整空間屬性

隱藏標(biāo)題欄

有的同學(xué)又問了，我們已經(jīng)通過geometry屬性將左側(cè)背景定格了呀？

為什么運行效果并不是我們想要的，背景圖片上方還是沒有完全覆蓋左側(cè)區(qū)域呀？

這個呢，并不是同學(xué)們代碼的問題，而是Qt Designer本身默認(rèn)會對主窗口添加標(biāo)題欄，這樣就無法將左側(cè)背景圖片完全鋪開了。

那么我們試著隱藏掉這個標(biāo)題欄吧~

通過如下代碼，我們嘗試隱藏登錄頁面的標(biāo)題欄：

self.setWindowFlags(Qt.FramelessWindowHint) # 去掉標(biāo)題欄

通過如上的代碼，我們成功的將登錄頁面主窗口的標(biāo)題欄隱藏掉了，那么這段代碼需要放置在什么位置呢？

隱藏標(biāo)題欄代碼

是的，就是放置在CallLoginMainWin這個類的__init__方法中，放到setupUi這句之前。

咱們運行一下看看效果吧。

運行效果圖片

嗯嗯，不錯，效果達到了，看著還不錯！

暫時還不能關(guān)閉軟件

不過，好像尷尬了，我們怎么關(guān)閉這個窗口呢？我們的關(guān)閉按鈕也隨著標(biāo)題欄消失了呀！

目前，只能先通過PyCharm自帶的關(guān)閉按鈕，結(jié)束這個程序的運行了。

殺死程序

就是這個紅色的小方塊按鈕，點擊兩次之后，運行的登錄窗口被徹底殺死了。

每次都這么操作真的很麻煩呀！特別是以后我們軟件發(fā)布了，用戶也不可能使用這個功能關(guān)閉軟件呀！

嗯，說的很有道理，我們今天先賣個關(guān)子，具體的實現(xiàn)邏輯我們放到了下一節(jié)課~

不過我們可以提前劇透一下，是需要根據(jù)之前學(xué)過的信號和槽的相關(guān)知識解決，大家有思路嗎？傳送門：《木辛老師的編程課堂：Python和Qt之頁面布局實戰(zhàn)篇(2)》

總結(jié)

以上是生活随笔為你收集整理的qt登录界面跳转_每天10分钟，木辛老师带你实战慕课软件开发：登录界面开发第2课...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。