Question

我有QtQuick 1.0
我使用以下代码：

Rectangle {   
    Component {   
        id: appDelegate
        MouseArea{
            id:myMouseArea
            hoverEnabled: true
            onClicked:{
               onClicked: load.source = page;                    
            }
        }
        Loader { 
            id: load
        }
    }
    GridView {
        id: view

        // I am unable to access myMouseArea here.
        highlight: myMouseArea.containsMouse ? appHighlight : !appHighlight  
        delegate: appDelegate
    }
}

它给了我以下错误：

ReferenceError: Can't find variable: myMouseArea /usr/lib/i386-linux-gnu/qt4/bin/qmlviewer exited with code 0

我不知道我提供的详细信息是否足够，如果我遗漏了其他任何内容，请告诉我。

我使用此代码作为示例：
http://docs.knobbits.org/qt4/declarative-modelviews-gridview-qml-gridview-example-gridview-example-qml.html

Answer 1

您无法访问myMouseArea，因为它是在委托上下文中创建的。您无法访问currentItem以外的委托。但您可以在委托的上下文中自由访问view，将currentIndex设置为附加属性index。

这是更正后的代码：

Rectangle {
    width: 360
    height: 360

    Component { // It must be a component, if we want use it as delegate
        id: appDelegate

        // its not possible to have more than one element inside component
        Rectangle  
        {
            // need to set size of item, anchors wont work here
            // could use view.cellWidth and view.cellHeight to keep it DRY
            width: 96
            height: 66

            color: "green" // color only to see the place of MouseArea

            MouseArea {
                id:myMouseArea
                anchors.fill: parent // this setup the size to whole rectangle
                // it this item have the size 0,0 it will simple do not work
                hoverEnabled: true

                onEntered: {
                    // we know the mouse is inside this region
                    // setting this value will show the highlight rectangle
                    view.currentIndex = index;
                }

                onClicked:{
                   onClicked: load.source = page;
                }

            }
            Loader {
                // this is not needed but it's wise to not keep zero size
                anchors.fill: parent 
                id: load
            }
        }
    }
    GridView {
        id: view

        // the size of GridView must be set,
        //   as otherwise no delegate will not show  
        anchors.fill:  parent
        anchors.margins: 5

        cellWidth: 100
        cellHeight: 70

        // Rectangle will act as a border.
        //  Size and position is set by GridView 
        //  to the size and position of currentItem.
        // This is no a item, this makes a Component
        //   as highlight property needs one.
        // You can create a Component like appDelegate.
        highlight : Rectangle {
            border.width: 2
            border.color: "blue"
        }

        // some ListModel to setup the page variable inside delegate context
        model: ListModel {
             ListElement { page: "test1.qml"; }
             ListElement { page: "test2.qml"; }
             ListElement { page: "test3.qml"; }
         }

        delegate: appDelegate
    }
}

无法全局访问QML变量/ id

1 个答案: