Slider Widget in Kivy

Introduction

Kivy is a multi-platform Python GUI development library that runs on iOS, Android, Windows, OS X, and GNU/Linux. It aids in the development of apps that make use of cutting-edge multi-touch user interfaces. Kivy's core concept allows developers to create an app once and deploy it across all devices, making code reusable and deployable and enabling quick and easy interaction design and prototyping.

Slider Widget

The Slider widget has the appearance of a scrollbar. The Slider widget appears to be similar to the one we use in Android to adjust brightness, volume, and other settings.

• For app development, Kivy includes a slider widget.
   
• A Kivy slider widget can be used in either a vertical or horizontal orientation in an app.
   
• The slider control can provide a minimum, maximum, and default value.
   
• Kivy has many slider widget settings for changing the cursor, cursor picture, border, background, and a region between the minimum and maximum values in different orientations.
   
• Kivy additionally allows you to work with normalized range values rather than the real range provided by the slider.

• A normalized value is one in which the smallest value is 0, and the greatest value is 1.

To use the slider, you must first import the module kivy.uix.slider, which contains all of the slider's features and functions.

The following is a basic approach to use when designing a slider:

import kivy 
import kivy App 
import gridlayout(according to need, not compulsory) 
import Label(according to need, not compulsory) 
import Slider 
import Numeric property 
set minimum version(optional) 
Extend the class 
Add and return a widget 
Run an instance of the class

You can also try this code with Online Python Compiler

Run Code

The code for implementing the slider is as follows:

# to import kivy
import kivy
from kivy.app import App

# we use GridLayout to arrange children in a matrix.
from kivy.uix.gridlayout import GridLayout

# It will through an error
# If we will not import slider
from kivy.uix.slider import Slider

# Label widget is used for rendering text.
from kivy.uix.label import Label
from kivy.properties  import NumericProperty

 
# class to defining the sliders
class WidgetContainer(GridLayout):


    def __init__(self, **kwargs):

        super(WidgetContainer, self).__init__(**kwargs)


        # 2 columns in a grid layout

        self.cols = 2

        self.brightnessControl = Slider(min=0, max =100)

        # 1st row - one label, one slider    

        self.add_widget(Label(text='brightness'))

        self.add_widget(self.brightnessControl)

        # 2nd row - one label for caption, one label for slider value

        self.add_widget(Label(text='Slider Value'))

        self.brightnessValue = Label(text='0')

        self.add_widget(self.brightnessValue)

        # On the slider object, Attach a callback for the attribute named value

        self.brightnessControl.bind(value=self.on_value)

 
    def on_value(self, instance, brightness):

        self.brightnessValue.text = "%d"%brightness


# The app class

class Slider_Example(App):

    def build(self):

        widgetContainer = WidgetContainer()

        return widgetContainer
 

# Run the app      

if __name__ == '__main__':

    Slider_Example().run()

You can also try this code with Online Python Compiler

Run Code

Output