0

将一组小部件添加到 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 语言所描述的那样，我希望模态框以应用程序的 90% 宽度出现，并且高度应该动态调整以适应模态框的所有内容。

模态的内容应该是一个“标题”标签，下面有一组“正文”标签。在这些标签下方应该是出现在同一行的两个按钮。很直接。

但这就是我得到的：

小部件在 kivy 模态视图中未正确显示

请注意，上图显示：

  1. 按钮大多在模式之外
  2. 标题标签部分位于以下标签之上（这不是 BoxLayout 的工作方式）
  3. 标题标签也部分在模式之外

如何修复此脚本以使模式的内容按预期显示？

4

2 回答 2

1

如果您使用size_hint: 0.9, None，那么您必须指定height的ModalView。最简单的方法是让小部件通过使用minimum_heightchildren来进行计算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'

请注意， usingminimum_height要求 that 的子级Layout必须具有良好的定义heights。

于 2020-09-03T20:33:36.460 回答
0

您可以在您的规则中添加一个规则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()
于 2020-09-03T14:07:14.177 回答