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

KivyMD中MDExpansionPanel加载JSON数据时内容出现多余行如何解决

问题原因

多余无效行来自自定义组件的默认渲染逻辑:

  • 你在KV中给ClassDetails绑定了默认的OneLineIconListItem子项,当你创建cd = ClassDetails()作为MDExpansionPanel的内容容器时,没有给这个实例传入text属性值,这个默认子项就会渲染成无文字的空行,也就是你看到的多余无效行。
  • 同时明细行的循环逻辑存在错误:遍历class_details.items()时,传入的文本是整个class_details.values()的全量值,会导致每个面板下的所有明细行重复展示该条发票的全部字段内容。
修复方案

把面板内容容器和单条明细行拆分为两个独立组件:容器仅保留垂直自适应布局属性,不带默认列表项子组件;修正循环逻辑,逐个传入单个字段的键值作为明细行文本。

修正后的完整可运行代码:

from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.boxlayout import MDBoxLayout
from kivymd.uix.expansionpanel import MDExpansionPanel, MDExpansionPanelOneLine
from kivymd.uix.list import OneLineIconListItem
from kivy.properties import StringProperty, ObjectProperty


json_data = {'01001BA476': {'price': '74.73',
                            'product_code': '000003',
                            'quantity': '100'},
             '0100251633': {'price': '92.07',
                            'product_code': '000156',
                            'quantity': '1000'}}


KV = '''
<DetailsContentContainer>
    orientation: 'vertical'
    adaptive_height: True

<DetailLineItem>
    IconLeftWidget:
        icon: 'star'
        on_press: print(f'star pressed on line: {root.text}')

ScrollView:
    MDGridLayout:
        id: box
        cols: 1
        adaptive_height: True
'''


# 面板内容容器,仅做布局承载,不带默认列表项
class DetailsContentContainer(MDBoxLayout):
    pass

# 单条明细行,自带点击事件和左侧图标
class DetailLineItem(OneLineIconListItem):
    action = ObjectProperty()
    def on_press(self):
        if self.action:
            self.action()

class InvoicePanel(MDExpansionPanel):
    pass

class Test(MDApp):
    def build(self):
        return Builder.load_string(KV)

    def fechar_pedido(self):
        print('You clicked on the information line')

    def on_start(self):
        for class_title, class_details in json_data.items():
            content_container = DetailsContentContainer()
            expansion_panel = InvoicePanel(
                panel_cls=MDExpansionPanelOneLine(text=f'Invoice #: {class_title}'), 
                content=content_container
            )
            self.root.ids.box.add_widget(expansion_panel)

            # 逐字段添加明细行
            for field_name, field_value in class_details.items():
                line_text = f"{field_name}: {field_value}"
                content_container.add_widget(DetailLineItem(
                    text=line_text, 
                    action=self.fechar_pedido
                ))

Test().run()
修复效果
  • 展开面板后不会再出现空的无效行
  • 每个明细行单独展示对应字段的名称和值,不会重复展示全量内容
  • 完整保留原有的行点击、星标按钮点击交互逻辑

内容的提问来源于stack exchange,提问作者Elias Coutinho

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.08.28 17:51:24