Multiple Sliders Controlling Background Color in Kivy

In this example, three independent sliders are used to control background color and they are in order of red, green and blue. All the values are written at the buttom of the application window in the precision of 0.001. You can change the precision in .kv file if you want. The color is sent by Kivy’s automatic property binding mechanism to Canvas Color and Label.

The main

Python file:

Created on 31 Haz 2015

@author: guray

from import App
from kivy.uix.boxlayout import BoxLayout 

class RootWidget(BoxLayout):

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

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

    orientation: "vertical"
    slider_colors: 0.5, 0.5, 0.5
            rgb: root.slider_colors
            pos: root.pos
            size: root.size
        min: 0
        max: 1
        value: 0.5
        on_value: root.slider_colors[0] = self.value;
        min: 0
        max: 1
        value: 0.5
        on_value: root.slider_colors[1] = self.value
        min: 0
        max: 1
        value: 0.5
        on_value: root.slider_colors[2] = self.value
        id: color_label
        font_size: "50sp"
        text: "Color:" + ",".join(["%.3f" %(i) for i in root.slider_colors])

Here, Kivy’s ListProperty is utilized. Also there is no change in comparison of the previous example stated in here. As always, all improvements and suggestions are welcomed.

Todo: You can make a HEX code generator using these by changing ranges of sliders and modifying the Label a little bit.

comments powered by Disqus