You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Kivy技术问题:实现全局NavigationBar显示并解决侧边菜单重复重叠问题

解决方案:全局导航栏与重复侧边抽屉问题修复

我来帮你搞定这个问题!你的核心问题出在每个Screen内部都单独定义了MDNavigationLayout,这不仅导致侧边抽屉重复渲染,还让导航栏无法在所有屏幕上全局保留。下面是重构后的完整代码,完美解决这两个问题:

修改后的Python代码

import kivy
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.properties import ObjectProperty
from kivy.properties import StringProperty
from kivy.uix.label import Label
from kivy.uix.gridlayout import GridLayout
from kivy.uix.scrollview import ScrollView
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.clock import Clock
from kivy.uix.button import Button
from kivy.core.window import Window
from kivymd.app import MDApp
from kivymd.uix.card import MDCard
from kivymd.uix.label import MDLabel

class FirstWindow(Screen):
    pass

class ThirdWindow(Screen):
    def on_pre_enter(self):
        # 先清空之前的内容,避免重复添加组件
        self.anchorID.clear_widgets()
        anchor = AnchorLayout(size=(1,1))
        test = "This is the new window"
        card = MDCard(orientation='vertical',padding="8dp",size_hint=(1,0.5),pos_hint={'top': 0.1,'right':1},radius=[5, ])
        card.add_widget(MDLabel(text=test, halign="center"))
        anchor.add_widget(card)
        self.anchorID.add_widget(anchor)

class WindowManager(ScreenManager):
    pass

class NearMeApp(MDApp):
    def build(self):
        self.theme_cls.theme_style ="Dark"
        self.theme_cls.accent_palette = "Red"
        self.theme_cls.primary_palette = "Purple"
        self.root = Builder.load_file('NearMe.kv')

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

修改后的KV文件

#:import hex kivy.utils.get_color_from_hex
#:kivy 1.10.1

MDNavigationLayout:
    Screen:
        BoxLayout:
            orientation: 'vertical'
            # 全局导航栏:所有屏幕共享这一个Toolbar
            MDToolbar:
                title: "NearMe Application"
                elevation: 10
                left_action_items: [['menu', lambda x: nav_drawer.set_state("open")]]
            # 全局屏幕管理器:所有页面都在这里切换
            WindowManager:
                id: screen_manager
                FirstWindow:
                ThirdWindow:

    # 全局侧边抽屉:只定义一次,避免重复重叠
    MDNavigationDrawer:
        id: nav_drawer
        BoxLayout:
            orientation:'vertical'
            Button:
                text:"ThirdWindow"
                on_release: screen_manager.current = "ThirdWindow"

<FirstWindow>:
    name:"FirstWindow"
    # 仅保留当前页面的内容
    MDLabel:
        text: "这是第一个页面的内容"
        halign: "center"

<ThirdWindow>:
    name:"ThirdWindow"
    anchorID:anchorID
    AnchorLayout:
        id:anchorID
        canvas.before:
            Color:
                rgba: .2, .2, .2, 1
            Rectangle:
                pos: self.pos
                size: self.size

关键修改说明

  • 全局导航容器:把MDNavigationLayout移到KV最顶层作为应用根容器,让所有Screen共享同一个导航栏和侧边抽屉,彻底解决抽屉重复问题。
  • 页面内容分离:每个Screen现在只需要专注于自身的内容展示,不需要再嵌套导航组件,代码结构更简洁。
  • 避免重复渲染:在ThirdWindow的on_pre_enter方法中先清空容器内容,防止每次进入页面都重复添加卡片。
  • 统一切换逻辑:侧边抽屉按钮直接控制全局的screen_manager,页面切换逻辑更统一可靠。

内容的提问来源于stack exchange,提问作者primitiveProgrammer

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.30 17:38:15