PyQt:个性化登录界面模仿QQ登录

  写了一个登录界面的demo,类似QQ的,写的自己喜欢的样式,贴一下代码,先上效果,如下

陈述

  PyQt5+Python3.5.2

  login.py是里登录的主界面loginWnd类,Header.py里是标题栏和整个窗口的类,我在login.py里面创建了application对象。(其实也没有必要分成两个文件来写,直接按照我这一篇的处理就ok的     https://www.cnblogs.com/jyroy/p/9461317.html,本人话多

  主要是效果实现为主,没有写登录的槽函数啥的,代码中写了解释

效果

PyQt:个性化登录界面模仿QQ登录

代码

1 #login.py 2 3 #!/usr/bin/env python 4 # -*- coding:utf-8 -*- 5 # Author: jyroy 6 import sys 7 8 from PyQt5.QtCore import QSize 9 from PyQt5.QtWidgets import QApplication 10 from PyQt5.QtCore import Qt 11 from PyQt5.QtWidgets import QComboBox 12 from PyQt5.QtWidgets import QGridLayout 13 from PyQt5.QtWidgets import QLineEdit 14 from PyQt5.QtWidgets import QLabel 15 from PyQt5.QtGui import QIcon 16 from PyQt5.QtWidgets import QWidget, QVBoxLayout, QPushButton, QTextEdit 17 from Header import TitleBar,FramelessWindow 18 from qtpy import QtGui 19 20 StyleSheet = """ 21 /*最小化最大化关闭按钮通用默认背景*/ 22 #buttonMinimum,#buttonMaximum,#buttonClose { 23 border: none; 24 } 25 /*悬停*/ 26 #buttonMinimum:hover,#buttonMaximum:hover { 27 28 color: white; 29 } 30 #buttonClose:hover { 31 color: white; 32 } 33 /*鼠标按下不放*/ 34 #buttonMinimum:pressed,#buttonMaximum:pressed { 35 36 } 37 #buttonClose:pressed { 38 color: white; 39 40 } 41 """ #标题栏Button的样式 42 43 StyleSheet_2 = """ 44 QComboBox{ 45 height: 20px; 46 border-radius: 4px; 47 border: 1px solid rgb(111, 156, 207); 48 background: white; 49 } 50 QComboBox:enabled{ 51 color: grey; 52 } 53 QComboBox:!enabled { 54 color: rgb(80, 80, 80); 55 } 56 QComboBox:enabled:hover, QComboBox:enabled:focus { 57 color: rgb(51, 51, 51); 58 } 59 QComboBox::drop-down { 60 background: transparent; 61 } 62 QComboBox::drop-down:hover { 63 background: lightgrey; 64 } 65 66 QComboBox QAbstractItemView { 67 border: 1px solid rgb(111, 156, 207); 68 background: white; 69 outline: none; 70 } 71 72 QLineEdit { 73 border-radius: 4px; 74 height: 20px; 75 border: 1px solid rgb(111, 156, 207); 76 background: white; 77 } 78 QLineEdit:enabled { 79 color: rgb(84, 84, 84); 80 } 81 QLineEdit:enabled:hover, QLineEdit:enabled:focus { 82 color: rgb(51, 51, 51); 83 } 84 QLineEdit:!enabled { 85 color: rgb(80, 80, 80); 86 } 87 88 89 """ #QComobox和QLineEdite的样式 90 91 StyleSheet_btn = """ 92 QPushButton{ 93 height:30px; 94 background-color: transparent; 95 color: grey; 96 border: 2px solid #555555; 97 border-radius: 6px; 98 99 } 100 QPushButton:hover { 101 background-color: white; 102 border-radius: 6px; 103 104 } 105 """ #登录Button的样式 106 107 class loginWnd(QWidget): 108 \'\'\'登录窗口\'\'\' 109 def __init__(self, *args, **kwargs): 110 super(loginWnd, self).__init__() 111 self._layout = QVBoxLayout(spacing=0) 112 self._layout.setContentsMargins(0, 0, 0, 0) 113 self.setAutoFillBackground(True) 114 self.setWindowOpacity(0.1) 115 116 self.setLayout(self._layout) 117 118 self._setup_ui() 119 120 def _setup_ui(self): 121 122 self.main_layout = QGridLayout() 123 124 self.main_layout.setAlignment(Qt.AlignCenter) 125 126 name_label = QLabel(\'用户名\') 127 name_label.setStyleSheet("color:grey;") 128 passwd_label = QLabel(\'密码\') 129 passwd_label.setStyleSheet("color:grey;") 130 131 name_box = QComboBox() 132 name_box.setEditable(True) 133 passwd_box = QLineEdit() 134 passwd_box.setEchoMode(QLineEdit.Password) 135 name_box.setStyleSheet(StyleSheet_2) 136 passwd_box.setStyleSheet(StyleSheet_2) 137 138 label = QLabel() 139 140 login_btn = QPushButton("登录") 141 login_btn.setStyleSheet(StyleSheet_btn) 142 143 self.main_layout.addWidget(name_label,0,0,1,1) 144 self.main_layout.addWidget(passwd_label,1,0,1,1) 145 self.main_layout.addWidget(name_box,0,1,1,2) 146 self.main_layout.addWidget(passwd_box,1,1,1, 2) 147 self.main_layout.addWidget(label,3,0,1,3) 148 self.main_layout.addWidget(login_btn,4,0,1,3) 149 150 self._layout.addLayout(self.main_layout) 151 152 def main(): 153 \'\'\':return:\'\'\' 154 155 app = QApplication(sys.argv) 156 157 mainWnd = FramelessWindow() 158 mainWnd.setWindowTitle(\'欢迎窗口login\') 159 mainWnd.setWindowIcon(QIcon(\'Qt.ico\')) 160 mainWnd.setFixedSize(QSize(500,400)) #因为这里固定了大小,所以窗口的大小没有办法任意调整,想要使resizeWidget函数生效的话要把这里去掉,自己调节布局和窗口大小 161 mainWnd.setWidget(loginWnd(mainWnd)) # 把自己的窗口添加进来 162 mainWnd.show() 163 164 app.exec() 165 166 if __name__ == \'__main__\': 167 main()

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzyswj.html