QML XmlListModel混亂委託排序時

Question

我試圖讓Canvas畫線以相同的順序在此xml文件提出：

<root> 
<doc><nopeus>80.0</nopeus><aika>40.0</aika></doc> 
<doc><nopeus>110.0</nopeus><aika>80.0</aika></doc> 
<doc><nopeus>120.0</nopeus><aika>120.0</aika></doc> 
<doc><nopeus>190.0</nopeus><aika>160.0</aika></doc><doc><nopeus>243.0</nopeus><aika>200.0</aika></doc><doc><nopeus>260.0</nopeus><aika>240.0</aika></doc><doc><nopeus>300.0</nopeus><aika>280.0</aika></doc><doc><nopeus>350.0</nopeus><aika>320.0</aika></doc> 
</root> 

QML文件與XmlListModel：

import QtQuick 2.0 
import Sailfish.Silica 1.0 
import QtQuick.XmlListModel 2.0 

Page { 
    id: page 
    property alias startx : coords.mX 
    property alias starty : coords.mY 

    Item { 
     id: coords 
     property int mX: 0 
     property int mY: 0 
    } 

    XmlListModel { 
     id: myxml 
     source: "/home/nemo/filename.xml" 
     query: "/root/doc" 
     XmlRole { name: "nopeus"; query: "nopeus/string()" } 
     XmlRole { name: "aika"; query: "aika/string()" } 
    } 

    ListView { 
     model: myxml 
     anchors.fill: page 
     delegate: 
      Item { 
       Chart { 
        xc: coords.mX; 
        yc: coords.mY; 
        xd: aika; 
        yd: nopeus; 
       } 
      } 
    } 
} 

Chart.qml：

import QtQuick 2.0 

Rectangle { 
    id: myrect 
    width: 540 
    height: 960 
    color: "transparent" 

    property int xd: 0 
    property int yd: 0 
    property int xc: 0 
    property int yc: 0 

    Canvas { 
     id: mycanvas 
     width: myrect.width; height: myrect.height; 
     onPaint: { 
       var context = getContext('2d') 
       context.strokeStyle = "#FF0000" 
       context.lineWidth = 2 
       context.beginPath() 
       context.moveTo(xc,yc) 
       context.lineTo(xd,yd) 
       context.stroke() 
       startx = xd 
       starty = yd    
     } 
    } 
} 

的問題是，爲什麼是生成的路徑在插入時搞砸通過代表？我試圖通過函數和另一個ListModel分別對路徑項進行排序，但結果是相同的。

下面是截圖：

Answer 1

代表們對每個項的模型創建的。您的模型包含八個項目（截至您的輸入）。因此，您創建了八個Canvas es（每個作爲ListView項目，即在（理論上）增加y w.r.t. ListView原點座標）。

將這些問題與（可能錯誤地設置的）出發點結合起來......並且你會得到一個隨機的混亂！您看不到這一點，因爲由於組件上設置的大小/約束條件而導致Canvas傾向於重疊。

在這種情況下，您只需要一個Canvas其上每個myxml項目被繪。這裏是你的代碼的（幼稚）適應它正確地顯示存儲在XML文件的路徑：

// main.qml 
import QtQuick 2.4 
import QtQuick.Window 2.2 
import QtQuick.XmlListModel 2.0 

Window { 
    visible: true 
    width: 600 
    height: 600 

    XmlListModel { 
     id: myxml 
     source: "qrc:/filename.xml" // added to the resources 
     query: "/root/doc" 
     XmlRole { name: "nopeus"; query: "nopeus/string()" } 
     XmlRole { name: "aika"; query: "aika/string()" } 
     onStatusChanged: { 
      if(status === XmlListModel.Ready) 
       comp.mod = myxml // set the model ASA it is ready to be used 
     } 
    } 

    Chart { 
     id: comp 
     anchors.fill: parent 
     mod: myxml 
    } 
} 

// Chart.qml 
import QtQuick 2.4 
import QtQuick.XmlListModel 2.0 

Item { 
    property var mod: undefined 

    onModChanged: { 
     if(mod) 
      mycanvas.requestPaint() // repaint only when the model is available 
    } 

    Canvas { 
     id: mycanvas 
     width: parent.width; height: parent.height; 
     onPaint: { 
      var context = getContext('2d') 
      context.strokeStyle = "#FF0000" 
      context.lineWidth = 2 
      context.beginPath() 
      context.moveTo(0,0) 
      // iterate over all the point to print them 
      for(var i = 0; i < mod.count; i++) 
      { 
       var point = mod.get(i) 
       context.lineTo(point.aika, point.nopeus) 
      } 
      context.stroke() 
     } 
    } 
} 

生成的路徑呈現：