
目录最终效果拆开讲讲背景和圆点弹性滑动两种交互方式几个可以调的参数什么时候用小结完整代码工程下载上一篇做了进度填充按钮,这篇做另一个 iOS 风格的滑动开关。这个自定义按钮支持点击切换,松手时能够自动就近吸附,圆圈滑动用SpringAnimation实现了一个过冲回弹的动画效果,同时将背景色做平滑过渡处理。最终效果点击整个按钮区域都能触发滑动效果,滑动时有轻微过冲回弹,背景色从灰到绿平滑过渡。下方显示 ON/OFF 状态。示例里展示了两个开关,一个绿色、一个紫色。拆开讲讲没有用QtQuick.Controls的Switch组件,采用Item+Rectangle+MouseArea从零构建,这样做能够完全控制动画细节。此自定义组件分为三层结构,背景圆角矩形、白色圆圈、两个 MouseArea(一个处理整块点击,一个处理圆点拖拽)。背景和圆点Rectangle { id: toggle1Bg anchors.fill: parent radius: height / 2 color: toggle1.checked ? "#2