Python - 如何向我的 kivy 应用程序添加第二个“屏幕”？

Posted 2023-04-14

【中文标题】Python - 如何向我的 kivy 应用程序添加第二个“屏幕”？

【英文标题】：Python - How do I add a second "screen" to my kivy application?

【发布时间】：2017-10-27 17:38:06

【问题描述】：

注意：我不是程序员，也不知道我应该使用的确切术语。这是一个基本程序，我不想使用文字“kivy 屏幕”或 kivy 屏幕管理器。

我花了几个小时在谷歌上搜索试图解决这个问题，但我做不到。我有一个 python kivy 程序。我已经创建了初始启动屏幕。当用户点击特定游戏时，我希望屏幕清除第一个屏幕上的所有数据，然后在屏幕上放置按钮和标签。几乎就像一个“新”屏幕。我目前有它在用户选择游戏时清除屏幕的位置，但是如果我尝试在此屏幕上添加按钮，它们会填充在主屏幕上。

这是我的python代码：

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.dropdown import DropDown

class MadLib(Widget):
    pass

class MadlibApp(App):
    def build(self):
        return MadLib()

app = MadlibApp()

if __name__ == '__main__':
    app.run()

这是我的 .kv 文件：

<MadLib>:
    canvas:
        Color:
            rgba: 0.2, 0.8, 0.2, 1
        Rectangle:
            pos: 0, 0
            size: self.width, self.height


    Button:
        tag: 'exit'
        background_color: 0, 0, 0, 0
        height: 100
        width: 100
        center_x: root.width - self.width / 2
        top: root.top
        on_press: app.stop()
        Image:
            source: r"C:\Users\kraak\Desktop\Python\Python\basicexitbutton.gif"
            top: root.top
            center_x: root.width - self.width / 2
            size_hint_y: None
            height: '96dp'

    Button:
        tag: 'menu'
        background_color: 0, 0, 0, 0
        id: btn
        top: root.top - 10
        center_x: self.width / 2 + 10
        on_release: dropdown.open(self)
        size_hint_y: None
        height: '48dp'
        width: '175dp'
        Image:
            source: r"C:\Users\kraak\Desktop\Python\Python\basicmenubutton.gif"
            top: root.top + 10
            center_x: self.width / 2
            size_hint_y: None
            height: '96dp'

    Widget:
        on_parent: dropdown.dismiss()

    DropDown:

        id: dropdown
        on_select: btn.text = ''.format(args[1])

        Button:
            center_x: self.width / 2
            text: 'Browse'
            font_size: '32'
            background_color: 0, 0 ,0, 0
            size_hint_y: None
            height: '48dp'
            on_release: dropdown.select('A')

        Button:
            text: 'Categories'
            font_size: '32'
            background_color: 0, 0 ,0, 0
            size_hint_y: None
            height: '48dp'
            on_release: dropdown.select('B')

        Button:
            text: 'Settings'
            font_size: '32'
            background_color: 0, 0 ,0, 0
            size_hint_y: None
            height: '48dp'
            on_release: dropdown.select('C')

    Button:
        text: 'Game 1'
        font_size: '32'
        background_color: 0, 0 ,0, 0
        size_hint_y: None
        height: '48dp'
        top: root.top / 1.33
        center_x: root.width / 4
        on_press: root.clear_widgets()

    Button:
        text: 'Game 2'
        font_size: '32'
        background_color: 0, 0 ,0, 0
        size_hint_y: None
        height: '48dp'
        top: root.top / 1.66
        center_x: root.width / 4
        on_release: dropdown.select('C')

<Game1>:
    Button:
        id: tst
        text: 'Test'
        font_size: '32'
        background_color: 0, 0 ,0, 0
        size_hint_y: None
        height: '48dp'
        top: root.top
        center_x: root.width / 4

当用户点击游戏 1 时，我希望它跳转到游戏 1 类，但它不能，因为程序还不知道它存在。我不确定如何解决这个问题。

【参考方案1】：

您在谈论屏幕，但似乎并未使用实际的 kivy 屏幕。您需要有一个 ScreenManager，然后创建单独的 Screen 对象，您可以将小部件放在上面。

这是你google“kivy屏幕”时的第一个结果，请下次做功课。

这里有一个关于如何将现有代码转换为正确使用屏幕的快速教程。假设您有以下 .kv 代码：

<First@Button>:
    text: "I'm first"

<Second@Button>:
    text: "I'm second..."

您希望第一个按钮位于一个屏幕上，而第二个按钮位于另一个屏幕上。首先，将它们变成Screen。通常您只需将根小部件更改为屏幕并将所有其他小部件移动到屏幕中。该示例现在如下所示：

<First@Screen>:
    name: "first_screen" # a name is like an id but only for the screen manager
    Button:
        text: "I'm first"

<Second@Screen>:
    name: "second_screen"
    Button:
        text: "I'm second..."

您现在需要一个屏幕管理器。在其中，添加您要使用的所有屏幕。我将使它成为根小部件。我也会这样做，以便按下第一个屏幕上的按钮会更改为第二个屏幕，反之亦然：

ScreenManager:
    First:
    Second:

<First@Screen>:
    name: "first_screen"
    Button:
        text: "I'm first"
        # root.manager.current is magic that gives you the current screen manager
        on_release: root.manager.current = "second_screen"

<Second@Screen>:
    name: "second_screen"
    Button:
        on_release: root.manager.current = "first_screen"
        text: "I'm second..."

就是这样！您可以更改过渡类型和其他详细信息，请查看docs。

要查看此示例，请运行此 .py 文件：

from kivy.base import runTouchApp
from kivy.lang import Builder

runTouchApp(Builder.load_string("""
ScreenManager:
    First:
    Second:

<First@Screen>:
    name: "first_screen" # a name is like an id but only for the screen manager
    Button:
        text: "I'm first"
        # root.manager.current is magic that gives you the current screen manager
        on_release: root.manager.current = "second_screen"

<Second@Screen>:
    name: "second_screen"
    Button:
        on_release: root.manager.current = "first_screen"
        text: "I'm second..."   
            """))

【讨论】：

我不想使用文字屏幕。我只需要制作一个基本程序并希望它尽可能简单。我不是经验丰富的程序员，所以我不知道我应该使用的确切术语。

别担心，真的很简单。术语很简单：有一个 ScreenManager 小部件只能包含一个屏幕。然后是屏幕，它可以包含您已经拥有的任何小部件。看看一些examples。您无需更改任何代码，只需大约 10-15 行。卡住时回复。

谢谢。我想我会试一试。也许它会帮助我在下个学期使课程更加先进。

感谢您的帮助 Edvardas。它实际上相对简单，它让我可以更轻松地控制我的程序。

如果您使用刚刚学习的屏幕技术发布（例如在您的问题的附录中）解决方案的代码，这对其他新手 kivy 程序员（如我）肯定会有所帮助。