如何在QML中实现多值循环切换？

这里给你两种实用的实现方式，按需选择：

方法一：固定值场景的极简实现 #

适合值的数量固定且不会频繁修改的情况，直接用取模运算完成循环逻辑：

import QtQuick 2.15

Rectangle {
    width: 200
    height: 200
    color: "lightblue"

    // 定义循环变量，初始值设为1
    property int Counter: 1

    Text {
        anchors.centerIn: parent
        text: "当前值: " + Counter
        font.pixelSize: 24
    }

    // 绑定鼠标点击事件处理循环切换
    MouseArea {
        anchors.fill: parent
        onClicked: {
            // 核心逻辑：1→2→3→1循环
            Counter = Counter % 3 + 1
        }
    }
}

原理：Counter % 3会得到0、1、2，加1后正好对应1、2、3，完成循环切换。

方法二：可扩展的列表式实现 #

如果后续需要增加更多循环值，用数组存储值+索引跟踪的方式更灵活：

import QtQuick 2.15

Rectangle {
    width: 200
    height: 200
    color: "lightgreen"

    // 存储所有要循环的值，后续直接添加元素即可扩展
    property var cycleValues: [1, 2, 3]
    // 当前值的索引，初始指向第一个元素
    property int currentIndex: 0
    // 动态绑定当前Counter值
    property int Counter: cycleValues[currentIndex]

    Text {
        anchors.centerIn: parent
        text: "当前值: " + Counter
        font.pixelSize: 24
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            // 索引自增，超出数组长度则重置为0
            currentIndex = (currentIndex + 1) % cycleValues.length
            // Counter会自动更新，因为它绑定了cycleValues[currentIndex]
        }
    }
}

优势：以后要加4、5这类新值，只需要在cycleValues数组里追加元素，不需要修改循环逻辑。

内容的提问来源于stack exchange，提问作者Pascal Achtel