M
M
mcrack2019-11-25 20:25:37
Python
mcrack, 2019-11-25 20:25:37

Python Kivy - how to make a button with text and icon?

Hello, please tell me how can I make a picture / icon in the button next to the text?
I tried Button->StackLayout->Label+Image, but since it doesn’t work out beautifully, there is already an indent not from the text, but from the label area.
And I'd like to center the content of the button, which will have some text and an icon next to a small padding to the left of the text.
Is it possible to do this in Python Kivy?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
M
mcrack, 2019-12-08
@mcrack

Hello everyone, as usual, if you do not find the answer yourself, no one will.
I came up with a more or less interesting way to insert a font icon from Font Awesome into a button or into any Label field.
KV file:

<Root>:
    BoxLayout:
        ButtonIcon:
            icon: "\uf2c2"
            ltext: "Text left"
            rtext: "Text right"
            text: root.iconText(self.icon, self.ltext, self.rtext)
            font_size: 25
            padding: 0.5, 0

<[email protected]>:
    markup: True
    ltext: ""
    rtext: ""

main.py file:
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout

class Root(BoxLayout):
    def iconText(self, icon, ltext='', rtext=''):
        Ltext = ''
        if (ltext != ''):
            Ltext = "[font=Roboto]" + ltext + "[/font]  "
        Rtext = ''
        if (rtext != ''):
            Rtext = "  [font=Roboto]" + rtext + "[/font]"
        fontIcon = "[font=fonts/fontawesome-webfont.ttf]" + icon + "[/font]"
        text = Ltext + fontIcon + Rtext
        return text

class MyApp(App):
    def build(self):
        return Root()

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

You need to create a fonts folder and put the fontawesome-webfont.ttf file from the Font Awesome site into it.
PS:
Here I used fonts from version 4.7.0, in the same way you can screw any font icons
****************************** *
For more experienced:
If you come up with a more convenient way to display icons in buttons, I will be very grateful if you share your way.

L
lightmanLP, 2019-12-06
@lightmanLP

background_normal from Button
background_normal¶Added in 1.0.4
Background image of the button used for the default graphical representation when the button is not pressed.
background_normal is a StringProperty and defaults to 'atlas://data/images/defaulttheme/button'.
https://kivy.org/doc/stable/api-kivy.uix.button.html

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question