Abdul Moez
Abdul Moez

Reputation: 107

Toolbar text does not change in kivyMD and text goes beyond the boundaries

from kivymd.app import MDApp
from kivy.uix.boxlayout import BoxLayout
from kivy.lang import Builder
from kivy.properties import ObjectProperty

class ContentNavigationDrawer(BoxLayout):
    """This class manage the navigation drawer contents"""
    screen_manager = ObjectProperty()
    nav_drawer = ObjectProperty()


class MyApp(MDApp):
    def build(self):
        """Return the main kivy file and set themes """

        self.theme_cls.theme_style = "Dark"
        self.theme_cls.primary_palette = 'BlueGray'
        self.theme_cls.accent_palette = "Teal"
        return Builder.load_file("main.kv")

MyApp().run()

and the kv file

<ContentNavigationDrawer>:
    MDBoxLayout:
        orientation: "vertical"
        spacing: dp("8")
        padding: dp("8")

        ScrollView:
            MDList:
                OneLineIconListItem:
                    text: "hexagon"
                    on_press:
                        root.nav_drawer.set_state("close")
                        root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'hexagon'

MDScreen:
    MDToolbar:
        id: toolbar
        title: "Hexagon"
        md_bg_color: app.theme_cls.primary_color
        specific_text_color: 1, 1, 1, 1
        pos_hint: {"top": 1}
        elevation: 9
        icon: 'account-circle'
        left_action_items: [["menu", lambda x: nav_drawer.set_state("open")]]

    MDNavigationLayout:
        x: toolbar.height

        ScreenManager:
            id: screen_manager

            MDScreen:
                name: "mainScreen"
                BoxLayout:
                    orientation: 'vertical'
                    size: root.width, root.height

                    ScrollView:
                        do_scroll_x: True
                        do_scroll_y: True
                        size_hint: (1, .85)
                        bar_width: 10
                        bar_color: (1, 0, 0 ,1)
                        scroll_type: ["bars", "content"]
                        pos_hint: {'top': 1.0 - toolbar.height/float(root.height)}

                        GridLayout:
                            id: labels_layout
                            size_hint_y: None
                            height:self.minimum_height
                            size_hint_x: None
                            width: self.minimum_width
                            cols: 1
                            spacing: "5dp"
                            padding: "5dp"
                            
                            MDLabel:
                                id: big_text_label
                                text: "asldklsa\nasdsaf\nssss\n"
                                width: self.texture_size[1]
                                height: self.texture_size[1]
                                
        MDNavigationDrawer:
            id: nav_drawer
            
            ContentNavigationDrawer:
                screen_manager: screen_manager
                nav_drawer: nav_drawer  

test_screen_shot

  1. I want to change the color of the toolbar I tried almost everything to do it like md_bg_color: app.theme_cls.primary_color and md_bg_color: .2, .2, .2, 1

  2. And the text goes beyond the boundaries even of the app if i add some widgets to get back text to its area the it goes under the toolbar

Using: Python 3.9, dev kivyMD 2.0, editor pycharm

Upvotes: 0

Views: 468

Answers (1)

user13676212
user13676212

Reputation:

Use:

from kivymd.app import MDApp
from kivy.lang import Builder

KV = """ 
<ContentNavigationDrawer>:
    MDBoxLayout:
        orientation: "vertical"
        spacing: dp("8")
        padding: dp("8")

        ScrollView:
            MDList:
                            
                OneLineIconListItem:
                    divider: None
                    text: "hexagon"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'account'
                        
##                BoxLayout:
##                    canvas.before:
##                        Color:
##                            rgba: [1,.3,0,1]
##                        Line:
##                            width: dp(1)
##                            rounded_rectangle:
##                                (self.x, self.y, self.width-dp(20), dp(43),\
##                                dp(12),dp(12),dp(12),dp(12),\
##                                dp(50))
                            
                OneLineIconListItem:
                    divider: None
                    text: "hexagon"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'hexagon'
                OneLineIconListItem:
                    divider: None
                    text: "Edit"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'pencil'
                OneLineIconListItem:
                    divider: None
                    text: "Home"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'home'
                OneLineIconListItem:
                    divider: None
                    text: "Likes"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'star'
                OneLineIconListItem:
                    divider: None
                    text: "hexagon"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'hexagon'
                OneLineIconListItem:
                    divider: None
                    text: "Search"
                    on_press:
                        app.root.ids.nav_drawer.set_state("toggle")
                        #root.screen_manager.current = "mainScreen"
                    IconLeftWidget:
                        icon: 'magnify'

Screen:
    MDToolbar:
        id: toolbar
        pos_hint: {"top": 1}
        title: "Hexagon"
        md_bg_color: [1,0,0,1]
        specific_text_color: [1, 1, 1, 1]
        elevation: 0
        left_action_items: [["menu", lambda x: nav_drawer.set_state("toggle")]]
        right_action_items: [["account-circle", lambda x: print(222)]]


    ScreenManager:
        id: screen_manager

        MDScreen:
            name: "mainScreen"

            FloatLayout:
                BoxLayout:
                    id: m5
                    pos_hint: {"center_x": .5, "center_y": .38} #this will change if you change this Window.size = (330, 500)
                    orientation: "vertical"
                
                    ScrollView:
                        do_scroll_x: False #True
                        do_scroll_y: True
                        #size_hint: (1, .85)
                        bar_width: 10
                        bar_color: (1, 0, 0 ,1)
                        scroll_type: ["bars", "content"]
                        pos_hint: {'top': 1.0 - toolbar.height/float(root.height)}

                        GridLayout:
                            id: labels_layout
                            size_hint_y: None
                            height:self.minimum_height
                            size_hint_x: 1
                            #width: self.minimum_width
                            cols: 1
                            spacing: "5dp"
                            padding: dp(20)
                            
                            MDLabel:
                                id: big_text_label
                                text: "\\n\\n\\n\\n\\n\\nWelcome to this New App.\\nYou will get a lot of benefits.\\n\\njbsidis recommendations are good so we can design in different ways."
                                
            MDNavigationDrawer:
                id: nav_drawer
                
                ContentNavigationDrawer:
                    screen_manager: screen_manager

"""

from kivy.uix.boxlayout import BoxLayout
from kivy.properties import ObjectProperty

class ContentNavigationDrawer(BoxLayout):
    """This class manage the navigation drawer contents"""
    screen_manager = ObjectProperty()
    #nav_drawer = ObjectProperty()


class WeatherApp(MDApp):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        pass
    def build(self):
        self.screen = Builder.load_string(KV)
        return self.screen
WeatherApp().run()

Pictures:

enter image description here

enter image description here

enter image description here

Upvotes: 1

Related Questions