QML控件大全之QmloverFlow

import QtQuick 2.0
import "./"
Rectangle {
    id: coverFlow
    color:"black"

    property ListModel model
    property int itemCount: 5

    PathView{
        id: pathView

        model: coverFlow.model
        delegate: MyDelegate{}

        path: coverFlowPath
        pathItemCount: coverFlow.itemCount
        anchors.fill: parent

        preferredHighlightBegin:0.5
        preferredHighlightEnd:0.5

    }

    Path{
        id: coverFlowPath
        startX: 0
        startY: coverFlow.height/3

        PathAttribute{ name:"iconZ"; value:0 }
        PathAttribute{ name:"iconAngle"; value:70 }
        PathAttribute{ name:"iconScale"; value: 0.6 }

        PathLine{ x:coverFlow.width*0.5; y:coverFlow.height/3; }
        PathAttribute{ name:"iconZ"; value:100 }
        PathAttribute{ name:"iconAngle"; value:0 }
        PathAttribute{ name:"iconScale"; value:1.0 }

        PathLine{ x: coverFlow.width; y:coverFlow.height/3 }
        PathAttribute{ name:"iconZ"; value: 0 }
        PathAttribute{ name:"iconAngle"; value:-70 }
        PathAttribute{ name:"iconScale"; value:0.6 }
        PathPercent{ value: 1.0 }
    }
}      

import QtQuick 2.5
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

Item {
    id: root
    visible: true
    width: 640
    height: 480
    ListModel{
        id: model
        ListElement{url:"./images/01.jpg"}
        ListElement{url:"./images/02.png"}
        ListElement{url:"./images/03.jpg"}
        ListElement{url:"./images/04.jpg"}
        ListElement{url:"./images/05.jpg"}
    }
    Rectangle{
        id: zhanwei
        anchors.left: parent.left
        width: root.width
        height: root.height/5
        visible:false
    }

    /*預計用來顯示景區資訊*/
    CoverFlow{
        id: coverFlow
        anchors.left: parent.left
        anchors.top: zhanwei.bottom
        anchors.topMargin: 10
        anchors.right: parent.right
        width: root.width
        height: root.height*2/5
        visible: true

        model:model
    }
}      

import QtQuick 2.0

Item {
    id: delegateItem
    width: 320
    height: 450
    z: PathView.iconZ
    scale: PathView.iconScale

    Image{
        id: dlgImg
        source: url
        width:delegateItem.width
        height:delegateItem.height
    }
    transform:Rotation{
        origin.x: dlgImg.width/2.0
        origin.y: dlgImg.height/2.0
           axis{ x:0; y:1; z:0 }
        angle:delegateItem.PathView.iconAngle
    }
}