KivyMD：导航抽屉点击选项如何实现跳转打开新屏幕

实现步骤 #

基于现有代码做3处核心调整即可实现导航跳转：

• 给布局内的ScreenManager设置全局可访问的id，作为所有屏幕的统一切换容器
• 为导航抽屉内的每个菜单项绑定点击事件，触发时自动收起导航栏、执行屏幕切换逻辑
• 在ScreenManager下注册所有需要跳转的目标屏幕，每个屏幕配置唯一的name标识

调整后的KV布局字符串 #

toolbar = '''
Screen:
    NavigationLayout:
        # 给ScreenManager设置全局id，支持跨组件调用
        ScreenManager:
            id: screen_manager
            # 原主页Screen 配置唯一name标识
            Screen:  
                name: "home"
                BoxLayout:
                    orientation: 'vertical'
                    
                    MDToolbar:
                        title: 'EMC_Webma'
                        left_action_items: [['menu', lambda x: navigation.set_state('open')]]
                        right_action_items: [['card-search', lambda x: print('pass')]]
                        elevation: 10
                            
                    # 主页内容优化：合并原本分散的MDList分组，同组列表项统一放在同一个MDList下
                    MDList:
                        TwoLineListItem:
                            text: 'Friend 1'
                            secondary_text: '[Recent text here]'
                        TwoLineListItem:
                            text: 'Friend 2'
                            secondary_text: '[Recent text here]'
                        TwoLineListItem:
                            text: 'Friend 3'
                            secondary_text: '[Recent text here]'
                        TwoLineListItem:
                            text: 'Friend 4'
                            secondary_text: '[Recent text here]'
                        TwoLineListItem:
                            text: 'Friend 5'
                            secondary_text: '[Recent text here]'
                        TwoLineListItem:
                            text: 'Friend 6'
                            secondary_text: '[Recent text here]'
                    
                    Widget:

            # 新增New Room对应的目标屏幕，配置唯一name标识
            Screen:
                name: "new_room"
                BoxLayout:
                    orientation: 'vertical'
                    MDToolbar:
                        title: "新建房间"
                        left_action_items: [['arrow-left', lambda x: screen_manager.current = "home"]]
                    # 此处放置New Room页面的自定义内容
                    MDLabel:
                        text: "这是New Room功能页面"
                        halign: "center"

        MDNavigationDrawer:
            id: navigation
            
            BoxLayout:
                orientation: 'vertical'
                spacing: '8dp'
                padding: '8dp'
                            
                Image:
                    source: 'einstein.jpg'
                    
                MDLabel:
                    text: 'Enwerem Melvin Confidence'
                    font_style: 'Subtitle2'
                    size_hint_y: None
                    height: self.texture_size[1]
                    
                MDLabel:
                    text: 'enweremmelvinconfidence@gmail.com'
                    font_style: 'Caption'
                    size_hint_y: None
                    height: self.texture_size[1]
                                    
                ScrollView:
                    MDList:
                        # 每个导航项绑定点击事件
                        OneLineIconListItem:
                            text: 'New Room'
                            on_release: app.navigate_to_screen("new_room", navigation)
                            IconLeftWidget:
                                icon: 'theater'
                                
                        OneLineIconListItem:
                            text: 'Contacts'
                            on_release: app.navigate_to_screen("contacts", navigation)
                            IconLeftWidget:
                                icon: 'contacts'
                        # 剩余导航项按照上述格式补全屏幕定义和事件绑定即可
'''

调整后的主程序代码 #

移除原build方法里多余的外层Screen嵌套，封装统一的导航切换方法：

from kivymd.app import MDApp
from kivy.lang import Builder
from home_page_strings import toolbar


class EMC_WebmaApp(MDApp):
    def build(self):
        # 主题配置
        self.theme_cls.primary_palette = 'DeepPurple'
        self.theme_cls.theme_style = 'Dark'
        # 直接返回KV定义的根节点，去掉原本无意义的外层Screen嵌套
        return Builder.load_string(toolbar)
    
    # 统一处理屏幕跳转逻辑
    def navigate_to_screen(self, target_screen_name, navigation_drawer):
        # 自动收起导航抽屉
        navigation_drawer.set_state("close")
        # 切换到目标屏幕
        self.root.ids.screen_manager.current = target_screen_name

注意事项 #

• 所有注册在ScreenManager下的屏幕，name属性值必须和跳转方法传入的目标名称完全一致，否则会触发找不到屏幕的报错
• 其余导航功能项（Contacts、Calls、Settings等）按照New Room的实现逻辑，新增对应name的Screen、绑定点击事件即可，不需要额外修改核心跳转逻辑
• 原代码中每个列表项单独包裹一层MDList的写法不符合组件规范，MDList是列表分组容器，同组列表项可直接嵌套在同一个MDList下，组件会自动为列表项添加分隔线

内容的提问来源于stack exchange，提问作者Enwerem Melvin