将自定义 kivy 小部件的触摸位置输出到标签

Question

我正在尝试创建一个应用程序，该应用程序在我单击鼠标的位置绘制一个小椭圆。然后，如果我再次单击，我希望它删除旧椭圆并在新的鼠标单击位置绘制一个新椭圆。我已经让这部分工作了。下一步是获取鼠标单击位置以打印到两个标签的文本。出于某种原因，我无法弄清楚如何正确引用标签文本来更新它。我的代码如下。 ColorLoopWidget 主要基于 Kivy 教程中的 A Simple Paint App。

主.py

from kivy.config import Config
Config.set('graphics', 'width', '1000')
Config.set('graphics', 'height', '500')
Config.set('graphics', 'resizable', 0)
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.lang import Builder
from kivy.properties import ObjectProperty
from kivy.graphics import Color, Ellipse, Line

Builder.load_file('hueLayout.kv')

class ColorLoopWidget(Widget):
    xlabel = ObjectProperty
    ylabel = ObjectProperty
    def on_touch_down(self, touch):
        with self.canvas:
            self.canvas.clear()
            d = 10
            Ellipse(pos=(touch.x - d/2, touch.y - d/2), size=(d,d))
            touch.ud['line'] = Line(points=(touch.x, touch.y))
##            self.xlabel.text = 'x: '+str(touch.x)
##            self.ylabel.text = 'y: '+str(touch.y)

##    def on_touch_move(self, touch):
##        touch.ud['line'].points += [touch.x, touch.y]



class HueLayout(Widget):
    colorloopwidget = ObjectProperty
    xlabel = ObjectProperty
    ylabel = ObjectProperty

##    def on_touch_down():
##        ColorLoopWidget.on_touch_down()
##
##    def on_touch_move():
##        ColorLoopWidget.on_touch_move()

    def clear_canvas(self):
        self.colorloopwidget.canvas.clear()


class HueApp(App):
    def build(self):
        return HueLayout()

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

---

HueLayout.kv

<HueLayout>:
    colorloopwidget: colorloopwidget
    xlabel: xlabel
    ylabel: ylabel

    BoxLayout:
        size: 1000, 500
        orientation: 'horizontal'

        ColorLoopWidget:
            id: colorloopwidget
            size: 500, 500

        BoxLayout:
            orientation: 'vertical'
            Button:
                text: 'Clear'
                on_release: root.clear_canvas()
            Label:
                id: xlabel
                text: 'x: '
                size_hint_y: 0.2
            Label:
                id: ylabel
                text: 'y: '
                size_hint_y: 0.2

Answer 1

两个问题：

1) 你做了xlabel = ObjectProperty，但这只是不实例化一个ObjectProperty，它将xlabel 设置为ObjectProperty 本身。相反，您想做xlabel = ObjectProperty()，括号创建一个ObjectProperty 的实例。

2) 您的 on_touch_down 方法位于 ColorLoopWidget 中，并尝试（在您注释掉的代码中）引用 self.xlabel 和 self.ylabel。这不起作用，因为这些属性从未设置过；如果您检查 kv，您会看到 HueLayout 有 xlabel: xlabel 和 ylabel: ylabel 但内部 ColorLoopWidget 没有。下面的代码添加了这些属性，以便 ColorLoopWidget 知道标签并且其 on_touch_down 方法能够引用它们。

以下代码解决了这两个问题，似乎对我来说工作正常。

main.py:

from kivy.config import Config
Config.set('graphics', 'width', '1000')
Config.set('graphics', 'height', '500')
Config.set('graphics', 'resizable', 0)
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.lang import Builder
from kivy.properties import ObjectProperty
from kivy.graphics import Color, Ellipse, Line

Builder.load_file('hueLayout.kv')

class ColorLoopWidget(Widget):
    xlabel = ObjectProperty()
    ylabel = ObjectProperty()
    def on_touch_down(self, touch):
        with self.canvas:
            self.canvas.clear()
            d = 10
            Ellipse(pos=(touch.x - d/2, touch.y - d/2), size=(d,d))
            touch.ud['line'] = Line(points=(touch.x, touch.y))
            self.xlabel.text = 'x: '+str(touch.x)
            self.ylabel.text = 'y: '+str(touch.y)

##    def on_touch_move(self, touch):
##        touch.ud['line'].points += [touch.x, touch.y]



class HueLayout(Widget):
    colorloopwidget = ObjectProperty()
    xlabel = ObjectProperty()
    ylabel = ObjectProperty()

##    def on_touch_down():
##        ColorLoopWidget.on_touch_down()
##
##    def on_touch_move():
##        ColorLoopWidget.on_touch_move()

    def clear_canvas(self):
        self.colorloopwidget.canvas.clear()


class HueApp(App):
    def build(self):
        return HueLayout()

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

hueLayout.kv:

<HueLayout>:
    colorloopwidget: colorloopwidget
    xlabel: xlabel
    ylabel: ylabel

    BoxLayout:
        size: 1000, 500
        orientation: 'horizontal'

        ColorLoopWidget:
            xlabel: xlabel
            ylabel: ylabel
            id: colorloopwidget
            size: 500, 500

        BoxLayout:
            orientation: 'vertical'
            Button:
                text: 'Clear'
                on_release: root.clear_canvas()
            Label:
                id: xlabel
                text: 'x: '
                size_hint_y: 0.2
            Label:
                id: ylabel
                text: 'y: '
                size_hint_y: 0.2