KivyMD新手实现登录界面跳转新页面的屏幕切换功能求助

核心逻辑 #

KivyMD的页面切换依赖ScreenManager组件实现：

• 所有页面对应独立的Screen实例，每个Screen需设置唯一的name属性作为切换标识
• 把所有Screen添加到ScreenManager容器中，作为应用的根组件
• 给按钮绑定点击回调，修改ScreenManager.current为目标页面的name即可完成跳转

完整修改代码 #

主程序代码 #

from kivymd.app import MDApp
from kivy.lang.builder import Builder
from helpers import username_helper,password_helper
from kivy.uix.screenmanager import Screen, ScreenManager
from kivymd.uix.button import MDRectangleFlatButton
from kivymd.uix.label import MDLabel

# 登录页
class LoginScreen(Screen):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.name = "login"
        self.theme_cls.primary_palette= "Pink"
        self.username= Builder.load_string(username_helper)
        self.add_widget(self.username)
        self.password = Builder.load_string(password_helper)
        self.add_widget(self.password)
        # 登录按钮绑定跳转逻辑
        login = MDRectangleFlatButton(text="Log In", pos_hint={"center_x": 0.5, "center_y":0.4}, on_press=self.go_to_home)
        self.add_widget(login)
        # 注册按钮绑定跳转逻辑
        signin = MDRectangleFlatButton(text="Sign Up", pos_hint={"center_x": 0.5, "center_y": 0.3}, on_press=self.go_to_signup)
        self.add_widget(signin)

    # 跳转到登录后首页
    def go_to_home(self, instance):
        # 简单做个非空校验，可根据需求调整
        if self.username.text.strip() and self.password.text.strip():
            self.manager.current = "home"

    # 跳转到注册页
    def go_to_signup(self, instance):
        self.manager.current = "signup"

# 登录后首页
class HomeScreen(Screen):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.name = "home"
        welcome_label = MDLabel(text="登录成功！欢迎回来", pos_hint={"center_x":0.5, "center_y":0.5}, halign="center")
        self.add_widget(welcome_label)
        # 加个返回登录页的按钮
        back_btn = MDRectangleFlatButton(text="返回登录", pos_hint={"center_x":0.5, "center_y":0.4}, on_press=self.go_back)
        self.add_widget(back_btn)

    def go_back(self, instance):
        self.manager.current = "login"

# 注册页示例，可根据需求扩展内容
class SignupScreen(Screen):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.name = "signup"
        tip_label = MDLabel(text="这是注册页面", pos_hint={"center_x":0.5, "center_y":0.5}, halign="center")
        self.add_widget(tip_label)
        back_btn = MDRectangleFlatButton(text="返回登录", pos_hint={"center_x":0.5, "center_y":0.4}, on_press=self.go_back)
        self.add_widget(back_btn)

    def go_back(self, instance):
        self.manager.current = "login"

class Demo_app(MDApp):
    def build(self):
        # 初始化屏幕管理器
        sm = ScreenManager()
        # 添加所有页面
        sm.add_widget(LoginScreen())
        sm.add_widget(HomeScreen())
        sm.add_widget(SignupScreen())
        return sm

Demo_app().run()

helpers.py配置代码（原有逻辑无需修改） #

username_helper="""
MDTextField:
    hint_text: "Create/Enter your Username"
    helper_text:"Or click here if you forgot your Username"
    helper_text_mode: "on_focus"
    icon_right: "language-python"
    icon_right_color: app.theme_cls.primary_color
    pos_hint:{"center_x":0.5,"center_y":0.6}
    size_hint_x:None 
    width:300
"""

password_helper="""
MDTextField:
    hint_text: "Create/Enter your Password"
    helper_text:"Or click here if you forgot your password "
    helper_text_mode: "on_focus"
    icon_right: "language-python"
    icon_right_color: app.theme_cls.primary_color
    pos_hint:{"center_x":0.5,"center_y":0.5}
    size_hint_x:None 
    width:300
"""

扩展说明 #

如果需要修改页面切换动画，可以在修改current属性前设置ScreenManager.transition，比如添加滑动动画：

from kivy.uix.screenmanager import SlideTransition
# 在跳转前设置动画
self.manager.transition = SlideTransition(direction="left")
self.manager.current = "home"

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