GridView And highlight

来源：互联网发布：java软件工程师学习班编辑：程序博客网时间：2024/06/05 01:08

这里写图片描述

//表格布局    GridView{        id:grid;        width: parent.width;        height: parent.height*0.5;        delegate: GridDelegate{}        model: GridModel{}        highlightFollowsCurrentItem: true;        highlight:Rectangle{         opacity: 0.5         //如果不设置x y  不会触发Behavior on x/y         x: grid.currentItem.x         y: grid.currentItem.y         z:1         color: "lightsteelblue";         radius: height/2;         Behavior on x {          SpringAnimation{ spring: 3; damping: 0.1 ;duration: 1000}         }         Behavior on y {             SpringAnimation { spring: 3; damping: 0.2 }         }        }        cellWidth: 80;        cellHeight: 80;        focus: true;         clip: true;    }

//GridDelegateimport QtQuick 2.7import QtQuick.Controls 2.0import QtQuick.Layouts 1.0import QtQuick.Layouts 1.1import QtQuick.Window 2.0import QtQuick.Controls.Material 2.0import QtQuick.Controls.Universal 2.0Item {    //由于是GridView 中  GridView中设置了cellWidth 但是并不代表当前有了默认尺寸 因此手动设置//    width: 80;height: 80;   width: grid.cellWidth; height: grid.cellHeight    Rectangle{       color: Material.color(Material.Purple);        border.color:  Material.color(Material.DeepPurple);        anchors.fill: parent;        Text{            text:model.title;            color: Material.color(Material.Blue);            anchors.centerIn: parent;        }    }    MouseArea {        anchors.fill: parent        //高亮会根据currentIndex而改变 但是默认的GridView不会捕捉鼠标点击 因此要自己设置curindex        onClicked: grid.currentIndex = index/* parent.GridView.view.currentIndex = index*/    }}

//GridModelimport QtQuick 2.0ListModel{    ListElement{            title:"菜单1";    }    ListElement{            title:"菜单2";    }    ListElement{            title:"菜单3";    }    ListElement{            title:"菜单4";    }    ListElement{            title:"菜单5";    }    ListElement{            title:"菜单6";    }}

0 0