QML - canvas.requestPaintすることができません（）関数から

Question

私はbeginerと私は私のQMLでcanvas.requestPaint（）を呼び出す方法を得ていないのですが、コードは以下の通りです：

//myTab.qml私はonCurrentIndexChangedに使用しようとすると

TabView { 
    id: tv 
    width: parent.width 
    height: parent.height 
    antialiasing: true 

    style: TabViewStyle { 
     frameOverlap: -1 

     tab: Rectangle {    
      color: "Transparent" 
      implicitWidth: text1.width + 50 
      implicitHeight: 20 
      radius: 2 
      smooth: true 
      Canvas { 
       id: canvas1 
       anchors.fill: parent 
       width: parent.width 
       height: parent.height 
       onPaint: { 
        styleData.selected ? drawTab(canvas1,"#0C3142") : 
             drawTab(canvas1,"Transparent") //Some custom JS function to draw a object 
       }     

       Text { 
        id: text1 
        height: parent.height 
        verticalAlignment: Text.AlignVCenter 
        anchors.left : parent.left 
        anchors.leftMargin: 15 
        text: styleData.title 
        color: "white" 
       } 
      } 
     } 

     frame: Rectangle { 
      width: parent.width 
      height: parent.height 
      color: "Transparent" 
      border.color:"white" 
     } 
     tabBar: Rectangle { 
      color: "Transparent" 
      anchors.fill: parent 
     } 
    } 

    Tab { 
     id: tab1 
     title: "Tab1" 
    } 
    Tab{ 
     id: tab2 
     title: "Tab2" 
    } 

    onCurrentIndexChanged: { 
     console.log("index changed "+currentIndex) 
     canvas1.repaint() //ERRROR - not defind canvas1 
    } 
} 

、私は次のエラーを取得しています：提案

ReferenceError: canvas1 is not defined.

してください。

Answer 1

タブスタイルがComponentであるため、TabViewではIDが必ずしも一意であるとは限らないため、canvas1のIDは別のスコープにあります。それは複数回インスタンス化されるかもしれません。

私はTabViewの経験がほとんどないので、別の解決方法があるかもしれません。私はしかし、信号を宣言する：refreshTabView私は再描画するたびに、私はトリガーします。

それからrepaint

例を実行するために、このsignalに接続する内CanvasをConnections -element を使用したい：

TabView { 
    id: tv 
    width: parent.width 
    height: parent.height 
    antialiasing: true 

    signal refresh // *** DEFINE SIGNAL HERE 

    style: TabViewStyle { 
     frameOverlap: -1 

     tab: Rectangle { 
      color: "Transparent" 
      implicitWidth: text1.width + 50 
      implicitHeight: 20 
      radius: 2 
      smooth: true 
      Canvas { 
       id: canvas1 
       anchors.fill: parent 
       width: parent.width 
       height: parent.height 
       onPaint: { 
        styleData.selected ? drawTab(canvas1,"#0C3142") : 
             drawTab(canvas1,"Transparent") //Some custom JS function to draw a object 
       } 

       function drawTab() { // *** I DONT KNOW WHAT SHOULD BE DONE HERE 
        console.log('do nothing') 
       } 

       // *** CONNECT TO SIGNAL HERE *** 
       Connections { 
        target: tv 
        onRefresh: canvas1.requestPaint() // *** repaint is not a function. 
       } 

       Text { 
        id: text1 
        height: parent.height 
        verticalAlignment: Text.AlignVCenter 
        anchors.left : parent.left 
        anchors.leftMargin: 15 
        text: styleData.title 
        color: "white" 
       } 
      } 
     } 

     frame: Rectangle { 
      width: parent.width 
      height: parent.height 
      color: "Transparent" 
      border.color:"white" 
     } 
     tabBar: Rectangle { 
      color: "Transparent" 
      anchors.fill: parent 
     } 
    } 

    Tab { 
     id: tab1 
     title: "Tab1" 
    } 
    Tab{ 
     id: tab2 
     title: "Tab2" 
    } 

    onCurrentIndexChanged: { 
     console.log("index changed "+currentIndex) 
     refresh() // *** INVOKE SIGNAL HERE 
    } 
}