Kivy项目页面添加图片仅显示白屏，寻求解决方法

核心问题 #

1. KV规则与类名不匹配：类名为Fenster16（首字母大写），但KV语言中定义的是<fenster16>（全小写），Kivy对类名大小写敏感，导致KV布局未被应用到对应Screen。
2. 图片未指定源路径：已加载的KV规则中，Image组件缺少source属性，导致显示空白。
3. 重复无效代码：代码末尾的两个<fenster16>块未通过Builder.load_string加载，完全无效。
4. 布局尺寸未明确：BoxLayout未设置填充屏幕的尺寸，可能导致组件显示异常。

修复后的完整代码 #

import kivy
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.properties import StringProperty
from kivy.properties import ObjectProperty
from kivy.uix.popup import Popup
from kivy.uix.label import Label
from kivy.core.window import Window
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.image import Image
from kivy.uix.boxlayout import BoxLayout

Window.size = (1000,700)

Builder.load_string("""

<Login>
    ben: benName.text
    pw: passwort.text
    knopf: btn
    GridLayout:
        cols: 1
        size: root.width, root.height

        GridLayout:
            cols: 2
            Label:
                text: "Benutzername:"
                font_size: 30

            TextInput
                id: benName
                multiline: False
                font_size: 30

            Label:
                text: "Passwort:"
                font_size: 30

            TextInput:
                password: True
                multiline: False
                id: passwort
                font_size: 30

        Button:
            text: "Anmelden"
            id: btn
            size_hint: (1.,0.3)
            font_size: 30
            on_release:
                root.loginPopup()

        GridLayout:
            cols: 3
            spacing: 10
            padding: 10

            Button:
                text: "1"
                font_size: 30
                on_release:
                    root.manager.current = "fenster11"
                    root.manager.transition.direction = "left"

            Button:
                text: "2"
                font_size: 30
                on_release:
                    root.manager.current = "fenster12"
                    root.manager.transition.direction = "left"

            Button:
                text: "3"
                font_size: 30
                on_release:
                    root.manager.current = "fenster13"
                    root.manager.transition.direction = "left"

            Button:
                text: "4"
                font_size: 30
                on_release:
                    root.manager.current = "fenster14"
                    root.manager.transition.direction = "left"

            Button:
                text: "5"
                font_size: 30
                on_release:
                    root.manager.current = "fenster15"
                    root.manager.transition.direction = "left"

            Button:
                text: "6"
                font_size: 30
                on_release:
                    root.manager.current = "fenster16"
                    root.manager.transition.direction = "left"

""")

class Login(Screen):
    ben = StringProperty()
    pw = StringProperty()
    knopf = ObjectProperty()
    def loginPopup(self):
        if self.ben == "" or self.pw == "":
            popup = Popup(title ='Fehler',
            content = Label(text="Es wurde kein Passwort oder Benutzername angegeben"),
            size_hint=(None,None),size=(400,400))
            popup.open()
        if self.ben == "Name" and self.pw == "Passwort":
                self.knopf.background_color = [0.,1.,0.,1.]
        else:
                self.knopf.background_color = [1.,0.,0.,1.]

class geheimerBereich(Screen):
    pass

class weitereInformationen(Screen):
    pass
class Fenster11(Screen):
    pass

class Fenster12(Screen):
    pass

class Fenster13(Screen):
    pass

class Fenster14(Screen):
    pass

class Fenster15(Screen):
    pass

class Fenster16(Screen):
    pass

class Fenster17(Screen):
    pass

class Fenster18(Screen):
    pass

class Fenster19(Screen):
    pass

class Fenster20(Screen):
    pass

Builder.load_string("""
<weitereInformationen>
    BoxLayout:
        orientation: "vertical"
        Label:
            text: "Weitere Informationen"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster11"
                root.manager.transition.direction = "right"
""")

Builder.load_string("""
<Fenster11>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        Label:
            text: "Fenster 11"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster12"
                root.manager.transition.direction = "left"
""")

Builder.load_string("""

<Fenster12>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        Label:
            text: "Fenster 12"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster13"
                root.manager.transition.direction = "left"
                
<Fenster13>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        Label:
            text: "Fenster 13"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster14"
                root.manager.transition.direction = "left"    
                
<Fenster14>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        Label:
            text: "Fenster 14"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster15"
                root.manager.transition.direction = "left"   
                
<Fenster15>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        Label:
            text: "Fenster 15"
            font_size: 30
        Button:
            text: "weiter"
            font_size: 30
            on_release:
                root.manager.current = "fenster16"
                root.manager.transition.direction = "left"    
                
<Fenster16>
    BoxLayout:
        orientation: "vertical"
        size: root.width, root.height
        
        Image:
            source: 'venv/IMG/EXTIN.jpg'  # 替换为你的图片实际路径
            allow_stretch: True
            keep_ratio: True
            size_hint_y: 0.8  # 图片占据80%屏幕高度
        
        Button:
            text: "weiter"
            font_size: 30
            size_hint_y: 0.2  # 按钮占据20%屏幕高度
            on_release:
                root.manager.current = "login"
                root.manager.transition.direction = "left" 
""")

ms = ScreenManager()
ms.add_widget(Login(name='login'))
ms.add_widget(geheimerBereich(name='geheim'))
ms.add_widget(weitereInformationen(name='weitere_infos'))
ms.add_widget(Fenster11(name='fenster11'))
ms.add_widget(Fenster12(name='fenster12'))
ms.add_widget(Fenster13(name='fenster13'))
ms.add_widget(Fenster14(name='fenster14'))
ms.add_widget(Fenster15(name='fenster15'))
ms.add_widget(Fenster16(name='fenster16'))
ms.add_widget(Fenster17(name='fenster17'))
ms.add_widget(Fenster18(name='fenster18'))
ms.add_widget(Fenster19(name='fenster19'))
ms.add_widget(Fenster20(name='fenster20'))

class StartApp(App):
    def build(self):
        return ms

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

关键修复点说明 #

• 类名与KV规则匹配：所有Screen类的KV规则改为首字母大写（如<Fenster16>），确保Kivy正确关联类与布局。
• 图片路径设置：给Image组件添加source属性，填入你的图片实际路径（相对路径以主Python文件为基准）。
• 布局尺寸优化：给每个BoxLayout添加size: root.width, root.height，确保填充整个屏幕；通过size_hint_y控制图片和按钮的空间占比。
• 清理冗余代码：移除未加载的KV块和未使用的CustomLayout代码。

额外注意事项 #

• 建议将图片放在项目根目录的独立资源文件夹（如IMG），避免使用虚拟环境目录（venv）存放资源。
• 确认图片格式为Kivy支持的类型（PNG、JPG等），且文件未损坏。

内容的提问来源于stack exchange，提问作者NEWDEV00