Pyqt5中的控件类型提升、QtChart的简单使用、pycharm快捷模版设置_pyqt qchart使用

1、使用控件提升的原因

在使用qt设计师软件时，当遇到软件没有提供自己想使用的控件时，可以使用控件提升的方法

比如在使用QtChart时，由于qt设计师没有提供这个控件，所以需要使用控件提升。

2、使用QtChart进行简单的画图

使用步骤见下图

1. 使用qt设计师设计ui界面
   
2. 这里选择了一个Widget作为窗口，由于QChartView继承自QGraphicsView，所以这里在窗口正中放置了一个QGraphicsView。
3. 在QGraphicsView上鼠标右键，选择提升窗口部件，在弹出的框中按下图进行填写
   

使用上面的填写方式后，其后在ui转换后的py文件中生成代码from PyQt5.QtChart import QChartView

4. 提升之后中样的显示控件属性则变为QChartView
   
5. 将该文件保存为test.ui，然后使用ui2py转换为py文件
6. 新建python文件，以对上面的界面书写逻辑，代码如下

from PyQt5.Qt import *
from ui_test import Ui_Form

from PyQt5.QtChart import QChart, QLineSeries,QValueAxis
import math

class Window(QWidget, Ui_Form):
    def __init__(self):
        super().__init__()
        self.setup_ui()

    def setup_ui(self):
        self.setupUi(self)
        self.setdate()

    def setdate(self):
        chart = QChart()
        chart.setTitle("测试")
        self.graphicsView.setChart(chart)
        seri = QLineSeries()
        seri.setName("cos")
        chart.addSeries(seri)
        t = 0
        for i in range(100):
            y = math.cos(t)
            seri.append(t,y)
            t += 0.1

        ax = QValueAxis()
        ax.setRange(0,10)
        ax.setTitleText("x")
        ay = QValueAxis()
        ay.setRange(-1,1)
        ay.setTitleText("y")
        chart.setAxisX(ax,seri)
        chart.setAxisY(ay,seri)

if __name__ == "__main__":
    import sys
    app = QApplication(sys.argv)
    mywindow = Window()
    mywindow.show()
    sys.exit(app.exec_())
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

运行结果如图：

使用QtChart需要额外安装模块，cmd命令pip3 install pyqtchart

3、设置pycharm软件的快捷模板

对于上面的代码，其中有一部分在结合qt设计师进行gui设计时，是通用的，可以将这部分的代码设置为快捷模板。

1. 在软件中依次点击File-Setting，如图
   
2. 按照下图中的显示，找到Live Templates，将其中的Python项展开
   
3. 点击右边的加号，选择Live Templates
   
4. 下图红框1处为快捷模板的快捷缩写，比如可以写qto。2处为对该快捷模板的描述。3处为快捷模板内容。
   
5. 将下面的代码填写到上图中的红框3处。代码中的$title$在实际中为ui文件转换后py文件的文件名。

from PyQt5.Qt import *
from $title$ import Ui_Form

class Window(QWidget, Ui_Form):
    def __init__(self):
        super().__init__()
        self.setup_ui()

    def setup_ui(self):
        self.setupUi(self)

if __name__ == "__main__":
    import sys
    from PyQt5 import QtCore
    QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
    app = QApplication(sys.argv)
    mywindow = Window()
    mywindow.show()
    sys.exit(app.exec_())
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

6. 将上述模板应用在python代码编写中，如下图设置，在红框2处勾选python。
   
7. 经过上面的设置后，在编写代码时，可以直接输入qto，pycharm软件便会提示快捷模板，此时直接点击回车即可输入模板。
   

注意： 在上面的代码中，创建的类使用了多继承，但是一定要注意，使用qt设计师创建的窗口类型一定要和另一个继承的类相同。例如上面qt设计师创建的窗口为Qwidget类型，所以上面代码中多继承的另一个继承类型也是Qwidget。如果使用qt设计师创建的窗口类型为QMainWindow，则代码应该为class Window(QMainWindow, Ui_MainWindow):，即继承的另一个类应该也是QMainWindow。

4、另外一种能实现类似控件提升的方法

对于上面使用Qchart来画图的情况而言，也可以不使用控件提升来实现同样的目的。
实现方法：

1. 在需要放置qchartview的地方，放置一个frame控件或者widget控件。

注意在qt设计师中，不要对这个控件设置布局。因为如果设置了布局，在后面使用代码编程时，再次进行布局会发生布局错误。（一般情况下，这个控件也设置不了布局，因为其内部没有控件）

2. 在用于对ui文件编写逻辑的代码中，将需要提升的控件（这里是QChartView）绑定到上一步设置的控件上，代码为：

        from PyQt5.QtChart import QChartView
        self.mychartV = QChartView(self.frame)
1
2

3. 上面的代码中，self.frame为qt设计师中用于放置QChartView的控件名。
4. 如果只是这样使用，运行时会发现布局有问题，这是因为窗口中所有的控件都给了布局，但是self.frame没有给布局。所以这里需要对其进行布局。代码为：

        self.verticalLayout = QVBoxLayout(self.frame)
        self.verticalLayout.addWidget(self.mychartV)
1
2

5. 上面的代码中，首先对self.frame控件绑定一个垂直布局（具体根据实际需求），然后在布局中，将绑定在self.frame控件上的self.mychartV添加进去。这几段代码也能实现类似提升控件能实现的效果。