You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

添加ScreenManager后MDCard重叠MDTextField,如何无需固定坐标将MDCard设为背景

问题根本原因

你当前出现重叠不是层级问题,是MDLabel的padding_y: 800配置错误导致的:你的MDCard总高度才900,给Label设置800的垂直padding后,Label本身的高度加上超大padding会直接把下方的MDTextField挤出Card的可视范围,超出容器的组件就会和其他层级的元素发生重叠。

解决方案

  • 首先删除MDLabel下的padding_y: 800配置,改用MDCard的spacing属性调整内部组件的垂直间距,既不会破坏布局流,也能适配不同尺寸的屏幕。
  • 如果你确实需要将MDCard调整到背景层,Kivy中可以通过两种方式实现:
    1. 调整组件书写顺序:同层级的组件,先写的组件会被绘制在底层,后写的在上层,把MDCard的定义放在同层级其他组件之前即可。
    2. 显式设置zindex属性:给MDCard添加zindex: 0,需要显示在上层的组件设置zindex: 1,数值越小层级越靠下。

修正后的kv代码示例

MDCard:
    #### Card config
    size_hint: None, None
    size: 600, 900
    pos_hint: {"center_x": 0.5, "center_y": 0.5}
    elevation: 10
    padding: 25
    spacing: 80
    orientation: 'vertical'

    #### Label - Welcome
    MDLabel:
        id: welcome_label
        text: "WELCOME"
        font_size: 100
        halign: 'center'
        size_hint_y: None
        height: self.texture_size[1]

    #### Textfield - IP-Address
    MDTextField:
        id: ip_address
        hint_text: "IP-Address"
        icon_right: "lan-connect"
        size_hint_x: None
        width: 400
        font_size: 40
        pos_hint: {"center_x": 0.5}

内容的提问来源于stack exchange,提问作者6-Legged Terror

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.04 03:54:02