让ModalView适应它的所有内容小部件(kivy)

Question

如何正确地将一组小部件添加到ModalView中的kivy中，以便模态窗口动态地满足其所有内容(而不将高度设置为硬编码像素大小)？

我有以下示例脚本：

#!/usr/bin/env python3

import kivy
from kivy.uix.modalview import ModalView
from kivy.lang import Builder
from kivy.app import App

KV = """
BoxLayout:
    ModalView:
        size_hint: 0.9, None

        BoxLayout:
            orientation: 'vertical'

            Label:
                text: 'Dialog Title'
                font_size: 30

            Label:
                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            Label:
                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            Label:
                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            Label:
                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."

            StackLayout:
                orientation: 'rl-tb'

                Button:
                    text: "OK"
                    size_hint: None, None
                    size: self.texture_size
                    padding: '8dp', '8dp'

                Button:
                    text: "Cancel"
                    size_hint: None, None
                    size: self.texture_size
                    padding: '8dp', '8dp'
"""

class MyApp(App):
    def build(self):
        return Builder.load_string( KV )


MyApp().run()

正如kivy langauge所描述的，我希望一个带有90%宽度的应用程序的模式出现，并且高度应该动态地调整以适应所有的模态内容。

模态的内容应该是一个“标题”标签，下面应该有一组“主体”标签。在这些标签下面应该有两个显示在同一行上的按钮。相当直截了当。

但我得到的是：

​

​

请注意，上面的图像显示：

1. 这些按钮大多不在模态之外。
2. 标题标签部分位于以下标签的顶部(这不是BoxLayout的工作方式)
3. 标题标签也部分超出了模态。

如何修复此脚本，使模型的内容如预期的那样显示？

Answer 1

如果使用size_hint: 0.9, None，则必须指定ModalView的height。最简单的方法是让小部件使用子部件的minimum_height (子Layouts )进行计算。就像这样：

<MyModal@ModalView>:
    size_hint: 0.9, None
    height: box.height
    BoxLayout:
        id: box
        orientation: 'vertical'
        size_hint: 1, None
        height: self.minimum_height
        padding: 5
        spacing: 5

        Label:
            text: 'Dialog Title'
            font_size: 30
            pos_hint: {'center_x': 0.5}
            size_hint: None, None
            size: self.texture_size

        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            pos_hint: {'center_x': 0.5}
            size_hint: None, None
            size: self.texture_size
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            pos_hint: {'center_x': 0.5}
            size_hint: None, None
            size: self.texture_size
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            pos_hint: {'center_x': 0.5}
            size_hint: None, None
            size: self.texture_size
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
            pos_hint: {'center_x': 0.5}
            size_hint: None, None
            size: self.texture_size

        StackLayout:
            orientation: 'rl-tb'
            size_hint: 1, None
            height: self.minimum_height

            Button:
                text: "OK"
                size_hint: None, None
                size: self.texture_size
                padding: '8dp', '8dp'

            Button:
                text: "Cancel"
                size_hint: None, None
                size: self.texture_size
                padding: '8dp', '8dp'

请注意，使用minimum_height需要该Layout的子级必须具有定义良好的heights。

Answer 2

您可以在kv中添加一条规则，描述如何构建ModalView，而不使其成为任何小部件的子部件。见文档。您可以使用这样的规则：

<MyModal@ModalView>:

    BoxLayout:
        orientation: 'vertical'

        Label:
            text: 'Dialog Title'
            font_size: 30

        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
        Label:
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."

        StackLayout:
            orientation: 'rl-tb'

            Button:
                text: "OK"
                size_hint: None, None
                size: self.texture_size
                padding: '8dp', '8dp'

            Button:
                text: "Cancel"
                size_hint: None, None
                size: self.texture_size
                padding: '8dp', '8dp'

然后在您的python代码中，创建如下所示的ModalView：

from kivy.factory import Factory
modal_inst = Factory.MyModal()
modal_inst.open()