How to insert buttons on top of a pyqtgraph plot area?

139 Views Asked by At

I'm working on a PyQt5 application, intending to use pyqtgraph to plot some data. I know pyqtgraph plot area already comes with mouse interaction modes, but I'd like to make this modes more visible to the user and add more functionalities (for example adding a button for ROI). To reach this, I want to add a frame with buttons on top of the plot area, similar to this example In addition, I'd like the buttons to stay in their place even when the window is resized and moved.

I've created a window with two GraphicView widget as PlotWidget (imbedding pyqtgraph):

from PyQt5 import QtCore, QtGui, QtWidgets


class Ui_PlotsWindow(object):
    def setupUi(self, PlotsWindow):
        PlotsWindow.setObjectName("PlotsWindow")
        PlotsWindow.resize(807, 650)
        self.centralwidget = QtWidgets.QWidget(PlotsWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.verticalLayout = QtWidgets.QVBoxLayout(self.centralwidget)
        self.verticalLayout.setContentsMargins(5, 5, 5, 5)
        self.verticalLayout.setSpacing(0)
        self.verticalLayout.setObjectName("verticalLayout")
        self.plot = PlotWidget(self.centralwidget)
        self.plot.setObjectName("plot")
        self.verticalLayout.addWidget(self.plot)
        PlotsWindow.setCentralWidget(self.centralwidget)
        self.dockWidget_2 = QtWidgets.QDockWidget(PlotsWindow)
        self.dockWidget_2.setMinimumSize(QtCore.QSize(190, 100))
        self.dockWidget_2.setMaximumSize(QtCore.QSize(524287, 300))
        self.dockWidget_2.setFeatures(QtWidgets.QDockWidget.DockWidgetFloatable|QtWidgets.QDockWidget.DockWidgetMovable|QtWidgets.QDockWidget.DockWidgetVerticalTitleBar)
        self.dockWidget_2.setAllowedAreas(QtCore.Qt.BottomDockWidgetArea|QtCore.Qt.TopDockWidgetArea)
        self.dockWidget_2.setObjectName("dockWidget_2")
        self.dockWidgetContents_2 = QtWidgets.QWidget()
        self.dockWidgetContents_2.setObjectName("dockWidgetContents_2")
        self.horizontalLayout = QtWidgets.QHBoxLayout(self.dockWidgetContents_2)
        self.horizontalLayout.setContentsMargins(5, 0, 5, 5)
        self.horizontalLayout.setSpacing(5)
        self.horizontalLayout.setObjectName("horizontalLayout")
        self.signal = PlotWidget(self.dockWidgetContents_2)
        self.signal.setObjectName("signal")
        self.horizontalLayout.addWidget(self.signal)
        self.dockWidget_2.setWidget(self.dockWidgetContents_2)
        PlotsWindow.addDockWidget(QtCore.Qt.DockWidgetArea(8), self.dockWidget_2)

        self.retranslateUi(PlotsWindow)
        QtCore.QMetaObject.connectSlotsByName(PlotsWindow)

    def retranslateUi(self, PlotsWindow):
        _translate = QtCore.QCoreApplication.translate
        PlotsWindow.setWindowTitle(_translate("PlotsWindow", "MainWindow"))
        self.dockWidget_2.setWindowTitle(_translate("PlotsWindow", "Time Series"))
from pyqtgraph import PlotWidget

And a frame with buttons widget:

from PyQt5.QtGui import *
from PyQt5.QtCore import *
from PyQt5.QtWidgets import *


class OverlayButtons(QWidget):

    def __init__(self):
        QWidget.__init__(self)

        self.initUI()

    def initUI(self):
        self.verticalLayout = QVBoxLayout(self)
        self.verticalLayout.setContentsMargins(2, 2, 2, 2)
        self.verticalLayout.setSpacing(5)
        self.btn_1 = QPushButton()
        self.btn_1.setMinimumSize(QSize(20, 20))
        self.btn_1.setMaximumSize(QSize(20, 20))
        self.btn_1.setText('1')
        self.verticalLayout.addWidget(self.btn_1)
        self.btn_2 = QPushButton()
        self.btn_2.setMinimumSize(QSize(20, 20))
        self.btn_2.setMaximumSize(QSize(20, 20))
        self.btn_2.setObjectName("btn_2")
        self.btn_2.setText('2')
        self.verticalLayout.addWidget(self.btn_2)

I'm trying to insert the frame with buttons widget to the plot area this way:

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *
import pyqtgraph as pg


class Plots(QMainWindow):

    def __init__(self):
        super(Plots, self).__init__()

        self.ui = Ui_PlotsWindow()
        self.ui.setupUi(self)

        self.overlay_buttons = OverlayButtons(self.ui.plot)
        self.overlay_buttons.setParent(self.ui.plot)
        self.overlay_buttons.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = Plots()
    window.show()
    sys.exit(app.exec_())

I managed to insert the frame with buttons within the plot area, but it's appearing on left-top corner. I'd like this on right-top corner.

0

There are 0 best solutions below