Border with Kivy/KivyMD

Question

I am looking to add a border to the main screen of my application but I'm not sure how. I tried to take some tips from this question: Kivy-how can i make my canvas height smaller than the parent height But I can't seem to figure it out.

The issue is that I am also using a KivyMD's Navigation Drawer, I would like the border be separate from the top bar, enclosing everything below the bar. Please let me know if I'm not being clear.

Here is some sample code that replicates my setup.

Perhaps I could add some random rectangles to act as a border?

EDIT:

Okay almost there, I got the 'border' but I now need the size_hint added in the AnchorLayout to ignore the top portion of the screen where the menu bar is. Here is the updated code.

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout

from kivymd.app import MDApp

kv = '''
#:import hex kivy.utils.get_color_from_hex

NavigationLayout:
    canvas.before:
        Color:
            rgb: hex('#C0C0C0')
        Rectangle:
            size: self.size
            pos: self.pos
    ScreenManager:
        id: screen_manager
        Screen:
            name: "home_screen"
            BoxLayout:
                orientation: 'vertical'
                MDToolbar:
                    title: 'Name of the App!'
                    elevation: 10
                Widget:
            FloatLayout:

                orientation: 'vertical'
                AnchorLayout:
                    anchor_x: 'center'
                    anchor_y: 'center'
                    Widget:
                        canvas.before:
                            Color:
                                rgb: hex('#F5F5F5')
                            Rectangle:
                                size: self.size
                                pos: self.pos
                        size_hint: .95, .95
                MDLabel:
                    text: "Some More Text"
                    halign: "center"
                    color: 0,0,0,1
                    pos_hint: {"center_x": .5, "center_y": .75}
                    size_hint: .7, .1

    MDNavigationDrawer:
        id: nav_drawer
        ContentNavigationDrawer:
            orientation: "vertical"
            padding: "8dp"
            spacing: "8dp"
            AnchorLayout:
                anchor_x: "left"
                size_hint_y: None
                height: avatar.height
                Image:
                    id: avatar
                    source: "image.jpg"
            MDLabel:
                text: "Text here"
                font_style: "Button"
                size_hint_y: None
                height: self.texture_size[1]
    '''
class ContentNavigationDrawer(BoxLayout):
    pass

class MyApp(MDApp):
    def build(self):
        return Builder.load_string(kv)


MyApp().run()

Answer 1

I think you will get what you want if you indent the FloatLayout so that it is in the BoxLayout. Like this:

#:import hex kivy.utils.get_color_from_hex

NavigationLayout:
    canvas.before:
        Color:
            rgb: hex('#C0C0C0')
        Rectangle:
            size: self.size
            pos: self.pos
    ScreenManager:
        id: screen_manager
        Screen:
            name: "home_screen"
            BoxLayout:
                orientation: 'vertical'
                MDToolbar:
                    title: 'Name of the App!'
                    elevation: 10
                # Widget:  # not needed
                FloatLayout:

                    orientation: 'vertical'
                    AnchorLayout:
                        anchor_x: 'center'
                        anchor_y: 'center'
                        Widget:
                            canvas.before:
                                Color:
                                    rgb: hex('#F5F5F5')
                                Rectangle:
                                    size: self.size
                                    pos: self.pos
                            size_hint: .95, .95
                    MDLabel:
                        text: "Some More Text"
                        halign: "center"
                        color: 0,0,0,1
                        pos_hint: {"center_x": .5, "center_y": .75}
                        size_hint: .7, .1

    MDNavigationDrawer:
        id: nav_drawer
        ContentNavigationDrawer:
            orientation: "vertical"
            padding: "8dp"
            spacing: "8dp"
            AnchorLayout:
                anchor_x: "left"
                size_hint_y: None
                height: avatar.height
                Image:
                    id: avatar
                    # source: "image.jpg"
                    source: 'tester.png'
            MDLabel:
                text: "Text here"
                font_style: "Button"
                size_hint_y: None
                height: self.texture_size[1]