如何使用 kivymd bottomnavigation 将屏幕更改为屏幕

how to change screen to a screen with kivymd bottomnavigation

我将 KivyMD BottomNavigation 添加到我的应用程序,我可以使用图标切换屏幕,但问题是切换回包含 BottomNavigation 的屏幕 (假设我们在任何包含工具栏和底部导航的屏幕中,我们使用工具栏切换到一个完全不同的屏幕,我无法返回到上一个屏幕,甚至无法导航到任何包含底部导航和工具栏的屏幕,它 returns 一个空白的白色屏幕)。

尽管命名了屏幕,但我的问题是; 1. 我是否错误地引用(命名)了 BottomNavigationItem,如果是,请问我应该更改什么。 (2) 有什么遗漏的,请告诉我。

谢谢。

这是我的 main.py 文件

from kivymd.app import MDApp
from kivy.uix.screenmanager import Screen, ScreenManager, NoTransition
from kivy.core.window import Window


Window.size = (300, 530)


class MainScreen(Screen):
    pass


class IntroScreen(Screen):
    pass


class WaysScreen(Screen):
    pass


class To_DoScreen(Screen):
    pass


class SuccessScreen(Screen):
    pass


class GoalsScreen(Screen):
    pass


class BellaBaron(Screen):
    pass


class SearchScreen(Screen):
    pass


class MenuScreen(Screen):
    pass


class CalendarScreen(Screen):
    pass


class ExtraScreen(Screen):
    pass


class ArchiveScreen(Screen):
    pass


class Contact_InfoScreen(Screen):
    pass


class TenThousandApp(MDApp):
    def build(self):
        self.theme_cls.primary_palette = 'Green'
        self.theme_cls.primary_hue = '200'
        # self.theme_cls.theme_style = 'Light'
        self.sm = ScreenManager(transition=NoTransition())
        self.sm.add_widget(MainScreen(name="main_screen"))
        self.sm.add_widget(IntroScreen(name="intro_screen"))
        self.sm.add_widget(WaysScreen(name="ways_screen"))
        self.sm.add_widget(To_DoScreen(name="to_do_screen"))
        self.sm.add_widget(SuccessScreen(name="success_screen"))
        self.sm.add_widget(GoalsScreen(name="goals_screen"))
        self.sm.add_widget(BellaBaron(name="bella_baron"))
        self.sm.add_widget(SearchScreen(name="search_screen"))
        self.sm.add_widget(MenuScreen(name="menu_screen"))
        self.sm.add_widget(CalendarScreen(name="calendar_screen"))
        self.sm.add_widget(ExtraScreen(name="extra_screen"))
        self.sm.add_widget(ArchiveScreen(name="archive_screen"))
        self.sm.add_widget(Contact_InfoScreen(name="contact_info_screen"))

        return self.sm

    def change_screen(self, screen):
        self.sm.current = screen


TenThousandApp().run()

这是我的 .kv 文件

# ScreenManager:

#start of imagelist
<MyTile@SmartTileWithLabel>
    size_hint_y: None
    height: "240dp"

<MainScreen>:

    MDBottomNavigation:
        # panel_color: .2, .2, .2, 1

        MDBottomNavigationItem:
            name: "intro_screen"
            text: 'home'
            icon: 'home'

            MDBoxLayout:
                orientation: 'vertical'
                # md_bg_color: app.theme_cls.bg_dark

                MDToolbar:
                    id: intro_screen_toolbar
                    title: '[font=Gabriola][size=40][color=#FD0101]First[/color][/size][size=28]project[/size][/font]'
                    right_action_items: [["calendar-month", lambda x: app.change_screen('to_do_screen')]] #links to to-do listss screen
                    elevation: "8dp"

                MDCard:
                    orientation: 'vertical'
                    padding: 16
                    size_hint: None, None
                    size: "280dp", "360dp"
                    pos_hint: {"center_x": .5, "center_y": .6}
                    height: root.height - intro_screen_toolbar.height - dp(55)
                    y: root.height - intro_screen_toolbar.height - dp(50)
                    elevation: "8dp"
                    orientation: 'vertical'
                    radius: 15

                    ScrollView:
                        MDLabel:
                            markup: True
                            size_hint_y: None
                            size: self.texture_size
                            text:
                                """[b][i]“Your time is limited, so don’t waste it living someone else’s life. Don’t be trapped by dogma – which is living with the results of other people’s thinking. Don’t let the noise of other’s opinions drown out your own inner voice. And most important, have the courage to follow your heart and intuition. They somehow already know what you truly want to become. Everything else is secondary.”[/i][/b]
                                – Steve Jobs"""

        MDBottomNavigationItem:
            name: "success_screen"
            text: 'home'
            icon: 'account-group'

            BoxLayout:
                orientation: 'vertical'

                MDToolbar:
                    id: success_screen_toolbar
                    title: "Success Stories"
                    right_action_items: [["progress-clock", lambda x: app.change_screen('goals_screen')]] #links to goals and how screen
                    elevation: "8dp"

                ScrollView:
                    MDGridLayout:
                        cols: 1
                        adaptive_height: True
                        padding: dp(4), dp(4)
                        spacing: dp(4)

                        MyTile:
                            source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
                            text: "[size=26]Cat 1[/size]\n[size=14]cat-1.jpg[/size]"

                            on_release:
                                app.root.current = 'bella_baron'

                        MyTile:
                            source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
                            text: "[size=26]Cat 2[/size]\n[size=14]cat-2.jpg[/size]"
                            tile_text_color: app.theme_cls.accent_color

                        MyTile:
                            source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
                            text: "[size=26][color=#ffffff]Cat 3[/color][/size]\n[size=14]cat-3.jpg[/size]"
                            tile_text_color: app.theme_cls.accent_color


        MDBottomNavigationItem:
            name: "search_screen"
            text: 'search'
            icon: 'magnify'

            FloatLayout:
                MDTextField:
                    mode: 'fill'
                    hint_text: "Search"
                    pos_hint: {"center_x": .5,"center_y": .9}
                    size_hint_x: None
                    width: 280

        MDBottomNavigationItem:
            name: "menu_screen"
            text: 'menu'
            icon: 'menu'

            BoxLayout:
                orientation: "vertical"
                md_bg_color: (240/255, 240/255, 240/255, 1)

                MDToolbar:
                    id: menu_screen_toolbar
                    title: "Tools"
                    elevation: "8dp"

                MDCard:
                    orientation: 'vertical'
                    padding: 16
                    size_hint: None, None
                    size: "280dp", "360dp"
                    pos_hint: {"center_x": .5, "center_y": .6}
                    height: root.height - menu_screen_toolbar.height - dp(55)
                    y: root.height - menu_screen_toolbar.height - dp(50)
                    elevation: 8
                    orientation: 'vertical'
                    radius: 15

                    ScrollView:
                        MDList:
                            OneLineIconListItem:
                                text: "Calendar"
                                on_release:
                                    app.root.current = "calendar_screen"
                                IconLeftWidget:
                                    icon: "calendar-month"
                            OneLineIconListItem:
                                text: "Extra"
                                on_release:
                                    app.root.current = "extra_screen" 
                                IconLeftWidget:
                                    icon: "notebook-multiple"
                            OneLineIconListItem:
                                text: "Archive"
                                on_release:
                                    app.root.current = "archive_screen"
                                IconLeftWidget:
                                    icon: "archive"
                            OneLineIconListItem:
                                text: "contact Us"
                                on_release:
                                    app.root.current = "contact_info_screen"
                                IconLeftWidget:
                                    icon: "email-mark-as-unread"



<WaysScreen>
    name: "ways_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: ways_screen_toolbar
            title: "How-tos"
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('intro_screen')]] # to add more list
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('intro_screen')]]
            elevation: "8dp"

        ScrollView:

            MDGridLayout:
                cols: 1
                adaptive_height: True
                spacing: 10
                padding: 10

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    Image:
                        source: "C:/Users/HP USER/Downloads/bella_baron.jpg"

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello dear'

                    ScrollView:
                        MDLabel:
                            size_hint_y: None
                            size: self.texture_size
                            # halign: 'center'
                            text:
                                """This screens contains a MDcard which where the image is placed, and a MDLabel and neccessary widgets used to tell the success story, under the MDCard."""
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello boss'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello goodness'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello hi'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello yes?'

<To_DoScreen>
    name: "to_do_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: to_do_screen_toolbar
            title: 'To-Do-List'
            right_action_items: [['plus', lambda x: x]] # to add more list
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('intro_screen')]]
            elevation: "8dp"

        MDCard:
            orientation: 'vertical'
            padding: 16
            elevation: 8
            radius: 15
            size_hint: None, None
            size: '280', '360'
            pos_hint: {"center_x": .5, "center_y": .6}
            height: root.height - to_do_screen_toolbar.height + dp(10)
            y: root.height - to_do_screen_toolbar.height - dp(20)


<GoalsScreen>
    name: 'goals_screen'

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: goals_screen_toolbar
            title: 'Goals'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('success_screen')]]
            elevation: "8dp"

        MDCard:
            orientation: 'vertical'
            padding: 16
            size_hint: None, None
            size: "280dp", "360dp"
            pos_hint: {"center_x": .5, "center_y": .6}
            height: root.height - goals_screen_toolbar.height + dp(10)
            y: root.height - goals_screen_toolbar.height - dp(20)
            elevation: "8dp"
            orientation: 'vertical'
            radius: 15

<BellaBaron>
    name: 'bella_baron'

    BoxLayout:
        orientation: 'vertical'
        md_bg_color: (240/255, 240/255, 240/255, 1)

        MDToolbar:
            id: bella_baron_toolbar
            title: "Bella Baron"
            left_action_items: [["keyboard-backspace", lambda x: app.change_screen('success_screen')]]
            right_action_items: [["progress-check", lambda x: app.change_screen('goals_screen')]] #link to progress screen
            elevation: "8dp"

        ScrollView:

            MDGridLayout:
                cols: 1
                adaptive_height: True
                spacing: 10
                padding: 10

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    Image:
                        source: "C:/Users/HP USER/Downloads/bella_baron.jpg"

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello dear'

                    ScrollView:
                        MDLabel:
                            size_hint_y: None
                            size: self.texture_size
                            # halign: 'center'
                            text:
                                """This screens contains a MDcard which where the image is placed, and a MDLabel and neccessary widgets used to tell the success story, under the MDCard."""
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello boss'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello goodness'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello hi'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello yes?'


<CalendarScreen>
    name: "calendar_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: calendar_screen_toolbar
            title: 'Calendar'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('menu_screen')]]
            right_action_items: [['calendar', lambda x: x]] # on press returns today's date
            elevation: "8dp"

        MDCard:
            orientation: 'vertical'
            padding: 16
            elevation: 8
            radius: 15
            size_hint: None, None
            size: '280', '360'
            pos_hint: {"center_x": .5, "center_y": .6}
            height: root.height - calendar_screen_toolbar.height + dp(10)
            y: root.height - calendar_screen_toolbar.height - dp(20)

# I will remove this screen if there is no need for it.
<ExtraScreen>
    name: "extra_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: extra_screen_toolbar
            title: 'Extra'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('menu_screen')]]
            elevation: "8dp"

        ScrollView:

            MDGridLayout:
                cols: 1
                adaptive_height: True
                spacing: 10
                padding: 10

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    Image:
                        source: "C:/Users/HP USER/Downloads/bella_baron.jpg"

                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello dear'

                    ScrollView:
                        MDLabel:
                            size_hint_y: None
                            size: self.texture_size
                            # halign: 'center'
                            text:
                                """This screens contains a MDcard which where the image is placed, and a MDLabel and neccessary widgets used to tell the success story, under the MDCard."""
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello boss'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello goodness'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello hi'
                MDCard:
                    size_hint: None, None
                    size: "280dp", "130dp"
                    radius: 15
                    caption: 'Hello yes?'

<ArchiveScreen>
    name: "archive_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: archive_screen_toolbar
            title: 'Archive'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('menu_screen')]]
            elevation: "8dp"

        MDCard:
            orientation: 'vertical'
            padding: 16
            elevation: 8
            radius: 15
            size_hint: None, None
            size: '280', '360'
            pos_hint: {"center_x": .5, "center_y": .6}
            height: root.height - archive_screen_toolbar.height + dp(10)
            y: root.height - archive_screen_toolbar.height - dp(20)

<Contact_InfoScreen>
    name: "contact_info_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: contact_info_screen_toolbar
            title: 'Contact Info'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen('menu_screen')]]
            elevation: "8dp"

        MDCard:
            orientation: 'vertical'
            padding: 16
            elevation: 8
            radius: 15
            size_hint: None, None
            size: '280', '360'
            pos_hint: {"center_x": .5, "center_y": .6}
            height: root.height - contact_info_screen_toolbar.height + dp(10)
            y: root.height - contact_info_screen_toolbar.height - dp(20)

            ScrollView:
                MDLabel:
                    size_hint_y: None
                    size: self.texture_size
                    text:
                        """feel free to reach us @"""

要在 MDBottomNavigation 中更改为不同的 MDBottomNavigationItem,您应该使用 MDBottomNavigationswitch_tab() 方法。您可以将方法添加到 TenThousandApp class:

def change_screen_item(self, nav_item):
    # change to the MainScreen and switch to the spcified MDBottomNavigationItem
    s = self.sm.get_screen('main_screen')
    s.ids.bottom_nav.switch_tab(nav_item)
    self.sm.current = 'main_screen'

在您的 kv 中,您必须为 MDBottomNavigation 添加一个 id:

<MainScreen>:

    MDBottomNavigation:
        id: bottom_nav
        # panel_color: .2, .2, .2, 1

id 用于访问 MDBottomNavigation 实例。

然后在kv中,可以用change_screen_item()切换到MainScreen,切换到指定的MDBottomNavigationItem,像这样:

<CalendarScreen>
    name: "calendar_screen"

    BoxLayout:
        orientation: 'vertical'

        MDToolbar:
            id: calendar_screen_toolbar
            title: 'Calendar'
            left_action_items: [['keyboard-backspace', lambda x: app.change_screen_item('intro_screen')]]
            right_action_items: [['calendar', lambda x: x]] # on press returns today's date
            elevation: "8dp"

上面的代码会切换到MainScreenintro_screen项。