Python PySide6 Scrollbar & Slider

Python PySide6

About Lesson

In this lesson we want to learn about Python PySide6 Scrollbar & Slider, so first of all let’s talk about PySide6 Scrollbar & Slider.

Scrollbar Widget

Scrollbar is graphical element that appears on the side of widget such as a list, text box or canvas. it allows users to scroll through the contents of widget such as list, text or canvas.

PySide6 Scrollbar widget is an easy to use element that provides developers with straightforward way to create scrollbars for their applications. Here is an example of how to create a scrollbar using PySide6:

from PySide6.QtWidgets import QApplication, QMainWindow, QScrollBar
import sys

class ScrollExample(QMainWindow):

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

        scroll = QScrollBar(self)
        scroll.move(50, 50)
        scroll.resize(30, 100)

        self.setGeometry(300, 300, 300, 200)
        self.setWindowTitle('Scrollbar Example')

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

from PySide6.QtWidgets import QApplication, QMainWindow, QScrollBar

import sys

class ScrollExample(QMainWindow):

def __init__(self):

super().__init__()

scroll = QScrollBar(self)

scroll.move(50, 50)

scroll.resize(30, 100)

self.setGeometry(300, 300, 300, 200)

self.setWindowTitle('Scrollbar Example')

if __name__ == '__main__':

app = QApplication(sys.argv)

window = ScrollExample()

window.show()

sys.exit(app.exec())

In above example we have created PySide6 application and QMainWindow object. after that we have created QScrollBar object and set its position and size. at the end we set the application’s geometry and window title and display the window.

Run the complete code and this will be the result.

Slider Widget

Slider widget is another graphical element that allows users to input value by dragging slider with the mouse. PySide6 library provides developers with simple way to create sliders for their applications. this is an example of how to create slider using PySide6:

from PySide6.QtWidgets import QApplication, QMainWindow, QSlider
from PySide6.QtCore import Qt
import sys

class SliderExample(QMainWindow):

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

        slider = QSlider(Qt.Horizontal, self)
        slider.setGeometry(30, 40, 200, 30)
        slider.setValue(50)

        self.setGeometry(300, 300, 300, 200)
        self.setWindowTitle('Slider Example')

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

from PySide6.QtWidgets import QApplication, QMainWindow, QSlider

from PySide6.QtCore import Qt

import sys

class SliderExample(QMainWindow):

def __init__(self):

super().__init__()

slider = QSlider(Qt.Horizontal, self)

slider.setGeometry(30, 40, 200, 30)

slider.setValue(50)

self.setGeometry(300, 300, 300, 200)

self.setWindowTitle('Slider Example')

if __name__ == '__main__':

app = QApplication(sys.argv)

window = SliderExample()

window.show()

sys.exit(app.exec())

In above example we have created new PySide6 application and also QMainWindow object. after that we have created QSlider object, set its orientation to horizontal, position and size. also we have set the initial value of the slider to 50. and at the end we set the application’s geometry and window title and display the window.

Run the complete code and this will be the result.

Now let’s create another example on QSlider and QScrollbar, this time we want to use Signals and Slots functionalities, Signals and slots are fundamental part of PySide6’s event driven programming model and they allow us to create responsive and interactive applications. this is an example of how to use signals and slots with slider and scrollbar widgets in PySide6:

from PySide6.QtWidgets import QApplication, QMainWindow, QScrollBar, QSlider, QLabel, QVBoxLayout, QWidget
from PySide6.QtCore import Qt
from PySide6.QtGui import QFont
import sys

class Example(QMainWindow):

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

        # create the scrollbar widget
        scrollbar = QScrollBar(self)
        scrollbar.setGeometry(30, 40, 20, 100)

        # create the slider widget
        slider = QSlider(Qt.Horizontal, self)
        slider.setGeometry(80, 40, 100, 30)

        # create a label to display the value of the slider
        self.label = QLabel(self)
        self.label.setAlignment(Qt.AlignCenter)
        self.label.setGeometry(80, 80, 100, 30)

        # create a vertical layout and add the widgets to it
        layout = QVBoxLayout()
        layout.addWidget(scrollbar)
        layout.addWidget(slider)

        # create a widget to hold the layout
        widget = QWidget(self)
        widget.setLayout(layout)

        # connect the valueChanged signals of the scrollbar and slider to the update_label slot
        scrollbar.valueChanged.connect(self.update_label)
        slider.valueChanged.connect(self.update_label)

        # set the window geometry and title, and show the window
        self.setGeometry(300, 300, 300, 200)
        self.setWindowTitle('Slider and Scrollbar Example')
        self.show()

    # slot that updates the label with the value of the scrollbar or slider
    def update_label(self, value):
        self.label.setText(str(value))
        self.label.setFont(QFont("Times", 15))

if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec())

from PySide6.QtWidgets import QApplication, QMainWindow, QScrollBar, QSlider, QLabel, QVBoxLayout, QWidget

from PySide6.QtCore import Qt

from PySide6.QtGui import QFont

import sys

class Example(QMainWindow):

def __init__(self):

super().__init__()

# create the scrollbar widget

scrollbar = QScrollBar(self)

scrollbar.setGeometry(30, 40, 20, 100)

# create the slider widget

slider = QSlider(Qt.Horizontal, self)

slider.setGeometry(80, 40, 100, 30)

# create a label to display the value of the slider

self.label = QLabel(self)

self.label.setAlignment(Qt.AlignCenter)

self.label.setGeometry(80, 80, 100, 30)

# create a vertical layout and add the widgets to it

layout = QVBoxLayout()

layout.addWidget(scrollbar)

layout.addWidget(slider)

# create a widget to hold the layout

widget = QWidget(self)

widget.setLayout(layout)

# connect the valueChanged signals of the scrollbar and slider to the update_label slot

scrollbar.valueChanged.connect(self.update_label)

slider.valueChanged.connect(self.update_label)

# set the window geometry and title, and show the window

self.setGeometry(300, 300, 300, 200)

self.setWindowTitle('Slider and Scrollbar Example')

self.show()

# slot that updates the label with the value of the scrollbar or slider

def update_label(self, value):

self.label.setText(str(value))

self.label.setFont(QFont("Times", 15))

if __name__ == '__main__':

app = QApplication(sys.argv)

ex = Example()

sys.exit(app.exec())

In above example we have created new PySide6 application and also QMainWindow object. after that we have created QScrollBar object and QSlider object and set their position and size. also we have created QLabel object to display the value of the slider, and QVBoxLayout object to hold the widgets. at the end we connect the valueChanged signals of the scrollbar and slider to the update_label slot, which updates the label with the value of the scrollbar or slider.

When you run the example, you should see window containing scrollbar, slider and label displaying the value of the slider. when you move the scrollbar or slider, the label should update with the new value. This is possible thanks to the signals and slots mechanism provided by PySide6, which allows us to create interactive and responsive applications with ease.

Run the complete code and this will be the result.