update
zhuzihcu
parent
926132a285
commit
1e4f939de7
|
|
@ -1,23 +1,31 @@
|
|||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Rectangle {
|
||||
Item {
|
||||
|
||||
|
||||
id:control
|
||||
|
||||
property int position: 1
|
||||
|
||||
property bool flagXChanged: true
|
||||
property int radius : 5
|
||||
property int loopTime: 2000
|
||||
property bool showIndicator: true
|
||||
|
||||
|
||||
width: 400
|
||||
height: 300
|
||||
|
||||
|
||||
ListModel{
|
||||
id:content_model
|
||||
}
|
||||
|
||||
FluRectangle{
|
||||
anchors.fill: parent
|
||||
radius: [control.radius,control.radius,control.radius,control.radius]
|
||||
FluShadow{
|
||||
radius:control.radius
|
||||
}
|
||||
ListView{
|
||||
id:list_view
|
||||
anchors.fill: parent
|
||||
|
|
@ -25,10 +33,11 @@ Rectangle {
|
|||
clip: true
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
model:content_model
|
||||
delegate: Rectangle{
|
||||
maximumFlickVelocity: 4 * (list_view.orientation ===
|
||||
Qt.Horizontal ? width : height)
|
||||
delegate: Item{
|
||||
width: ListView.view.width
|
||||
height: ListView.view.height
|
||||
color:model.color
|
||||
|
||||
property int displayIndex: {
|
||||
if(index === 0)
|
||||
|
|
@ -38,32 +47,40 @@ Rectangle {
|
|||
return index-1
|
||||
}
|
||||
|
||||
Text{
|
||||
color:"red"
|
||||
text: displayIndex
|
||||
font.pixelSize: 32
|
||||
anchors.centerIn: parent
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
source: model.url
|
||||
fillMode:Image.PreserveAspectCrop
|
||||
}
|
||||
|
||||
}
|
||||
Timer{
|
||||
id:tiemr
|
||||
interval: 100
|
||||
onTriggered: {
|
||||
control.position = list_view.contentX/list_view.width
|
||||
}
|
||||
}
|
||||
|
||||
preferredHighlightBegin: 0
|
||||
preferredHighlightEnd: 0
|
||||
highlightMoveDuration: 0
|
||||
|
||||
onMovementEnded:{
|
||||
flagXChanged = false
|
||||
tiemr.restart()
|
||||
currentIndex = list_view.contentX/list_view.width
|
||||
if(currentIndex === 0){
|
||||
currentIndex = list_view.count-2
|
||||
}else if(currentIndex === list_view.count-1){
|
||||
currentIndex = 1
|
||||
}
|
||||
flagXChanged = false
|
||||
timer_run.start()
|
||||
}
|
||||
|
||||
onMovementStarted: {
|
||||
flagXChanged = true
|
||||
timer_run.stop()
|
||||
}
|
||||
|
||||
onContentXChanged: {
|
||||
|
||||
|
||||
if(flagXChanged){
|
||||
var maxX = Math.min(list_view.width*(control.position+1),list_view.count*list_view.width)
|
||||
var minY = Math.max(0,(list_view.width*(control.position-1)))
|
||||
var maxX = Math.min(list_view.width*(currentIndex+1),list_view.count*list_view.width)
|
||||
var minY = Math.max(0,(list_view.width*(currentIndex-1)))
|
||||
if(contentX>=maxX){
|
||||
contentX = maxX
|
||||
}
|
||||
|
|
@ -74,27 +91,71 @@ Rectangle {
|
|||
}
|
||||
orientation : ListView.Horizontal
|
||||
}
|
||||
|
||||
onPositionChanged: {
|
||||
if(control.position === 0){
|
||||
position = list_view.count-2
|
||||
list_view.positionViewAtIndex(list_view.count-2, ListView.Beginning)
|
||||
|
||||
}
|
||||
if(control.position === list_view.count-1){
|
||||
position = 1
|
||||
list_view.positionViewAtIndex(1, ListView.Beginning)
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
function setData(data){
|
||||
content_model.clear()
|
||||
content_model.append(data[data.length-1])
|
||||
content_model.append(data)
|
||||
content_model.append(data[0])
|
||||
list_view.positionViewAtIndex(1, ListView.Beginning)
|
||||
position = 1
|
||||
list_view.currentIndex = 1
|
||||
timer_run.restart()
|
||||
}
|
||||
|
||||
Row{
|
||||
spacing: 10
|
||||
anchors{
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
bottom: parent.bottom
|
||||
bottomMargin: 20
|
||||
}
|
||||
visible: showIndicator
|
||||
Repeater{
|
||||
model: list_view.count
|
||||
Rectangle{
|
||||
width: 8
|
||||
height: 8
|
||||
radius: 4
|
||||
visible: {
|
||||
if(index===0 || index===list_view.count-1)
|
||||
return false
|
||||
return true
|
||||
}
|
||||
layer.samples: 4
|
||||
layer.enabled: true
|
||||
layer.smooth: true
|
||||
border.width: 1
|
||||
border.color: FluColors.Grey100
|
||||
color: list_view.currentIndex === index ? FluTheme.primaryColor.dark : Qt.rgba(1,1,1,0.5)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Timer{
|
||||
id:timer_anim
|
||||
interval: 250
|
||||
onTriggered: {
|
||||
list_view.highlightMoveDuration = 0
|
||||
if(list_view.currentIndex === list_view.count-1){
|
||||
list_view.currentIndex = 1
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Timer{
|
||||
id:timer_run
|
||||
interval: control.loopTime
|
||||
repeat: true
|
||||
onTriggered: {
|
||||
list_view.highlightMoveDuration = 250
|
||||
list_view.currentIndex = list_view.currentIndex+1
|
||||
timer_anim.start()
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ Item{
|
|||
property color borderColor:"red"
|
||||
property int borderWidth: 1
|
||||
property bool shadow: true
|
||||
default property alias contentItem: container.children
|
||||
default property alias contentItem: container.data
|
||||
|
||||
Rectangle{
|
||||
id:container
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ Item {
|
|||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
contentHeight: container.height
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
ScrollBar.vertical: ScrollBar { }
|
||||
anchors{
|
||||
top: text_title.bottom
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ Item {
|
|||
anchors.margins: -4
|
||||
property color color: FluTheme.isDark ? "#FFFFFF" : "#000000"
|
||||
|
||||
property var radius: 4
|
||||
property int radius: 4
|
||||
|
||||
Rectangle{
|
||||
width: root.width
|
||||
|
|
|
|||
Loading…
Reference in New Issue