Qt Quick QML 自定义 ComboBox 弹出窗口

Question

我正在尝试自定义 QML 2.14 ComboBox。
我确实遵循了以下 link 但我无法自定义 ComboBox -> Popup -> ListView -> "delegate"
https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-combobox

我希望 ComboBox 弹出窗口中显示的列表项具有不同的文本颜色。

ComboBox {
   id: myComboBox
   model: ["First", "Second", "Third"]

   popup: Popup {
      y: myComboBox.height - 1
      width: parent.width
      implicitHeight: contentItem.implicitHeight
 
      contentItem: ListView {
          clip: true
          anchors.fill: parent
          model: myComboBox.popup.visible ? myComboBox.delegateModel : null
          ScrollIndicator.vertical: ScrollIndicator {}

          delegate: Text {
              width: parent.width
              height: 30
              text: "Test" // How to access flat model, modelData is null and model.get(index) is not allowed in .ui.qml  
              color: "#ffffff"
              anchors.horizontalCenter: parent.horizontalCenter
              anchors.left: parent.left
          }

          highlight: Rectangle { color: "yellow" } 
      }
   }
}

但我总是在组合框弹出窗口中看到一些带有黑色文本的默认列表。
也无法将突出显示应用于弹出窗口中的选定行。

Answer 1

Combobox 的模型是 DelegateModel。这意味着代表附加到模型。所以尝试设置 ListView 的委托不会有任何效果。但是 Combobox 有自己的 delegate 属性可以设置。

ComboBox {
    delegate: Text {
        width: parent.width
        height: 30
        text: modelData
        color: "#ffffff"
        anchors.horizontalCenter: parent.horizontalCenter
    }
}

Qt Quick QML 自定义 ComboBox 弹出窗口

Qt Quick QML Customize ComboBox Popup

qt

combobox

qml

qtquick2