版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/chyuanrufeng/article/details/82664264
网页中有很多的左右滑动的图片轮动的效果。QML实现此效果的两种方式。
PageIndicator和TabBar 也对应两种样式。
其中左右滑动的动画效果是利用SwipeView的默认切换动画效果
import QtQuick 2.9 import QtQuick.Controls 2.2 ApplicationWindow { visible= true width= 640 height= 480 title= qsTr("图片切换") SwipeView { id= swipeView anchors.fill= parent currentIndex= indicator.currentIndex Rectangle{ Image { //id= name source= "./img/0.jpg" anchors.fill= parent } } Rectangle{ Image { //id= name source= "./img/1.jpg" anchors.fill= parent } } Rectangle{ Image { //id= name source= "./img/2.jpg" anchors.fill= parent } } Rectangle{ Image { //id= name source= "./img/3.jpg" anchors.fill= parent } } } //方法1 PageIndicator { id= indicator count= swipeView.count currentIndex= swipeView.currentIndex interactive= true //可以点击 anchors.bottom= swipeView.bottom anchors.horizontalCenter= parent.horizontalCenter } //方法2 // TabBar { // id= indicator // currentIndex= swipeView.currentIndex // anchors.bottom= parent.bottom // anchors.right= parent.right // width= 400 // opacity = 0.5 // TabButton { // text= qsTr("Page 1") // } // TabButton { // text= qsTr("Page 2") // } // TabButton { // text= qsTr("Page3") // } // TabButton { // text= qsTr("Page 4") // } // } }