CODEWITHSUNDEEP
pythonkivykivymd
Ian Rajkumar
Ian Rajkumar

Reputation: 149

Navigating Screens within Kivy

I am trying to navigate through my app, I can get the screens to change thru the navigation drawer, however when I am within one of the screens away from the navigation drawer, I don't know how to change to another screen.

The app below allows the user to click on the "Go to Element 1" button in the navigation drawer which will take them to "Element 1 Screen", this screen is away from the navigation drawer and it has a clickable MDCard.

When the user clicks on that MDCard, it should take them to "Element 2 Screen" but that's where I am stuck. I don't know how to get kivy to change the screen here. How can I get the MdCard in element 1 to switch the screen to element 2?

The app is arranged into 3 .py files:

The flow of the code below goes like this:
Main App --> Element 1 button --> Element 1 screen --> Element 2 screen

PS: The code below is only for training purposes, it represents the general layout of my actual app.

Main App Code:

from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout
from kivy.properties import ObjectProperty
from kivymd.app import MDApp
from element_1 import element_1_screen
from element_2 import element_2_screen


MainNavigation = '''
<ContentNavigationDrawer>:
    ScrollView:
        MDList:
            OneLineListItem:
                text: 'Go to Element 1'
                on_press:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "go_to_element_1_screen"

Screen:
    MDToolbar:
        id: toolbar
        pos_hint: {"top": 1}
        elevation: 10
        left_action_items: [["menu", lambda x: nav_drawer.set_state("open")]]
    MDNavigationLayout:
        x: toolbar.height

        ScreenManager:
            id: screen_manager
            Screen:
                name: "words_nav_item"
            element_1_screen:
                name: "go_to_element_1_screen"
            element_2_screen:
                name: "go_to_element_2_screen"


        MDNavigationDrawer:
            id: nav_drawer
            ContentNavigationDrawer:
                screen_manager: screen_manager
                nav_drawer: nav_drawer
'''


class ContentNavigationDrawer(BoxLayout):
    screen_manager = ObjectProperty()
    nav_drawer = ObjectProperty()


class mainApp(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Red"
        return Builder.load_string(MainNavigation)


mainApp().run()

Element 1 Screen:

from kivy.lang import Builder
from kivymd.uix.screen import Screen

element_1_contents = '''
MDScreen:
    MDCard:
        orientation: 'vertical'
        size_hint: None, None
        size: "360dp", "360dp"
        pos_hint: {"center_x": .5, "center_y": .5}
        ripple_behavior: True
        focus_behavior: True
        on_press: root.screen_manager.current = "go_to_element_2_screen"
        
        MDLabel:
            text: "Welcome to Element 1"
            halign: 'center'
           
        MDLabel:
            text: "Click here to go to element 2"
            halign: 'center'

'''

class element_1_screen(Screen):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.directory = Builder.load_string(element_1_contents)
        self.add_widget(self.directory)

Element 2 Screen:

# Element 2 has the same code as element 1 except that for these two lines

MDLabel:
    text: "Welcome to Element 2"

MDLabel:
    text: "Click here to go to element 3"

​

Upvotes: 0

Views: 324

Answers (1)

John Anderson
John Anderson

Reputation: 38822

One hack to get it working is to change:

root.screen_manager.current =

to:

root.parent.manager.current =

in the element_1.py and element_2.py files.

Upvotes: 0

Related Questions