Python Kivy Slider, Color and Canvas Example

Working with kivy often requires writing canvas codes which are managing the appearance  before, during and after the content is drawn. In this example, one Kivy Slider is used for getting color value between 0 and 1 and in the same time there is a Kivy Label which contains Slider’s value and updated automatically with the help of automatic property binding on Kivy.

This example makes red, green and blue components of the color equal to the Slider’s value. All the view part and most of the control part is implemented in a kv file which is written in Kivy Language. Property binding was also performed in this file, too. This example uses Kivy’s BoxLayout to manage positions and sizes of both Slider and Label. Background color is arranged with canvas.before as it can be seen in source code.

The Python file:

#-*-coding:utf-8-*-
'''
Created on 30 Haz 2015

@author: guray
'''

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout 

class RootWidget(BoxLayout):
    pass

class SliderExampleApp(App):
    def build(self):
        return RootWidget()
    
if __name__ == '__main__':
    SliderExampleApp().run()

The Kivy file(name it as sliderexample.kv):

<RootWidget>:
    orientation: "vertical"
    slider_colors: 0.5, 0.5, 0.5
    canvas.before:
        Color:
            rgb: root.slider_colors
        Rectangle:
            pos: root.pos
            size: root.size
    Slider:
        min: 0
        max: 1
        value: 0.5
        on_value: color_label.text = "Renk: "+str(self.value); root.slider_colors = (self.value for i in xrange(3))
    Label:
        id: color_label
        font_size: "50sp"
        text: "Renk: 0.5"

Any suggestions/improvements will be appreciated.

In the next post, you will be able to find three slider Kivy example which controls red, green and blue, respectively.

 
comments powered by Disqus