Merge HListView and HFixedListView components

This commit is contained in:
miruka 2019-08-21 05:02:37 -04:00
parent 6e3924ca4e
commit 1f5b46c257
2 changed files with 44 additions and 53 deletions

View File

@ -1,50 +0,0 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
ListView {
id: listView
interactive: false
currentIndex: -1
highlightMoveDuration: theme.animationDuration
// Keep highlighted delegate at the center
highlightRangeMode: ListView.ApplyRange
preferredHighlightBegin: height / 2 - currentItemHeight
preferredHighlightEnd: height / 2 + currentItemHeight
readonly property int currentItemHeight:
currentItem ? currentItem.height : 0
highlight: HRectangle {
color: theme.controls.listView.highlight
}
// Important:
// https://doc.qt.io/qt-5/qml-qtquick-viewtransition.html#handling-interrupted-animations
populate: add
displaced: move
add: Transition {
ParallelAnimation {
HNumberAnimation { property: "opacity"; from: 0; to: 1 }
HNumberAnimation { properties: "x,y"; from: 100 }
}
}
move: Transition {
ParallelAnimation {
HNumberAnimation { property: "opacity"; to: 1 }
HNumberAnimation { properties: "x,y" }
}
}
remove: Transition {
ParallelAnimation {
HNumberAnimation { property: "opacity"; to: 0 }
HNumberAnimation { properties: "x,y"; to: 100 }
}
}
}

View File

@ -1,9 +1,50 @@
import QtQuick 2.12 import QtQuick 2.12
import QtQuick.Controls 2.12 import QtQuick.Controls 2.12
HFixedListView { ListView {
interactive: true id: listView
currentIndex: -1
keyNavigationWraps: true keyNavigationWraps: true
highlightMoveDuration: theme.animationDuration
ScrollBar.vertical: ScrollBar {} // Keep highlighted delegate at the center
highlightRangeMode: ListView.ApplyRange
preferredHighlightBegin: height / 2 - currentItemHeight
preferredHighlightEnd: height / 2 + currentItemHeight
readonly property int currentItemHeight:
currentItem ? currentItem.height : 0
highlight: HRectangle {
color: theme.controls.listView.highlight
}
ScrollBar.vertical: ScrollBar { visible: listView.interactive }
add: Transition {
ParallelAnimation {
HNumberAnimation { property: "opacity"; from: 0; to: 1 }
HNumberAnimation { properties: "x,y"; from: 100 }
}
}
move: Transition {
ParallelAnimation {
// Ensure opacity goes to 1 if add/remove transition is interrupted
HNumberAnimation { property: "opacity"; to: 1 }
HNumberAnimation { properties: "x,y" }
}
}
remove: Transition {
ParallelAnimation {
HNumberAnimation { property: "opacity"; to: 0 }
HNumberAnimation { properties: "x,y"; to: 100 }
}
}
populate: add
displaced: move
} }