单击按钮时在 Kivy 语言中添加和删除代码元素

Question

我编写了一个由各种按钮和嵌套布局组成的 Kivy GUI。我希望能够通过单击按钮在其中一个布局中附加一段代码 n 次，特别是滚动布局。由于我对 Kivy 很陌生，而且我似乎找不到关于这个问题的教程，所以我在这里介绍它。

这是 Python 代码：

import kivy
from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.widget import Widget


class Interface(Widget):
    pass

class GUI(App):
    def build(self):
        return Interface()

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

以及全部 Kivy 代码：

<Interface>:
    GridLayout:
        padding:0
        size: root.width, root.height
        cols:1
        #Top buttons
        GridLayout:
            size_hint: 1, 0.07
            padding:0
            cols:1
            Button:
                text:"Add Phase"
        #Chart areas
        ScrollView:
            do_scroll_y:False
            BoxLayout:
                orientation: "vertical"
                size_hint_x: None
                width: self.minimum_width
                GridLayout:
                    size_hint_x: None
                    width: self.minimum_width
                    cols:20



                    #Phase template
                    GridLayout:
                        width: 200
                        size_hint_x: None
                        cols:1
                        TextInput:
                            size_hint: 1, 0.06
                            halign: 'center'
                            hint_text:"Phase"
                        TextInput:
                            size_hint: 1, 0.06
                            halign: 'center'
                            hint_text:"Step"
                        Button:
                            size_hint:1, 0.07
                            text:"Add Step"
                        GridLayout:
                            cols:20

                            #Step template
                            GridLayout:
                                width: 100
                                size_hint_x: None
                                cols:1
                                TextInput:
                                    size_hint: 1, 0.06
                                    halign: 'center'
                                    hint_text:"Var1"
                                TextInput:
                                    size_hint: 1, 0.06
                                    halign: 'center'
                                    hint_text:"Var2"
                                Button:
                                    background_normal: ''
                                    background_color: 0.28,0.59,0.72,1
                                    text:"Test"
                                Button:
                                    size_hint:1, 0.07
                                    text:"Delete"


                        Button:
                            background_color: 0.8,0,0,1
                            size_hint:1, 0.07
                            text:"Delete"

您将在 Kivy 代码中看到，这是一个名为 #Phase template 的注释部分。基本上在按下按钮Add Phase 时，整个部分及其子元素应附加到直接父级GridLayout。

您可以在此处按下“添加阶段”按钮：

这将导致：

最后，按下Delete 按钮应该会删除特定的附加代码部分。

再一次，不知道如何从 Kivy 语言中处理这个问题，这似乎有点僵硬。但我确信我想做的事情是可以完成的。

Answer 1

实现此目的的一种方法是创建一个Phase 类，并添加一个kv 规则来构建Phase 的实例。然后，在kv 中，您可以使用Factory.Phase() 创建新实例。

将您的kv 修改为：

#:import Factory kivy.factory.Factory
<Interface>:
    GridLayout:
        padding:0
        size: root.width, root.height
        cols:1
        #Top buttons
        GridLayout:
            size_hint: 1, 0.07
            padding:0
            cols:1
            Button:
                text:"Add Phase"
                on_release: grid.add_widget(Factory.Phase())  # this adds another Phase
        #Chart areas
        ScrollView:
            do_scroll_y:False
            BoxLayout:
                orientation: "vertical"
                size_hint_x: None
                width: self.minimum_width
                GridLayout:
                    id: grid  # added id to identify where to add new Phase instances
                    size_hint_x: None
                    width: self.minimum_width
                    cols:20

                    # initial Phase instance
                    Phase:

#Phase template
<Phase@GridLayout>:
    width: 200
    size_hint_x: None
    cols:1
    TextInput:
        size_hint: 1, 0.06
        halign: 'center'
        hint_text:"Phase"
    TextInput:
        size_hint: 1, 0.06
        halign: 'center'
        hint_text:"Step"
    Button:
        size_hint:1, 0.07
        text:"Add Step"
    GridLayout:
        cols:20

        #Step template
        GridLayout:
            width: 100
            size_hint_x: None
            cols:1
            TextInput:
                size_hint: 1, 0.06
                halign: 'center'
                hint_text:"Var1"
            TextInput:
                size_hint: 1, 0.06
                halign: 'center'
                hint_text:"Var2"
            Button:
                background_normal: ''
                background_color: 0.28,0.59,0.72,1
                text:"Test"
            Button:
                size_hint:1, 0.07
                text:"Delete"


    Button:
        background_color: 0.8,0,0,1
        size_hint:1, 0.07
        text:"Delete"
        on_release: root.parent.remove_widget(root)  # delete this Phase

重点是<Phase@GridLayout>规则，新的gridid，以及Add Phase按钮中Factory的使用。