How to pass ColorPicker property to root widget

Question

I am trying to learn how to pass the ColorPicker object property to the main class MainWindow from the kv file. I have created classes ColPopup and PickColor and I am able to get the information about the selected color, but I am unable to get the color value passed to MainWindow from PickColor.

Any suggestions on how to achieve this? I would like to have the Object Property colorpicker set to the colorpicker so that I can access the .color method later.

main.py

from kivy.app import App
#kivy.require("1.11.1")

from kivy.uix.boxlayout import BoxLayout

from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.checkbox import CheckBox 
from kivy.properties import ObjectProperty
from kivy.uix.colorpicker import ColorPicker
from kivy.uix.popup import Popup

from kivy.config import Config
Config.set('graphics', 'width', '1200')
Config.set('graphics', 'height', '600')
     

class ColPopup(Popup):
    pass

class PickColor(ColorPicker):
    pass

class MainWindow(BoxLayout):
    colorpicker = ObjectProperty()
    
    def __init__(self, **kwargs):
        super(MainWindow, self).__init__(**kwargs)
        self.range_tab_action_grid_buttons = {}
        self.create_actions()
        
    def choose_color(self, instance):
        ColPopup().open()
        print("color picked for ", instance, "with current color", instance.background_color)
        print(self.colorpicker)
                    
    def create_actions(self):   
        
        for i in range(1, 4):
            grid = BoxLayout(size=(180, 20), size_hint=(None, None))
            checkbox = CheckBox(group="Actions",allow_no_selection=False, size_hint=(.2,1))
            grid.add_widget(checkbox)
            label = Label(text="Action"+str(i)+" color", size_hint=(.6,1)) 
            grid.add_widget(label)
                        
            colored_button = Button(background_color=[0, 45, 100, 1], size_hint=(.2,0.8), pos_hint={'center_y':0.5})
            colored_button.bind(on_press = self.choose_color)
            
            grid.add_widget(colored_button)
            self.ids.range_tab_action_grid.add_widget(grid)
            self.range_tab_action_grid_buttons["Action"+str(i)] = {"grid":grid, "checkbox":checkbox, "label":label, "colored_button":colored_button} #, "colorpicker":colorpicker}
            
            # Check the first box
            self.range_tab_action_grid_buttons["Action1"]["checkbox"].active = True

        #print(self.range_tab_action_grid_buttons["Action1"][3].background_color)       
        
        
class ColorPickerApp(App):

    def build(self):
        return MainWindow()
    
if __name__ == "__main__":
    ColorPickerApp().run()

colorpicker.kv

# File name: main.py
#:kivy 1.11.1  

<ColPopup>:
    title: 'Pick a Color'
    size_hint: 0.5, 0.6
    colorpicker: colorpicker
    
    BoxLayout:
        orientation: 'vertical'
        PickColor:
            id: colorpicker
        Button:
            text: "Select color"
            on_release: root.dismiss()
            size_hint: 0.3,0.3
            pos_hint: {"center_x":0.75,"top":0.0}
             

<Button>:
    font_size: 10
    color: 1,1,1,1
    size_hint: 0.05, 0.05
    
                   
<MainWindow>:                        
    BoxLayout:
        id: range_tab_action_grid
        orientation: "vertical"
        size_hint: 0.3, 0.2
        pos_hint: {"right":0.0, "top":1.0}        
 

Answer 1

You can just set the on_release of your Select color to call a method in your MainWindow. If you modify your kv rule for ColPopup:

<ColPopup>:
    title: 'Pick a Color'
    size_hint: 0.5, 0.6
    colorpicker: colorpicker
    
    BoxLayout:
        orientation: 'vertical'
        PickColor:
            id: colorpicker
        Button:
            text: "Select color"
            on_release:
                app.root.chosen_color(colorpicker.color)
                root.dismiss()
            size_hint: 0.3,0.3
            pos_hint: {"center_x":0.75,"top":0.0}

This adds a call to chosen_color() to the Button.

Then modifying the MainWindow class:

class MainWindow(BoxLayout):
    colorpicker = ObjectProperty()

    def __init__(self, **kwargs):
        super(MainWindow, self).__init__(**kwargs)
        self.range_tab_action_grid_buttons = {}
        self.create_actions()

    def choose_color(self, instance):
        for k,v in self.range_tab_action_grid_buttons.items():
            if v['colored_button'] == instance and v['checkbox'].active:
                colpopup = ColPopup()
                self.colorpicker = colpopup.colorpicker
                colpopup.open()
                return

    def chosen_color(self, color):
        Clock.schedule_once(self.get_color, 5)
        for k,v in self.range_tab_action_grid_buttons.items():
            if v['checkbox'].active:
                v['colored_button'].background_color = color
                return

    def get_color(self, dt):
        print('color:', self.colorpicker.color)

    def create_actions(self):
        .
        .
        .

The choose_color() method sets the colorpicker ObjectProperty. It also only opens the ColorPicker if the Button is in the active row.

The chosen_color() method only changes the color of the active Button.

Also note that the background_color of the Button acts as a multiplier of the default texture. You can change that by setting background_normal=''.