如何在Repeater内部的UI QML (QT)中显示列表中的值

我已经面对这个问题好几天了，还是没有得出结论，我希望有人能给我一些有用的提示来解决这个问题。

我将试着用一个例子来简化这个问题:

在我的c++代码中，我定义了将起作用的类MyObjectModel稍后在我的主ui中的Repeater块中作为模型。qml 文件。MyObjectModel对QQmlApplicationEngine可见。
• MyObjectModel 有两个属性(列表):xCoordinatesList和yCoordinatesList。它们表示点列表的x和y像素坐标。即xCoordinatesList = [100,200]， yCoordinatesList =[10,20]在逻辑上意味着我有2个点，我想在屏幕上显示以下像素坐标:(100,10)，(10,20)。

• xCoordinatesList和yCoordinatesList是我模型的Roles用于QML引擎。这意味着，例如，在一个共同的.qml文件可以清楚地打印xCoordinatesList的内容输入:

  Component.onCompleted
  {
      console.log("x coordinates: ",xCoordinatesList);
  }
  

问题是:我如何在屏幕上同时显示点的列表?

如果我只想显示一个点(所以一对坐标)，我的代码工作。我真的不知道如何扩展它，使它打印所有的。

在我的MainForm.ui。qml我定义了一个中继器在矩形:

Rectangle
 {
 ....
            Repeater
        {
            model: dotModel
             delegate:
                 DotItem
                 {
                 id: dotItem;
                 objectName: "dotItem";
                 DotPositionOnMap
                 {
                     id: dotPositionId;
                     objectWidth: dotItem.width;
                     objectHeight: dotItem.height;
                 }
                 x: dotPositionId.xPositionOnMap;
                 y: dotPositionId.yPositionOnMap;
                 }
         }
....
}

我需要一个中继器，因为MyObjectModel保存x和y坐标的两个列表可以随时间动态变化。dotModel只是我用于其他目的的假模型。DotItem是我的qml项目，它标识了我想在屏幕上为xCoordinatesList, yCoordinatesList中的每一对元素描绘的红点圆图像。

DotItem.ui.qml

import QtQuick 2.4
import QtQuick.Layouts 1.1
Item
{
    width:  10
    height: 10
    opacity: 1
    Image
    {
      id: dotItemImage
      anchors.fill: parent
      source: "red_dot.png"
    }   
}

red_dot.png图像应该显示在屏幕上描绘的每个点。

DotPositionOnMap。qml负责计算右x和y在屏幕上的像素位置。

import QtQuick 2.5
import "calcCurrentPos_script.js" as CurrentPos
Item
{
// Values filled from MainForm.ui.qml
property int objectWidth
property int objectHeight
// Getting current coordinates
// Fetching element 0 from both lists
property real currentx: CurrentPos.getCurrentxPoint(0);
property real currenty: CurrentPos.getCurrentyPoint(0);
// Generating the x and y pixel position on map.
// Toy example
property int xPositionOnMap : currentx-(objectWidth/2);
property int yPositionOnMap : currenty-(objectHeight/2);
}

, calcCurrentPos_script.js

function getCurrentxPoint(val)
{
    return xCoordinatesList[val];
}
function getCurrentyPoint(val)
{
    return yCoordinatesList[val];
}

这样我只能在屏幕上显示一个点，因为我在DotPositionOnMap中指定。qml指向读取:

// Fetching element 0 in this case
property real currentx: CurrentPos.getCurrentxPoint(0);
property real currenty: CurrentPos.getCurrentyPoint(0);

我使用javascript进行此尝试，因为我认为我可以使用for循环来扫描要显示的所有元素，但它不起作用。

我的模型的摘录

QVariant MyModelObject::data(const QModelIndex& index, int role) const
{
    const MyModelObject& object = objects.values().value(index.row());
    ....
    if(role == XRole)
    {
    QList<TrackPoint> tkrList = object.getList();
    QList<QVariant> tkrVariantList;
    for(auto track: trackpointList)
        {
        tkrVariantList.append(track.getPosition().getX());
        }
    return QVariant(tkrVariantList);
    }
    else if(role == YRole)
    {
    QList<TrackPoint> tkrList = object.getList();
    QList<QVariant> tkrVariantList;
    for(auto track: trackpointList)
        {
        tkrVariantList.append(track.getPosition().getY());
        }
    return QVariant(tkrVariantList);
    }
}
....
....
QHash<int, QByteArray> MyModelObject::roleNames() const
{
  QHash<int, QByteArray> roles;
  roles[XRole]        = "xCoordinatesList";
  roles[YRole]      = "yCoordinatesList";
  return roles;
}

我非常感谢任何关于这个实现泛化的想法。

谢谢