Qml利用transform(自身属性)实现对象阵列

    技术2022-07-29  81

    Qml利用transform(自身属性)实现对象阵列

    import QtQuick 2.0 Item { id: item width: 64 height: 64 anchors.centerIn: parent Rectangle{ anchors.fill: parent color: "lightblue" } //阵列的矩形-6个 Repeater { id: repeater model: 6 Rectangle { x: item.width / 2 - width / 2 y: item.height / 2 - height / 2 implicitWidth: 10 implicitHeight: 10 radius: 5 color: "red" //通过过渡实现阵列-支持动画和简单变换 transform: [ //平移 Translate { y: -Math.min(item.width, item.height) * 0.5 + 5 }, //旋转 Rotation { angle: index / repeater.count * 360 origin.x: 5 origin.y: 5 } ] } } }

    结果如下图:

     

    Processed: 0.014, SQL: 9