android 轮播coverflow,QML PathView实现COverFlow 图片轮播效果

import QtQuick 2.8

import QtQuick.Window 2.2

Window {

visible: true

width: 600

height: 400

title: qsTr("Cover Flow")

ListModel{

id:model

ListElement{url:"qrc:/image/1.jpg"}

ListElement{url:"qrc:/image/2.jpg"}

ListElement{url:"qrc:/image/3.jpg"}

ListElement{url:"qrc:/image/4.jpg"}

ListElement{url:"qrc:/image/5.jpg"}

}

CoverFlow{

anchors.fill:parent

model:model

}

}

CoverFlow.qmlimport QtQuick 2.0

import QtGraphicalEffects 1.0

Rectangle {

id:coverflow

color:"black"

property ListModel model

property int itemCount: 5

PathView{

id:pathView

model:coverflow.model

delegate: Item {

id:delegateItem

width: 200

height: 200

z:PathView.iconZ

scale:PathView.iconScale

Image{

id:image

source: url

width: delegateItem.width

height: delegateItem.height

}

ShaderEffect {

anchors.top: image.bottom

width: image.width

height: image.height;

anchors.left: image.left

property variant source: image;

property size sourceSize: Qt.size(0.5 / image.width, 0.5 / image.height);

fragmentShader:

"varying highp vec2 qt_TexCoord0;

uniform lowp sampler2D source;

uniform lowp vec2 sourceSize;

uniform lowp float qt_Opacity;

void main() {

lowp vec2 tc = qt_TexCoord0 * vec2(1, -1) + vec2(0, 1);

lowp vec4 col = 0.25 * (texture2D(source, tc + sourceSize) + texture2D(source, tc- sourceSize)

+ texture2D(source, tc + sourceSize * vec2(1, -1))

+ texture2D(source, tc + sourceSize * vec2(-1, 1)));

gl_FragColor = col * qt_Opacity * (1.0 - qt_TexCoord0.y) * 0.2;

}"

}

transform: Rotation{

origin.x:image.width/2.0

origin.y:image.height/2.0

axis{x:0;y:1;z:0}

angle: delegateItem.PathView.iconAngle

}

}

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/2;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}

}

}