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

Kivy切换Screen时如何实现TabbedPanel全局常驻显示?

Kivy ScreenManager切换页面时TabbedPanel常驻实现方案

完全可以实现常驻效果。
核心问题原因:ScreenManager 同一时间仅会渲染当前激活状态的单个Screen,如果直接将ScreenManager作为App根组件返回,或是把TabbedPanel放在某一个Screen内部,切换页面时TabbedPanel会随非激活状态的Screen一起被隐藏,自然无法常驻。

正确实现逻辑:

  • 用垂直排布的BoxLayout作为最外层根容器,替代直接返回ScreenManager的写法
  • 将需要常驻的TabbedPanel组件添加到外层容器的固定位置(顶部/底部均可)
  • 将ScreenManager作为内容区添加到外层容器的剩余空间,所有Screen切换仅在ScreenManager内部生效,不会影响外层常驻的TabbedPanel

修改后的Python代码

from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen 
from kivy.uix.tabbedpanel import TabbedPanel
from kivy.uix.boxlayout import BoxLayout

class TabbedTest(TabbedPanel):
    pass
class MainScreen(Screen):
    pass
class Firstscreen(Screen):
    pass
class Secondscreen(Screen):
    pass

class RootWidget(BoxLayout):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.orientation = 'vertical'
        # 先加载常驻Tab栏
        self.add_widget(TabbedTest())
        # 加载页面管理容器
        sm = ScreenManager()
        sm.add_widget(MainScreen(name='main'))
        sm.add_widget(Firstscreen(name='first'))
        sm.add_widget(Secondscreen(name='second'))
        self.add_widget(sm)

class myapp(App):
    def build(self):
        return RootWidget()

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

修改后的kv配置代码

<TabbedTest>:
    do_default_tab: False
    tab_height: 40
    # 如需将Tab放在底部,取消下一行注释即可
    # tab_pos: 'bottom_mid'
    TabbedPanelItem:
        text:"test"
        BoxLayout:
            Label:
                text: "常驻Tab通用内容"

<MainScreen>:
    BoxLayout:
        Button:
            text: 'first'
            on_press: root.manager.current = 'first'
        Button:
            text: 'second'
            on_press: root.manager.current = 'second'

<Firstscreen>:
    BoxLayout:
        Label:
            text:"first"
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

<Secondscreen>:
    BoxLayout:
        Label:
            text:'second'
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

扩展说明

如果需要实现Tab点击和Screen切换联动,直接给对应TabbedPanelItem添加on_press事件,绑定ScreenManager的current属性即可,逻辑和页面内按钮跳转完全一致。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.09.01 01:06:26