kivykivy-languagekivymd

KIVYMD - Icons not showing up in the app, what do I do wrong?


I'm trying to place a "git" icon with bottomappbar and topappbar to my app but for some reason it is not showing up when i run the app. What do you think problem here?

KV File:

MDBoxLayout:
    orientation: 'vertical'

    MDTopAppBar:
        title: "Our Top Toolbar"
        icon: 'git'
        left_action_items: [["menu"]]
        right_action_items: [["dots-vertical"]]

    MDLabel:
        id: my_label
        text: "Some Stuff"
        halign: "center"

    MDBottomAppBar:
        MDTopAppBar:
            icon: 'git'
            type: 'bottom'
            mode: 'center'

**PY File:**
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.properties import ObjectProperty
from kivy.lang import Builder
from kivymd.app import MDApp
from kivy.core.window import Window
from kivymd.uix.toolbar import MDTopAppBar
from kivymd.uix.boxlayout import MDBoxLayout
from kivymd.uix.navigationdrawer import MDNavigationLayout, MDNavigationDrawer
from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager

Window.size = (400, 600)

class MahApp(MDApp):
    def build(self):
        self.theme_cls.theme_style = "Dark"
        self.theme_cls.primary_palette = "Indigo"
        return Builder.load_file('my.kv')

MahApp().run()

In bottomappbar also menu and other icons not showing up. Output: Output


Solution

  • The MDTopAppBar works a little bit different than the MDBottomAppBar. You can't insert an icon to this widget using the icon property, but you can get a pretty similar result by adding the "git icon" inside the right_action_items, like this:

    MDTopAppBar:
            title: "Our Top Toolbar"
            left_action_items: [["menu"]]
            right_action_items: [["git"], ["dots-vertical"]]
    

    The MDBottomAppBar icons are not showing up because they have not been coded yet:

    MDBottomAppBar:
            MDTopAppBar:
                icon: 'git'
                type: 'bottom'
                mode: 'center'
                left_action_items: [["menu"]]
                right_action_items: [["dots-vertical"]]