Python Kivy遍历小部件树

Question

I'm building a small project for school and I require an interface so I thought I would use Kivy and Python for it but I'm stuck in a part with the UI , mainly how can I access widgets across the tree. I have searched around but the kivy docs are not very helpful and what questions and answer I found don't seem to be related.

What I want to do is to have a top bar with some buttons and below a screen manager that has separate predefined screens but I'm not sure how could I traverse the tree to get to do what I need.

So for example the first button would always bring up the screen called Dashboard. I have tried something I found, but I'm getting "Name Dashboard not defined"

    #!/usr/bin/env python 
    from kivy.app import App 
    from kivy.uix.widget import Widget 
    from kivy.uix.boxlayout import BoxLayout
    from kivy.uix.floatlayout import FloatLayout
    from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
    from kivy.properties import ObjectProperty


    class Container(FloatLayout):
        pass

    class UpperMenu(BoxLayout):
        def change_screen(self,argument):
            self.ids.screens.ids.manager.current = argument


    class Screens(ScreenManager):
        pass

    class Dashboard(Screen):
        pass

    class Player(Screen):
        pass

    class Weather(Screen):
        pass

    class Map(Screen):
        pass

    class Carousel(BoxLayout):
        pass

    class CarlApp(App):
        def build(self):
            return Container()

    if __name__ == '__main__':   
        CarlApp().run()

And here is my KV file:

    #:kivy 1.10.0

    <Container>:
        id: container
        UpperMenu:
            id: uppermenu
            pos: root.x, root.top - self.height
        Screens:
            id: screens

    <UpperMenu>:
        size_hint: 1,.15
        Button:
            text: ""
            id: ButtonCeasuri
            on_release: root.change_screen(dashboard)
            Image:
                source: 'dashboard.png'
                allow_stretch: False
                center_x: self.parent.center_x
                center_y: self.parent.center_y
        Button:
            text: ""
            id: ButtonCeasurii
            Image:
                source: 'play-button.png'
                allow_stretch: False
                center_x: self.parent.center_x
                center_y: self.parent.center_y
        Button:
            text: ""
            id: ButtonCeasuriii
            Image:
                source: 'distance.png'
                allow_stretch: False
                center_x: self.parent.center_x
                center_y: self.parent.center_y
        Button:
            text: ""
            id: ButtonCeasuriiii
            Image:
                source: 'temperature.png'
                allow_stretch: False
                center_x: self.parent.center_x
                center_y: self.parent.center_y

    <Screens>:
        size_hint: 1,.85
        Dashboard:
            name: 'Dashboard'
            label: "Dashboard Screen"
            id: dashboard
            Button:
                text: "Stuff"
                on_release: pass
        Player:
            name: 'Player'
            label: "Player Screen"
            id: Player
            Button:
                text: "Stuff2"
        Weather:
            name: 'Weather'
            label: "Weather Screen"
        Map:
            name: 'Map'
            label: "Map Screen"

I've been trying to understand how can I do this in the last 3-4 days, but I fail to understand.

Answer 1

from your codes, it seems you are already on the dashboard screen, anyway to change your screen to another screen, this is a sample code to help you do that

<UpperMenu>:
size_hint: 1,.15
Button:
    text: ""
    id: ButtonCeasuri
    on_release: root.change_screen("Dashboard")

the name dashboard is undefined because the kv file cant make a reference to it,, and then in your code you can also do this instead,,

class UpperMenu(BoxLayout):
    def change_screen(self,argument):
        self.parent.children[0].current = argument

you can call print(self.parent.children) to see what it prints out, i hope this helps

Answer 2

To change the screen, there are two ways to do it. The first method is all done in kv file. The second method is done in Python file. In the example demonstrates both methods.

Method 1 - kv file

You could put the code for changing screen in the kv file by replacing:

root.change_screen(dashboard)

with

app.root.ids.screen.current = 'Dashboard'    # 'Dashboard' name of screen

Method 2 - Python & kv files

1. In kv file, pass the name of the screen to change_screen() function eg root.change_screen('Dashboard') .
2. In Python file, replace self.ids.screens.ids.manager.current with self.parent.ids.screen.current in change_screen() method.

Note

AttributeError

     self.ids.screens.ids.manager.current = argument
 AttributeError: 'super' object has no attribute '__getattr__'

Explanation

self - The keyword self references the “current widget instance” ie class UpperMenu()

ids - The keyword ids references the lookup object and it is a dictionary type property. In this case, all the Button widgets tagged with id's under the class rule <UpperMenu>: in the kv file.

screens - The keyword screens reference the id's for screens but it does not exist under self.ids . Due to this, Kivy threw AttributeError. Add print(self.ids) to display all the ids found in self.ids .

Example

test.kv

#:kivy 1.10.0

<Container>:
    id: container
    UpperMenu:
        id: uppermenu
        pos: root.x, root.top - self.height
    Screens:
        id: screens

<UpperMenu>:
    size_hint: 1,.15
    Button:
        text: ""
        id: ButtonCeasuri
        on_release:
            root.change_screen('Dashboard')    # Method 2

        Image:
            source: 'dashboard.png'
            allow_stretch: False
            center_x: self.parent.center_x
            center_y: self.parent.center_y
    Button:
        text: ""
        id: ButtonCeasurii
        on_release:
            app.root.ids.screens.current = 'Player'    # Method 1

        Image:
            source: 'play-button.png'
            allow_stretch: False
            center_x: self.parent.center_x
            center_y: self.parent.center_y
    Button:
        text: ""
        id: ButtonCeasuriii
        Image:
            source: 'distance.png'
            allow_stretch: False
            center_x: self.parent.center_x
            center_y: self.parent.center_y
    Button:
        text: ""
        id: ButtonCeasuriiii
        Image:
            source: 'temperature.png'
            allow_stretch: False
            center_x: self.parent.center_x
            center_y: self.parent.center_y

<Screens>:
    size_hint: 1,.85
    Dashboard:
        id: dashboard
        name: 'Dashboard'
        label: "Dashboard Screen"
        Button:
            text: "Stuff"
            on_release: pass
    Player:
        name: 'Player'
        label: "Player Screen"
        id: Player
        Button:
            text: "Stuff2"
    Weather:
        name: 'Weather'
        label: "Weather Screen"
    Map:
        name: 'Map'
        label: "Map Screen"

main.py

#!/usr/bin/env python
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.properties import ObjectProperty


class Container(FloatLayout):
    pass


class UpperMenu(BoxLayout):
    def change_screen(self, argument):
        self.parent.ids.screens.current = argument


class Screens(ScreenManager):
    pass


class Dashboard(Screen):
    pass


class Player(Screen):
    pass


class Weather(Screen):
    pass


class Map(Screen):
    pass


class Carousel(BoxLayout):
    pass


class TestApp(App):
    def build(self):
        return Container()


if __name__ == '__main__':
    TestApp().run()

Output

Clicked Second Button

Clicked First Button