Bill Bridge February 2016

converting static widget tree to dynamic using python and .kv file

I am working on an application where I want to add n image frames in a vertical BoxLayout. The number of n frames depend on the desktop screen size. Next to this the frames will be filled dynamically with images. I was able to develop this in a static manner with a fixed number of frames. Now I am trying to convert this to a dynamic solution where n frame widgets will be created depending on the height of the screen (in the example below 7 widgets). And I am lost..... :(

The frames should 'sit' between a top bar and a bottom bar. In the .kv file this is indicated by the # Ilist: line.

I have the following questions:

1) How could I add these widgets dynamically using a .kv file?

2) How could I reference to these individual frame widgets for assigning images dynamically? For example: frame[idx] = swid?

Thanks very much for your time and shared knowledge in advance.

The Python file pplay.py:

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.core.window import Window
from kivy.properties import StringProperty

class IListItem(Widget):
    sid = StringProperty('')
    image = StringProperty('')
    label = StringProperty('')
    pass

class IList(Widget):
    pass

class pplayHome(BoxLayout):

    def init_player(self):
        global swid

        self.Ilayout = IList()

        for idx in range (1, 7):
            swid = IListItem(
                    sid = "s" + str(idx),
                    image = 'empty_image.png',
                    label = 'Image' + str(idx)
            )
            self.Ilayout.add_widget(swid)

class pplayApp(App):
    def build(self):
        Window.clearcolor = (1,1,1,1)
        Window.borderless = True
        Window.size = 275, 1080
        homeWin = pplayHome()
        homeWin.init_player()
        return homeWin

if __name__ == "__main__":
    pplayApp().run()

and the Kivy file pplay.kv

Answers


zeeMonkeez February 2016

You were actually pretty close. Here is the slightly changed kv file, with added colored rectangles for illustration of sizes:

# File: pplay.kv

<IListItem@Widget>
    source: ''
    label: ''
    size_hint_y: None
    height: "120dp"
    canvas.before:
        Color:
            rgb: 0.55,0.77*self.idx/7,0.25     # groen
        Rectangle:
            pos: self.pos
            size: self.size
    BoxLayout:
        orientation: "vertical"
        size: root.size
        pos: root.pos

        Label:
            size_hint: None, 1
            text: root.label
            canvas.before:
                Color:
                    rgb: 0.77*root.idx/7,0.55,0.25     # groen
                Rectangle:
                    pos: self.pos
                    size: self.size
        Image:
            size_hint: None, 1
            source: root.source

<pplayHome>:
    orientation: "vertical"
    ActionBar:
        font_size: 8
        size: (275,25)
        # background color in Kivy acts as a tint and not just a solid color.
        # set a pure white background image first.
        background_image: 'white-bg.png'
        background_color: 0,.19,.34,1
        ActionView:
            ActionPrevious:
                with_previous: False
                app_icon: 'trButton.png'
            ActionOverflow:
            ActionButton:
                icon: 'butt_exit.png'
                on_press: root.exit_player()

    IList:
        id: ilist
        orientation: 'vertical'
    BoxLayout:
        height: "10dp"
        size_hint_y: None
        pos_x: 0
        canvas.before:
            Color:
                rgb: 0.55,0.77,0.25     # groen
            Rectangle:
                pos: self.pos
                size: self.size

In pplay.py, the essential part is to retrieve the IList widget using self.ids['ilist']. It also shows how its children (the IListItems) can b

Post Status

Asked in February 2016
Viewed 2,979 times
Voted 7
Answered 1 times

Search




Leave an answer