How to change MDRectangleFlatIconButton text colour in Kivy/KivyMD

Question

I’m creating a layout using Kivy and KivyMD and wish to change the colour of the text displayed in the MD buttons, however the colour remains stuck on a light blue.

I’ve included an example of what I tried in the code below.

.py code

import kivy, kivymd

from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.theming import ThemeManager


class ButtonColorApp(App):

    theme_cls = ThemeManager()
    title='RUCES'

    def build(self):
        self.theme_cls.theme_style = "Dark"
        sm = ScreenManager()
        sm.add_widget(IntroPage(name="intro_page"))
        return sm

class IntroPage(Screen):

    #funcs and vars
    pass

def main():
        but = ButtonColorApp()
        but.run()

if __name__ == "__main__":
        main()

.kv code

#: import MDRectangleFlatIconButton kivymd.button.MDRectangleFlatIconButton
#: import MDLabel kivymd.label.MDLabel

<MyButton@MDRectangleFlatIconButton>:
    text_size: self.size * 3
    theme_text_color: 'Custom'
    font_size: 20
    md_bg_color: (0,0,.4,1)
    canvas.before:
       Color:
            rgba: (0,0,0,1)
            Line:
                width: 0.5
                rectangle: (self.x, self.y, self.width, self.height)


<IntroPage>:

    BoxLayout:

        orientation: "vertical"

        MyButton:
            size_hint_x: 1
            theme_text_color: 'Custom'
            text: "Colour Me!"
            text_color: (1,0,0,1)

When I run this I expect the button text to be red but as mentioned above it remains light blue. Any help appreciated!

Asked By: JayK

||

Source

Answer 1

Problem

Currently, the text colour for MDRectangleFlatIconButton and MDRoundFlatIconButton widgets will always default to the theme_cls.primary_color even with attributes, theme_text_color: 'Custom' and text_color: [1,0,0,1].

Solution

The temporary solution is as follow:

In your kv file, replace import statement,
kivymd.button.MDRectangleFlatIconButton with your customised
button.py i.e. button.MDRectangleFlatIconButton
Either take a copy of button.py from my GitHub
Or take a copy of button.py from /usr/local/lib/python3.7/dist-packages/kivymd, or ~/KivyMD (created by git clone https://github.com/HeaTTheatR/KivyMD.git), or download and extract KivyMD Zip file (Download ZIP) , and apply the following changes

Replace:

        theme_text_color: 'Custom'
        text_color: root.theme_cls.primary_color

with:

        theme_text_color: root.theme_text_color   
        text_color: root.text_color

Snippets: button.py – kv

<MDRectangleFlatIconButton>
    ...
    theme_text_color: 'Custom'
    text_color: root.theme_cls.primary_color

    BoxLayout:
        ...

        MDIcon:
            ...

        MDLabel:
            ..
            theme_text_color: root.theme_text_color    
            text_color: root.text_color                 
            markup: root.markup

<MDRoundFlatIconButton>
    ...
    theme_text_color: 'Custom'
    text_color: root.theme_cls.primary_color

    BoxLayout:
        ...
        MDIcon:
            ...

        MDLabel:
            ...
            theme_text_color: root.theme_text_color     
            text_color: root.text_color                 
            markup: root.markup

Output

KivyMD GitHub

Answered By: ikolim

Answer 2

Another workaround is to use markup language, e.g.:

in your .kv file assign "id" to your MDButton

MDFlatButton:

    id: info_btn

then in your .py file

self.ids.info_btn.text = '[color=#00ffcc]Info[/color]'

self.ids.info_btn.markup = True

Answered By: Vladimir Matus