Skip to content Skip to sidebar Skip to footer

How To Create A Navigation Bar Using Kivymd Without Kv Language?

I want to create a navigation bar in my android application.I have searched about it a lot in google. I got the solution but it's based on kv language. I need to create without usi

Solution 1:

App with KivyMD's Navigation Drawer (with kv code):

from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.navigationdrawer import NavigationLayout  # Do not remove

root_kv = """
<ContentNavigationDrawer@MDNavigationDrawer>:
    drawer_logo: "drawer_logo.png"

    NavigationDrawerSubheader:
        text: "Menu:"

    NavigationDrawerIconButton:
        icon: "access-point"
        text: "First"

    NavigationDrawerIconButton:
        icon: "account"
        text: "Second"


NavigationLayout:
    id: nav_layout

    ContentNavigationDrawer:
        id: nav_drawer

    BoxLayout:
        orientation: "vertical"

        MDToolbar:
            id: toolbar
            title: "Toolbar title"
            md_bg_color: app.theme_cls.primary_color
            background_palette: "Primary"
            background_hue: "500"
            elevation: 10
            left_action_items:
                [["menu", lambda x: app.root.toggle_nav_drawer()]]

        BoxLayout:
            orientation: "vertical"
            padding: dp(16)

            MDRaisedButton:
                text: "Click me!"

            Widget:
"""classMainApp(MDApp):

    defbuild(self):
        self.root = Builder.load_string(root_kv)


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

The same app without kv code (also without bindings to app theme color, without ids and without other useful things). (Works only with KivyMD from master branch, see how to install):

from kivy.metrics import dp
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.widget import Widget
from kivymd.app import MDApp
from kivymd.uix.navigationdrawer import (
    NavigationLayout,
    MDNavigationDrawer,
    NavigationDrawerSubheader,
    NavigationDrawerIconButton,
)
from kivymd.uix.toolbar import MDToolbar
from kivymd.uix.button import MDRaisedButton


classMainApp(MDApp):
    defbuild(self):
        nav_layout = NavigationLayout()
        nav_drawer = MDNavigationDrawer(drawer_logo="drawer_logo.png")
        nav_drawer.add_widget(NavigationDrawerSubheader(text="Menu:"))
        nav_drawer.add_widget(
            NavigationDrawerIconButton(icon="access-point", text="First")
        )
        nav_drawer.add_widget(NavigationDrawerIconButton(icon="account", text="Second"))
        box_layout = BoxLayout(orientation="vertical")
        toolbar = MDToolbar(
            title="Toolbar title",
            md_bg_color=self.theme_cls.primary_color,
            background_palette="Primary",
            background_hue="500",
            elevation=10,
        )
        toolbar.left_action_items = [["menu", lambda x: self.root.toggle_nav_drawer()]]
        box_layout.add_widget(toolbar)
        box_layout_content = BoxLayout(orientation="vertical", padding=dp(16))
        box_layout_content.add_widget(MDRaisedButton(text="Click me!"))
        box_layout_content.add_widget(Widget())
        box_layout.add_widget(box_layout_content)
        nav_layout.add_widget(nav_drawer)
        nav_layout.add_widget(box_layout)
        self.root = nav_layout


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

I think that code of app with kv language is more readable and looks nice. If you will write all your app code without kv language, it will look terrible, hard-to-edit and have many bugs later. For this reason, I advice you to learn kv language and write programs with it.

Post a Comment for "How To Create A Navigation Bar Using Kivymd Without Kv Language?"