如何在 Kivy 中固定宽度的按钮上绘制矩形？

Question

I want to cover a button with a red rectangle in Kivy. This button stands in a BoxLayout . I have defined the MyButton class that draws a rectangle over a button and it works. However, if I fix the width of the BoxLayout the button is in, the rectangle goes to the bottom left corner.

MWE:

# -*- coding: utf-8 -*-

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.lang import Builder
from kivy.uix.button import Button
from kivy.graphics import Color, Rectangle

Builder.load_string('''
<MainApp>:
    orientation: 'horizontal'
    BoxLayout:
        orientation: 'vertical'
        # width: 100  # uncommenting these two lines breaks the rectangle positioning
        # size_hint: (None,1)
        MyButton:
            text: 'button1'
            size_hint: (1,None)
            height: 50
        Label:
    Label:
''')


class MyButton(Button):
    def __init__(self, **kwargs):
        super(MyButton, self).__init__(**kwargs)

    def on_size(self, *args):
        self.canvas.after.clear()
        with self.canvas.after:
            Color(1, 0, 0, 1)
            Rectangle(pos=self.pos, size=self.size)


class MainApp(BoxLayout):
    pass


class TestApp(App):
    def build(self):
        return MainApp()


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

Uncommenting the two commented lines in Builder.load_string breaks the rectangle positioning. What am I missing?

Answer 1

In your MyButton class, you have a on_size() method, but no on_pos() method. I think you just need to add that method:

def on_pos(self, *args):
    self.on_size()