页面布局 - 在 Kivy / Python 中重置页面

Question

我刚刚开始使用 Python 的 Kivy 编程。我在使用 PageLayout 时遇到问题。到目前为止，这是我的 Python 代码（Python 3.6.2）：

import kivy

from kivy.app import App
from kivy.uix.pagelayout import PageLayout


class PageApp(App):

    def build(self):
        return PageLayout()

paApp = PageApp()
paApp.run()

Kivy 文件 (PageApp.kv) 有以下内容：

<PageLayout>:
    canvas:
        Color:
            rgb: 0, .5, .95
        Rectangle:
            pos: self.pos
            size: self.size

    BoxLayout:
        orientation: "vertical"
        Button:
            text: "This is a test button"
            size_hint_y: .4
        Label:
            markup: True
            text: "This is a [b]looooong[/b] text... "*100
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30

    BoxLayout:
        orientation: "vertical"
        Label:
            markup: True
            text: "This is an even [b]looooonger[/b] text... "*100
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30
        Button:
            text: "This is a second test button"
            size_hint_y: .2

    Button:
        text: "Page 3"

    Button:
        text: "Page 4"

结果如下所示：Page 1, Page 2 (after swiping)

从截图中可以看出，出现以下问题：

1. 标签不显示。
2. 背景只有部分颜色是我在画布设置中指定的颜色。
3. 最重要的是：滑动后页面似乎没有重置，导致第一页的元素在滑动到第 2 页时仍保留在页面上的问题。第 3 页和第 4 页似乎工作正常，因为按钮占据了整个空间......

有人知道如何解决这些问题吗？

Answer 1

详情请参考以下示例。

问题标签不显示。
答案这两个标签确实显示了，但显示为黑色标签，因为您超出了文本大小。 在第 1 页中，我将乘法值从 100 更改为 49。任何 50 及以上的值，您都会看到一个黑色标签。
在第 2 页，我删除了 100。2 到 36 之间的任何内容，文本溢出到第 1 页。任何 37 及以上的内容，您都会看到一个黑色标签。

问题背景只有部分颜色是我在画布设置中指定的颜色。 Answer第2页的画布颜色没有设置。因此，它使用的是第1页的颜色。

问题最重要的是：滑动后页面似乎没有重置，导致滑动到第2页时第一页的元素保留在页面上的问题。第3页和第4页似乎工作正常，因为按钮占据了整个空间...
Answer 您会在右侧或左侧看到用于从一页滑动到下一页的边框区域。

示例

main.py

​​>

from kivy.app import App
from kivy.uix.pagelayout import PageLayout


class PageLayoutDemo(PageLayout):
    pass


class TestApp(App):
    title = "Kivy PageLayout Demo"

    def build(self):
        return PageLayoutDemo()


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

test.kv

#:kivy 1.10.0

<PageLayoutDemo>:
    BoxLayout:
        canvas:
            Color:
                rgb: 0, .5, .95, 1
            Rectangle:
                pos: self.pos
                size: self.size

        orientation: "vertical"
        Button:
            text: "This is a test button"
            size_hint_y: .4
        Label:
            markup: True
            text: "This is a [b]looooong[/b] text... " * 49
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30

    BoxLayout:
        orientation: "vertical"
        canvas:
            Color:
                rgba: 109/255., 8/255., 57/255., 1
            Rectangle:
                pos: self.pos
                size: self.size
        Label:
            markup: True
            text: "This is an even [b]looooonger[/b] text... "
            color: 0, 0, 0, 1
            outline_color: 0, 0.5, 0.5, 1
            font_size: 30
        Button:
            text: "This is a second test button"
            size_hint_y: .2

    Button:
        text: "Page 3"

    Button:
        text: "Page 4"

输出

Answer 2

好的

1. 你没有设置标签的text_size属性，想要显示的文字很长

2. 抱歉，背景颜色正是您在画布中指定的颜色，请参见下图

3. 如果你想在当前页面缩小下一个/预览页面的大小，可以设置PageLayout的border属性

4. 如果您只想让小部件围绕子小部件滑动，我建议您使用 Caroussel 小部件

试试下面的代码：

-ma​​in.py

import kivy
from kivy.app import App
from kivy.uix.pagelayout import PageLayout

class PageApp(App):

   def build(self):
      return PageLayout()

paApp = PageApp()
paApp.run()

-page.kv

<PageLayout>:
   border: 5
   BoxLayout:
      canvas:
         Color:
            rgb: 0, .5, .95
         Rectangle:
            pos: self.pos
            size: self.size
      orientation: "vertical"
      Button:
         text: "This is a test button"
         size_hint_y: .4
      Label:
         markup: True
         text: "This is a [b]looooong[/b] text... " * 100
         text_size: self.size
         color: 0, 0, 0, 1
         outline_color: 0, 0.5, 0.5, 1
         font_size: 30
   BoxLayout:
      canvas:
         Color:
            rgb: 0, .5, .95
         Rectangle:
            pos: self.pos
            size: self.size
      orientation: "vertical"
      Label:
         markup: True
         text: "This is an even [b]looooonger[/b] text... " * 100
         color: 0, 0, 0, 1
         outline_color: 0, 0.5, 0.5, 1
         font_size: 30
         text_size: self.size
      Button:
         text: "This is a second test button"
         size_hint_y: .2
   Button:
      canvas.before:
         Color:
            rgb: 0, .5, .95
         Rectangle:
            pos: self.pos
            size: self.size
      text: "Page 3"
   Button:
      canvas.before:
         Color:
            rgb: 0, .5, .95
         Rectangle:
            pos: self.pos
            size: self.size
      text: "Page 4"

-一些输出：

背景颜色证明：

我希望这会有所帮助！