Question

我有QML ListView，它通过 UeCustomerModel 向数据库显示客户。客户通过MySQL声明在模型中排序。一切正常，但现在我想将sections添加到ListView，因此客户按照首字母标准按部分排序。这是我的ListView：

ListView
{
    id: ueCustomersListView

    Layout.fillWidth: true
    Layout.fillHeight: true
    Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom
    Layout.margins: 8

    clip: true

    spacing: 8

    delegate: UeCustomerSelectorDelegate
    {
        ueParamWidth: ueCustomersListView.width
        ueParamHeight: 128

        ueParamImage: "image://ueCustomerModel/"+model.ueRoleImage
        ueParamName: model.ueRoleCustomerName
        ueParamTaxId: model.ueRoleCustomerTaxId
        ueParamCurrentDebt: model.ueRoleCustomerCurrDebt
        ueParamMaxDebt: model.ueRoleCustomerMaxDebt
    }   // delegate

    section.property: model.ueRoleCustomerName // HERE RUNTIME ERROR OCCURS
    section.criteria: ViewSection.FirstCharacter
    section.delegate: UeCustomerSelectorSectionDelegate
    {
        ueParamWidth: ueCustomersListView.width
        ueParamHeight: 128

        ueParamName: section
    }   // section.delegate

    Component.onCompleted:
    {
        model=ueCustomerModel;
    }   // Component.onCompleted
}   // ListView

这是部门代表：

import QtQuick 2.5
import QtQuick.Layouts 1.1

Rectangle
{
    property int ueParamWidth
    property int ueParamHeight
    property string ueParamName

    width: ueParamWidth
    height: ueParamHeight

    color: "#4682b4"

    antialiasing: true
    smooth: true

    RowLayout
    {
        anchors.fill: parent
        anchors.margins: 8

        spacing: 8

        Text
        {
            color: "#ffffff"

            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter

            antialiasing: true

            text: ueParamName

            font.family: "Courier"
            font.bold: true
            font.pointSize: 12

            clip: true

            textFormat: Text.RichText

            verticalAlignment: Text.AlignVCenter
            horizontalAlignment: Text.AlignHCenter
        }   // Text
    }   // RowLayout
}   // Rectangle

现在，当显示ListView时，没有可见的部分。我错过了什么，即如何更正section.property: model.ueRoleCustomerName语句以获取客户的字母（A，B，C，...）。我希望ListView根据客户名称（通过模型从数据库提供）第一个字母来分区delegates。此外，在提到的代码行中，我得到QML运行时错误Unable to assign [undefined] to QString。为什么呢？

P.S。：模型完美运行（速度快，可以使用TextField搜索客户），我已经测试了5次。

根据用户sk2212 的提示，我已将代码升级为：

    section.property: "ueParamName"
    section.criteria: ViewSection.FirstCharacter
    section.delegate: UeCustomerSelectorSectionDelegate
    {
        ueParamWidth: ueCustomersListView.width/2
        ueParamHeight: ueCustomersListView.height/4

        ueParamName: model.ueRoleCustomerName.subString(0,1)
    }   // section.delegate

这是第delegate节：

import QtQuick 2.5
import QtQuick.Layouts 1.1

Rectangle
{
    property int ueParamWidth
    property int ueParamHeight
    property string ueParamName

    width: ueParamWidth
    height: ueParamHeight

    color: "#4682b4"

    antialiasing: true
    smooth: true

    RowLayout
    {
        anchors.fill: parent
        anchors.margins: 8

        spacing: 8

        Text
        {
            color: "#ffffff"

            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.alignment: Qt.AlignHCenter|Qt.AlignVCenter

            antialiasing: true

            text: ueParamName

            font.family: "Courier"
            font.bold: true
            font.pointSize: 12

            clip: true

            textFormat: Text.RichText

            verticalAlignment: Text.AlignVCenter
            horizontalAlignment: Text.AlignHCenter
        }   // Text
    }   // RowLayout
}   // Rectangle

仍然无效。

Answer 1

您必须使用section.property作为模型数据元素：

delegate: UeCustomerSelectorDelegate
{
    ueParamWidth: ueCustomersListView.width
    ueParamHeight: 128

    ueParamImage: "image://ueCustomerModel/"+model.ueRoleImage
    ueParamName: model.ueRoleCustomerName
    ueParamTaxId: model.ueRoleCustomerTaxId
    ueParamCurrentDebt: model.ueRoleCustomerCurrDebt
    ueParamMaxDebt: model.ueRoleCustomerMaxDebt
    alphabet: model.ueRoleCustomerName.substring(0,1)
}   // delegate

section.property: "alphabet"

QML ListView包含代表模型名称角色的第一个字母的部分 - 部分不可见

1 个答案: