Ewan
Ewan

Reputation: 109

Nav Bar doesn't cover screen when opened

enter image description hereenter image description hereI'm building a registration form screen in Kivy. I have some other basic screens as part of the nav bar. However, this is the first one I'm really adding some content to. I have some round text fields that I've just thrown on there to get an idea of spacing, but currently when I reopen the NAV the bar the text field buttons appear in front of it and I want it to be behind.


from kivy import Config
from kivy.app import App
from kivy.lang import Builder
from kivy.properties import StringProperty
from kivy.uix.image import Image
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivymd.app import MDApp
from kivy.uix.boxlayout import BoxLayout
from kivymd.theming import ThemableBehavior
from kivymd.uix.navigationdrawer import MDNavigationLayout, MDNavigationDrawer
from kivymd.uix.list import MDList, OneLineAvatarListItem, ILeftBody
from kivy.properties import ObjectProperty
from kivy.uix.widget import Widget


Config.set('input', 'mouse', 'mouse,disable_multitouch')


class DrawerList(ThemableBehavior, MDList, Screen):
    pass


class NavLayout(MDNavigationLayout):
    pass


class Login(Screen):
    nav_drawer = ObjectProperty()


class Nav(Screen):
    Login = ObjectProperty()
    ScreenManager = ObjectProperty


class Homepage(Screen):
    Login = ObjectProperty()
    nav_drawer = ObjectProperty()


class AddNewCustomer(Screen):
    nav_drawer = ObjectProperty()


class AddNewStaff(Screen):
    pass


class ScreenManager(ScreenManager):
    Login = ObjectProperty()


class ContentNavigationDrawer(BoxLayout):
    pass


class MainApp(MDApp):
    def build(self):
        # Window.maximize()
        # self.theme_cls.theme_style = "Light"
        # self.theme_cls.primary_hue = "900"
        login = Builder.load_file("login.kv")
        return login


if __name__ == "__main__":
    MainApp().run()


ScreenManager:
    Login:
    Homepage:
    AddNewCustomer:
    Nav:
    DrawerList:

<Login>:
    name: "login"
    MDCard:
        size_hint: None, None
        size: 700, 800
        pos_hint: {"center_x": 0.5, "center_y": 0.5}
        elevation: 10
        padding: 25
        spacing: 25
        orientation: 'vertical'

        Image:
            source: 'images/asteria.png'
            size: 100, 200

        MDLabel:
            id: login
            font_size: 40
            halign: 'center'
            size_hint_y: None
            height: self.texture_size[1]
            padding_y: 15

        MDTextFieldRound:
            id: user
            hint_text: "username"
            icon_right: "account"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}

        MDTextFieldRound:
            id: password
            hint_text: "password"
            icon_right: "eye-off"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}
            password: True

        MDRoundFlatButton:
            text: "LOGIN"
            font_size: 12
            pos_hint: {"center_x": 0.5}

            on_release:
                root.manager.current = "homepage"
                root.manager.transition.direction = "left"

        MDRoundFlatButton:
            text: "CLEAR"
            font_size: 12
            pos_hint: {"center_x": 0.5}
            on_press: app.clear()


        Widget:
            size_hint_y: None
            height: 50


<Nav>:
    ScrollView:
        MDList:
            OneLineListItem:
                text: "Add New Customer"

                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewCustomer"
                    root.screen_manager.transition.direction = "right"





            OneLineListItem:
                text: "Add New Staff"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewStaff"

            OneLineListItem:
                text: "Case List"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "caseList"


            OneLineListItem:
                text: "Create Case"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.transition.direction = "left"
                    root.screen_manager.current = "Create Case"


            OneLineListItem:
                text: "Log Out"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")

                    root.manager.current = "login"
                    root.manager.transition.direction = "right"



<Homepage>:
    name: "homepage"
    Screen:
        BoxLayout:
            orientation: 'vertical'
            MDToolbar:
                title: 'Navigation'
                left_action_items: [['menu', lambda x: nav_drawer.set_state('toggle')]]
                right_action_items: [["images/asteria.png", lambda x: None]]


                elevation:5
            Widget:


        MDNavigationDrawer:
            id: nav_drawer
            Nav:
                screen_manager: screen_manager
                nav_drawer: nav_drawer
                manager: root.manager



        MDNavigationLayout:
            ScreenManager:
                id: screen_manager
                Screen:
                    name: "Homepage"
                    MDLabel:
                        text: "Welcome Home"
                        halign: "center"


                Screen:
                    name: "addNewCustomer"
                    MDLabel:
                        text: "Add New customer"
                        halign: "center"

                Screen:
                    name: "addNewStaff"
                    MDLabel:
                        text: "Add New Staff"
                        halign: "center"

                Screen:
                    name: "caseList"
                    MDLabel:
                        text: "Case List"
                        halign: "center"

                Screen:
                    name: "casePool"
                    MDLabel:
                        text: "Case Pool"
                        halign: "center"

                Screen:

                    name: "Create Case"
                    MDTextFieldRound:
                        id: user
                        hint_text: "Case Title"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.875, "center_x": 0.155}



                    MDTextFieldRound:
                        id: user2
                        hint_text: "e.g. Matthew Inwards School of Swag"
                        mode:"rectangle"
                        icon_right: "Customer"
                        size_hint_x: None
                        width: 275
                        font_size: 14
                        pos_hint: {"top": 0.779, "center_x": 0.155}

Upvotes: 1

Views: 49

Answers (1)

Raed Ali
Raed Ali

Reputation: 577

Change the position of the navigation bar in the homepage:

ScreenManager:
    Login:
    Homepage:
    AddNewCustomer:
    Nav:
    DrawerList:

<Login>:
    name: "login"
    MDCard:
        size_hint: None, None
        size: 700, 800
        pos_hint: {"center_x": 0.5, "center_y": 0.5}
        elevation: 10
        padding: 25
        spacing: 25
        orientation: 'vertical'

        Image:
            source: 'images/asteria.png'
            size: 100, 200

        MDLabel:
            id: login
            font_size: 40
            halign: 'center'
            size_hint_y: None
            height: self.texture_size[1]
            padding_y: 15

        MDTextFieldRound:
            id: user
            hint_text: "username"
            icon_right: "account"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}

        MDTextFieldRound:
            id: password
            hint_text: "password"
            icon_right: "eye-off"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}
            password: True

        MDRoundFlatButton:
            text: "LOGIN"
            font_size: 12
            pos_hint: {"center_x": 0.5}

            on_release:
                root.manager.current = "homepage"
                root.manager.transition.direction = "left"

        MDRoundFlatButton:
            text: "CLEAR"
            font_size: 12
            pos_hint: {"center_x": 0.5}
            on_press: app.clear()


        Widget:
            size_hint_y: None
            height: 50


<Nav>:
    ScrollView:
        MDList:
            OneLineListItem:
                text: "Add New Customer"

                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewCustomer"
                    root.screen_manager.transition.direction = "right"





            OneLineListItem:
                text: "Add New Staff"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewStaff"

            OneLineListItem:
                text: "Case List"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "caseList"


            OneLineListItem:
                text: "Create Case"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.transition.direction = "left"
                    root.screen_manager.current = "Create Case"


            OneLineListItem:
                text: "Log Out"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")

                    root.manager.current = "login"
                    root.manager.transition.direction = "right"



<Homepage>:
    name: "homepage"
    Screen:




        MDNavigationLayout:
            ScreenManager:
                id: screen_manager
                Screen:
                    name: "Homepage"
                    MDLabel:
                        text: "Welcome Home"
                        halign: "center"


                Screen:
                    name: "addNewCustomer"
                    MDLabel:
                        text: "Add New customer"
                        halign: "center"

                Screen:
                    name: "addNewStaff"
                    MDLabel:
                        text: "Add New Staff"
                        halign: "center"

                Screen:
                    name: "caseList"
                    MDLabel:
                        text: "Case List"
                        halign: "center"

                Screen:
                    name: "casePool"
                    MDLabel:
                        text: "Case Pool"
                        halign: "center"

                Screen:

                    name: "Create Case"
                    MDTextFieldRound:
                        id: user
                        hint_text: "Case Title"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.875, "center_x": 0.155}



                    MDTextFieldRound:
                        id: user2
                        hint_text: "e.g. Matthew Inwards School of Swag"
                        mode:"rectangle"
                        icon_right: "Customer"
                        size_hint_x: None
                        width: 275
                        font_size: 14
                        pos_hint: {"top": 0.779, "center_x": 0.155}
        BoxLayout:
            orientation: 'vertical'
            MDToolbar:
                title: 'Navigation'
                left_action_items: [['menu', lambda x: nav_drawer.set_state('open')]]
                right_action_items: [["images/asteria.png", lambda x: None]]


                elevation:5
            Widget:


        MDNavigationDrawer:
            id: nav_drawer
            Nav:
                screen_manager: screen_manager
                nav_drawer: nav_drawer
                manager: root.manager

Upvotes: 1

Related Questions