4.19Qt5的控件与布局

Qt5的控件与布局

1. 最小系统

   1. 创建App对象(应用程序对象)(app = QApplication(sys.argv))
   2. 创建窗口(window = QWidget())
   3. 设置窗口大小(setGeometry(x, y, w, h))
   4. 设置窗口标题(window.setWindowTitle('第一个窗口'))
   5. 显示窗口(window.show())
   6. 启动循环程序(sys.exit(app.exec_()))

2. 常用控件

   1. QLbel(显示文字, 父标签) – 标签

      # QLabel(显示的文字, 父标签)
      label1 = QLabel('用户名：', self)
      label1.move(50, 10)    # 默认在0，0的位置
      

   2. QPushButton(显示文字, 父标签) – 按钮

      btn1 = QPushButton('确定', self)
      btn1.move(50, 50)
      
      

   3. css语法:选择器{属性1: 属性值1; 属性2:属性值2;...}

      '''
      color - 文字颜色
      background-color - 背景颜色
      font-size - 字体大小
      border - 边框，宽度、样式、颜色
      border-radius - 边框圆角大小
      width - 宽度
      height - 高度
      '''
      
      # 用css 方法 给按钮添加样式
      # btn1.setStyleSheet('QPushButton{color: #008000;background-color: #FFFF00;font-size: 20px;border: 1px solid #FF0000; border-radius: 8px;width: 100px; height: 40px;}')
      

   4. QReadioButton(显示文字, 父标签) - - - 单选按钮(圆)

      btn2 = QRadioButton('男', self)
      btn2.move(50, 100)
      

   5. QCheckBox(显示文字, 父标签) - - - 单选按钮(方)

      btn3 = QCheckBox('篮球', self)
      btn3.move(50, 150)
      

   6. QLineEdit(显示文字, 父标签) - - - 单行输入框

      input1 = QLineEdit(self)
      input1.move(150, 10)
      
      # 修改输入框中的内容
      input1.setText('zhangsan')
      
      # 设置密码格式
      input2.setEchoMode(input2.Password)
      # 获取输入框中的内容
      print(input1.text())
      

   7. QTextEdit(父标签) - - - 多行输入框(富文本)

      input3 = QTextEdit(self)
      input3.move(100, 300)
      input3.setText('111')
      
      #设置只读
      input3.setReadOnly(True)
      

   8. QSpinBox(父标签) - - - 上下选择整型数字(小数:QDoubleSpinBox)

      input5 = QSpinBox(self)
      input5.move(300, 200)
      input5.setMinimum(1)  # 最小值
      input5.setMaximum(50)  # 最大值
      input5.setValue(15)   # 设置初始值
      print(input5.value())  # 获取当前值
      

   9. QCombBox(父标签) - - - 下拉自定义下拉列表

      input7 = QComboBox(self)
      input7.addItems(['item1', 'it2'])
      x = input7.currentText()  # 获取当前选中的选项
      input7.move(200, 220)
      

   10. QFontComboBox(父标签) - - - 下拉选择字体

       input8 = QFontComboBox(self)
       input8.move(50, 250)
       input8.setCurrentIndex(8)
       input8.currentFont() # 获取当前选中的字体
       label1.setFont(input8.currentFont())  # 设置字体样式
       
       

   11. QDateTimeEdit(datetime类型时间, self) - - - 日期输入

       # h.日期输入
       x = datetime.now()  # 当前时间
       input9 = QDateTimeEdit(x, self)  # 需要datetime对象
       input9.move(50, 270)
       

   12. QColorDialog(对象) — 颜色输入

       input10 = QColorDialog(self)
       input10.move(50, 350)
       input10.show()
       

   13. QSlider(对象) - - - 音量滑块

       input12 = QSlider(self)
       input12.move(120, 400)
       input12.setValue(100)  # 设置当前值
       input12.setOrientation(Qt.Horizontal) # 设置水平方向
       # input12.setLayoutDirection()
       

3. 布局

   1. 垂直布局(QVBoxLayout)

      from PyQt5.QtWidgets import QVBoxLayout
      # 1.创建水平布局盒子对象
      box_v = QVBoxLayout(self)
      
      # 2.添加标签
      box_v.addStretch(1)  # 添加弹簧
      box_v.addWidget(label1)  # 添加控件
      box_v.addlayout(box_h)  # 添加盒子(布局)
      

   2. 水平布局(QHBoxLayout)

      from PyQt5.QtWidgets import QHBoxLayout
      
      # 1.创建水平布局盒子对象
      box_h = QHBoxLayout(self)
      
      # 2.添加标签
      box_h.addStretch(1)  # 添加弹簧
      box_h.addWidget(label1)  # 添加控件
      box_h.addlayout(box_v)  # 添加盒子(布局)
      

   3. 网格布局(QGridLayout)

      from PyQt5.QtWidgets import QGridLayout
      
      # 1.创建水平布局盒子对象
      box_g = QGridLayout(self)
      
      # 2.添加标签
      box_g.addStretch(1)  # 添加弹簧
      box_g.addWidget(label1)  # 添加控件
      box_g.addlayout(box_v)  # 添加盒子(布局)
      

   4. 整体应用

      """
      页面上面为一条, 下面为左右
      
      """
      # 先创建整体的上下布局
      box_v =  QVBoxLayout(self)
      
      # 添加上方 水平布局
      box_h1 = QHBoxLayout(self)
      box_v.addlayout(box_h1)
      
      # 添加下面的 水平布局
      box_h2 = QHBoxLayout(self)
      box_v.addlayout(box_h2)
      
      label1 = QLabel(self)
      label2 = QLabel(self)
      # 添加下方水平的左label1, 和右边的label2  且右边占的位置大
      box_h2.addlayout(label1, 1)  # 参数 1 为设置弹簧的程度
      box_h2.addlayout(label2, 2)  # 弹簧参数越大 对应的占的位置越大
      

4. 实现计算机实例

   import sys
   from PyQt5.QtWidgets import QApplication, QWidget, QGridLayout, QPushButton, QLineEdit, QVBoxLayout, QHBoxLayout
   
   
   class MyWindow(QWidget):
       def __init__(self):
           super(MyWindow, self).__init__()
           self.initUI()
           # 第一个数字
           self.first = None
           # 第二个数字
           self.second = None
           # 运算符
           self.operator = ''
           self.is_next = False
           self.last_press = None
   
       def initUI(self):
           box = QVBoxLayout()
           self.setLayout(box)
   
           box1 = QHBoxLayout()
           self.text = QLineEdit()
           box1.addWidget(self.text)
           box.addLayout(box1)
   
           box2 = QGridLayout()
           names = ['Cls', 'Bck', '', 'Close',
                    '7', '8', '9', '/',
                    '4', '5', '6', '*',
                    '1', '2', '3', '-',
                    '0', '.', '=', '+']
           positions = [(i, j) for i in range(5) for j in range(4)]
           for position, name in zip(positions, names):
               if name == '':
                   continue
               button = QPushButton(name)
               button.clicked.connect(self.btn_action)
               box2.addWidget(button, *position)
           box.addLayout(box2)
   
           self.setGeometry(300, 300, 400, 300)
           self.setWindowTitle('计算器')
           self.show()
   
       def btn_action(self, eve):
           source = self.sender()
           text = source.text()
           is_press = False
           # 如果按的是数字键
           if text in '0123456789':
               value = self.text.text()
               if self.is_next:
                   value = ''
                   self.is_next = False
   
               self.text.setText(value+text)
   
           elif text in '+-*/':
               self.is_next = True
               if self.first == None:
                   self.first = self.text.text()
                   self.operator = text
                   return
   
               result = str(eval(f'{self.first}{self.operator}{self.text.text()}'))
               self.first = result
               self.text.setText(result)
               self.operator = text
   
   
   if __name__ == '__main__':
       app = QApplication(sys.argv)
       w = MyWindow()
       sys.exit(app.exec_())