mediasrv/htpc-client
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix horizontal scrolling to be row independent

Browse Source
This commit is contained in:
restitux
2022-09-07 21:49:22 -06:00
parent 5c8d0dacf5
commit d691aeb6e9
2 changed files with 98 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/components/BrowserView/ContentView.qml
+68 -59
View File
@@ -13,69 +13,74 @@ StackLayout {
property bool viewSelected property bool viewSelected
property int selectedElement property int selectedElement
state: viewSelected ? "selected" : "deselected" state: viewSelected ? "selected" : "deselected"
property int xSelect: 0
property int ySelect: 0 property int ySelect: 0
width: parent.width * viewSelected ? 0.95 : 0.8 width: parent.width * viewSelected ? 0.95 : 0.8
height: parent.height height: parent.height
Repeater { Item {
model: providers Item { // fake object to create notifying array
Rectangle { id: rowSelector
color: "#22282A" Item {
Row { property int xIndex: 0
Item { }
height: 10 Item {
width: 40 property int xIndex: 0
} }
Column { }
height: tabView.height Repeater {
width: tabView.width - 40 model: providers
ShowDetails { Rectangle {
z: 1.2 anchors.fill: parent
height: parent.height * 0.25 color: "#22282A"
width: parent.width Row {
title: elementColumn.children[ySelect].provider.getShow(xSelect).title Item {
year: elementColumn.children[ySelect].provider.getShow(xSelect).year height: 10
description: elementColumn.children[ySelect].provider.getShow(xSelect).description width: 40
} }
ScrollView { Column {
z: 1.0 height: tabView.height
height: parent.height * 0.75 width: tabView.width - 40
width: parent.width ShowDetails {
contentWidth: 2000 z: 1.2
contentHeight: 2000 height: parent.height * 0.25
ScrollBar.horizontal.position: xSelect * 0.135 width: parent.width
ScrollBar.vertical.position: ySelect * 0.22 title: elementColumn.children[ySelect].provider.getShow(rowSelector.children[ySelect].xIndex).title
Behavior on ScrollBar.horizontal.position { year: elementColumn.children[ySelect].provider.getShow(rowSelector.children[ySelect].xIndex).year
NumberAnimation { description: elementColumn.children[ySelect].provider.getShow(rowSelector.children[ySelect].xIndex).description
duration: 200
easing.type: Easing.Linear
}
} }
Behavior on ScrollBar.vertical.position { ScrollView {
NumberAnimation { z: 1.0
duration: 200 height: parent.height * 0.75
easing.type: Easing.Linear width: parent.width
} contentWidth: 2000
} contentHeight: 2000
Flickable{ ScrollBar.vertical.position: ySelect * 0.22
clip: true Behavior on ScrollBar.vertical.position {
Column { NumberAnimation {
id: elementColumn duration: 200
spacing: 20 easing.type: Easing.Linear
Element {
title: "In Progress"
provider: modelData
repeaterModel: modelData.inProgress
elemSelected: viewSelected && (0 == ySelect)
xIndex: xSelect
} }
Element { }
title: "Recently Added" Flickable{
provider: modelData clip: true
repeaterModel: modelData.recentlyAdded Column {
elemSelected: viewSelected && (1 == ySelect) id: elementColumn
xIndex: xSelect spacing: 20
width: parent.width
Element {
title: "In Progress"
provider: modelData
repeaterModel: modelData.inProgress
elemSelected: viewSelected && (0 == ySelect)
xIndex: rowSelector.children[0].xIndex
}
Element {
title: "Recently Added"
provider: modelData
repeaterModel: modelData.recentlyAdded
elemSelected: viewSelected && (1 == ySelect)
xIndex: rowSelector.children[1].xIndex
}
} }
} }
} }
@@ -112,13 +117,17 @@ StackLayout {
Keys.onPressed: (event)=> { Keys.onPressed: (event)=> {
if (event.key == Qt.Key_Left) { if (event.key == Qt.Key_Left) {
if (xSelect == 0) { if (rowSelector.children[ySelect].xIndex == 0) {
ySelect = 0;
parent.selectedView = 0; parent.selectedView = 0;
for (var i = 0; i < rowSelector.children.length; i++) {
rowSelector.children[i].xIndex = 0;
}
} else { } else {
xSelect--; rowSelector.children[ySelect].xIndex--;
} }
} else if (event.key == Qt.Key_Right) { } else if (event.key == Qt.Key_Right) {
xSelect++; rowSelector.children[ySelect].xIndex++;
} else if (event.key == Qt.Key_Down) { } else if (event.key == Qt.Key_Down) {
ySelect++; ySelect++;
} else if (event.key == Qt.Key_Up) { } else if (event.key == Qt.Key_Up) {
layouts/components/BrowserView/ContentView/Element.qml
+30 -15
View File
@@ -1,6 +1,6 @@
import QtQuick 2.12 import QtQuick 2.12
import QtQuick.Controls 1.4 import QtQuick.Controls 1.4
import QtQuick.Controls 2.15
Column { Column {
property var title property var title
@@ -8,6 +8,7 @@ Column {
property var repeaterModel property var repeaterModel
property bool elemSelected property bool elemSelected
property int xIndex property int xIndex
width: parent.width
Item { Item {
width: 10 width: 10
height: 20 height: 20
@@ -15,13 +16,7 @@ Column {
Row { Row {
Item { Item {
height: parent.height height: parent.height
width: 16 + (xIndex * 270) width: 16
Behavior on width {
NumberAnimation {
duration: 200
easing.type: Easing.Linear
}
}
} }
Text { Text {
text: title text: title
@@ -33,13 +28,33 @@ Column {
width: 10 width: 10
height: 15 height: 15
} }
Row { ScrollView {
Repeater { width: parent.width
id: repeater height: 400
property var provider: modelData ScrollBar.horizontal.position: xIndex * 0.135
model: repeaterModel Behavior on ScrollBar.horizontal.position {
Show { NumberAnimation {
show: provider.getShow(modelData) duration: 200
easing.type: Easing.Linear
}
}
Flickable {
clip: true
Column {
Item {
width: parent.width
height: 20
}
Row {
Repeater {
id: repeater
property var provider: modelData
model: repeaterModel
Show {
show: provider.getShow(modelData)
}
}
}
} }
} }
} }