问题1

Question

索引如何在kivy小部件中工作？

我想输出3个小部件（颜色分别是红色，绿色，蓝色），一旦索引最高，就将红色放在所有的前面，

但是kivy却绘制了3个小部件，其中一个是白色（而不是绿色），红色是在其中部（而不是前面）

.kv：

<Red>:
    x: 0
    canvas:
        Rectangle:
            pos: self.pos
            size: self.size
        Color:
            rgba: 1,0,0,1

<Green>:
    x: 40
    canvas:
        Rectangle:
            pos: self.pos
            size: self.size
        Color:
            rgba: 0,1,0,1

<Blue>:
    x: 80
    canvas:
        Color:
            rgba: 0,0,1,1
        Rectangle:
            pos: self.pos
            size: self.size

.py：

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.core.window import Window


class Red(Widget):
    pass


class Green(Widget):
    pass


class Blue(Widget):
    pass


class MainWidget(Widget):
    pass
    def __init__(self, **kwargs):
        super().__init__(**kwargs)


        self.add_widget(Red(), index=3)
        self.add_widget(Green())
        self.add_widget(Blue())


class Test2App(App):
    def build(self):
        Window.size = (300, 300)
        self.main_widget = MainWidget()
        return self.main_widget

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

我的问题是：

为什么其中一个小部件是白色而不是绿色？
为什么红色小部件不在所有索引（索引最高）的前面

Answer 1

一个问题是，您在Color之后在kv中使用Rectangle。 Color设置其后出现的图形对象的颜色。因此Red的默认颜色为白色（白色），而Green的默认颜色为红色，因为Red在绘制其矩形后更改了颜色。 Blue正确地做到了。

index的{{1}}参数指示应将添加的add_widget放在子级列表中的位置。默认设置是将添加的Widget插入索引为零的位置，并且将小部件从高索引绘制到低索引，因此最后添加的小部件将绘制在顶部。请注意，在第一个Widget上使用index=3无效，因为add_widget()是子级列表的索引，并且此时子级列表为空。您可以使用以下方法查看此效果：

index

以上代码以self.add_widget(Red()) self.add_widget(Green()) self.add_widget(Blue(), index=2)，Green，然后Red（按索引顺序）的顺序列出子级列表。它们以相反的顺序绘制，因此Blue将最终位于前面。当然，您需要先更正Green的使用。

Answer 2

问题1

为什么其中一个小部件是白色而不是绿色？

答案

第一个小部件是白色的，因为在您的kv文件中，它指定先绘制矩形而不先指定颜色。因此，它使用了默认颜色白色。

问题2

为什么红色小部件不在所有小部件（索引最高）

答案

实际上，红色小部件位于所有其他小部件的前面。只是颜色是乱序的。

解决方案

在绘制矩形之前放置Color属性，其余代码也可以正常工作。

摘要-kv文件

<Red>:
    x: 0
    canvas:
        Color:
            rgba: 1,0,0,1
        Rectangle:
            pos: self.pos
            size: self.size

<Green>:
    x: 40
    canvas:
        Color:
            rgba: 0,1,0,1
        Rectangle:
            pos: self.pos
            size: self.size

<Blue>:
    x: 80
    canvas:
        Color:
            rgba: 0,0,1,1
        Rectangle:
            pos: self.pos
            size: self.size

图层如何在Kivy中工作，了解小部件中的索引

2 个答案:

问题1

答案

问题2

答案

解决方案

摘要-kv文件

输出