自定义按钮未显示所有实例的图像 - Kivy

Question

我创建了一个类 mybutton，它继承自 Button & Image。这是我的.py 和.kv 代码。

ma​​in.py

from kivy.app import App
from kivy.garden.navigationdrawer import NavigationDrawer as ND
from kivy.uix.button import Button
from kivy.uix.image import Image

class navwindow(ND):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)

class mybutton(Button,Image):
    pass
class mainapp(App):
    def build(self):
        return navwindow()
    #theme_cls = ThemeManager() #very important

if __name__=='__main__':
    mainapp().run()

ma​​in.kv

<mybutton@Button>:
    size_hint: 1, None
    GridLayout:
        rows:1
        Image:
            source:'icons/ask.png'
        Label:
            text:''
<navwindow>:
    anim_type:'slide_above_simple'
    id:mainwin
    BoxLayout:
        orientation:'vertical'
        spacing: 10
        canvas.before:
            Color:
                rgba:(1,1,1,1)
            Rectangle:
                pos:self.pos
                size:self.size
        ScrollView:
            GridLayout:
                size_hint_y:None
                height: self.minimum_height
                cols:1
                Image:
                    source:'icons/try.png'
                    size_hint_y:None
                Label:
                    text:'Chitkaran@gmail.com'
                    color:(0,0,0,1)
                    size_hint_y:None
                mybutton:
                    text:'heaadadadllo'
                mybutton:
                    text:'hello'
                mybutton:
                    text:'hello'

问题： 当我运行代码时，只有最后一个按钮显示图标图像。

我已附上输出的屏幕截图以正确解释问题。

请协助。

Answer 1

要做到这一点，只需将Button 类子类化并重新定义它的绘制方式。我在mybutton 类中添加了一个icon 属性。 mybutton 的 kv 字符串中的代码只是 Button 的默认值（来自 style.kv），只是对处理 icon 属性进行了一些小改动：

from kivy.app import App
from kivy.garden.navigationdrawer import NavigationDrawer as ND
from kivy.lang import Builder
from kivy.properties import ObjectProperty
from kivy.uix.button import Button


class navwindow(ND):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)


class mybutton(Button):
    icon = ObjectProperty(None)


Builder.load_string('''
<mybutton>:
    state_image: self.background_normal if self.state == 'normal' else self.background_down
    disabled_image: self.background_disabled_normal if self.state == 'normal' else self.background_disabled_down
    canvas:
        Color:
            rgba: self.background_color
        BorderImage:
            border: self.border
            pos: self.pos
            size: self.size
            source: self.disabled_image if self.disabled else self.state_image
        Color:
            rgba: 1, 1, 1, 1
        Rectangle:
            texture: self.texture
            size:  self.texture_size
            pos: int(0.75 * self.right - self.texture_size[0] / 2.0), int(self.center_y - self.texture_size[1] / 2.)
        Rectangle:
            source: self.icon
            size: 0.25 * self.width, self.height
            pos: self.pos
<navwindow>:
    anim_type:'slide_above_simple'
    id:mainwin
    BoxLayout:
        orientation:'vertical'
        spacing: 10
        canvas.before:
            Color:
                rgba:(1,1,1,1)
            Rectangle:
                pos:self.pos
                size:self.size
        ScrollView:
            GridLayout:
                size_hint_y:None
                height: self.minimum_height
                cols:1
                Image:
                    source:'icons/try.png'
                    size_hint_y:None
                Label:
                    text:'Chitkaran@gmail.com'
                    color:(0,0,0,1)
                    size_hint_y:None
                mybutton:
                    icon: 'icons/ask.png'
                    text:'heaadadadllo'
                    size_hint: 1, None
                mybutton:
                    icon: 'icons/ask.png'
                    text:'hello'
                    size_hint: 1, None
                mybutton:
                    icon: 'icons/ask.png'
                    text:'hello'
                    size_hint: 1, None
''')


class mainapp(App):
    def build(self):
        return navwindow()
    #theme_cls = ThemeManager() #very important


if __name__=='__main__':
    mainapp().run()

上面的代码将强制图标图像适合Rectangle，这是mybutton宽度的1/4，但mybutton的全高，这可能会拉伸图标图像。如果图标是方形的，您可以使用以下代码来避免拉伸图标Rectangle：

    Rectangle:
        source: self.icon
        size: 0.25 * self.width, 0.25 * self.width
        pos: self.x, self.y + 0.5 * (self.height - 0.25 * self.width)

这应该适用于任何方形图标。如果图标不是方形的，您可以调整上面的代码来解决这个问题。无论如何，这样做只适用于相同形状的图标。如果你想处理任意形状，我怀疑在mybutton 类中添加一些额外的代码是可能的。