删除 QML ListView 中的间距

Posted 2023-02-16

【中文标题】删除 QML ListView 中的间距

【英文标题】：Removing spacing in QML ListView

【发布时间】：2021-05-23 19:43:05

【问题描述】：

鉴于此 QML：

ApplicationWindow 
   id: window
   width: 640
   height: 480
   visible: true
   color: "black"

   ListView 
      id: myView
      anchors.fill: parent

      model: [12, 12, 12, 12, 12, 12, 12, 12]
      delegate: ItemDelegate 
         width: parent.width

         contentItem: Rectangle 
            color: "blue"
         
      

      spacing: 0
   

列表视图或单个行将在它们周围呈现间距：

我怎样才能去掉这个间距？我需要的是相对于 ApplicationWindow 的列表视图周围没有边框，并且列表视图行之间的间距为 1px。

【参考方案1】：

您好像忘记提及委托项目的高度

ApplicationWindow  
id: window
width: 640
height: 480
visible: true
color: "black"

ListView 
    id: myView
    anchors.fill: parent

    model: [12, 12, 12, 12, 12, 12, 12, 12]
    delegate: ItemDelegate 
        width: parent.width
        height: 20
        contentItem: Rectangle 
            anchors.fill: parent
            color: "blue"
        
    

    spacing: 1

【参考方案2】：

我不确定您的ItemDelegate 有何意义，但根据您的描述，我认为您需要这样做：

ListView 
    id: myView
    
    anchors.fill: parent
    spacing: 1

    model: [12, 12, 12, 12, 12, 12, 12, 12]
    delegate: Rectangle 
            color: "blue"
            width: ListView.view.width
            height: modelData
    

【讨论】：

我还是 QML 的新手，我来自警报教程，它像这样完成doc.qt.io/qt-5/qtdoc-tutorials-alarms-alarmdelegate-qml.html 在本教程中，出现了相同的间距。在哪些情况下我想使用ItemDelegate 而不是任何其他项目？例如。突出显示功能？