qml 实现一个带动画的switch 按钮

一.效果图

      ====》

二.qml 代码

import QtQuick 2.12
import QtQuick.Controls 2.12Switch {id: controlimplicitWidth: 42implicitHeight: 20indicator: Rectangle {id: bkRectangleanchors.fill: parentx: control.leftPaddingy: parent.height / 2 - height / 2radius: height / 2color: control.checked ? "#3986FF" : "#D9D9D9"Rectangle {id : smallRectwidth: 14height: 14radius: height / 2color: "white"anchors.verticalCenter: parent.verticalCenterNumberAnimation on x{to: bkRectangle.width - smallRect.width - 3running: control.checked ? true : falseduration: 80}NumberAnimation on x{to: 3running: control.checked ? false : trueduration: 80}}}
}