Refactor ContentView to add animated scrolling
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls 1.4
|
||||
import QtQuick.Controls 2.15
|
||||
|
||||
import Ikinuki.Client 1.0
|
||||
|
||||
@@ -27,42 +28,38 @@ StackLayout {
|
||||
width: 40
|
||||
}
|
||||
Column {
|
||||
Row {
|
||||
Item {
|
||||
height: parent.height
|
||||
width: 16
|
||||
}
|
||||
Column {
|
||||
spacing: 20
|
||||
Item {
|
||||
height: 20
|
||||
height: tabView.height
|
||||
width: tabView.width - 40
|
||||
ShowDetails {
|
||||
z: 1.2
|
||||
height: parent.height * 0.25
|
||||
width: parent.width
|
||||
title: elementColumn.children[ySelect].provider.getShow(xSelect).title
|
||||
year: elementColumn.children[ySelect].provider.getShow(xSelect).year
|
||||
description: elementColumn.children[ySelect].provider.getShow(xSelect).description
|
||||
}
|
||||
Text {
|
||||
text: elementColumn.children[ySelect].provider.getShow(xSelect).title
|
||||
font.pointSize: 30
|
||||
color: "#cdd7d9"
|
||||
}
|
||||
Text {
|
||||
text: elementColumn.children[ySelect].provider.getShow(xSelect).year
|
||||
font.pointSize: 15
|
||||
color: "#99afb4"
|
||||
}
|
||||
Text {
|
||||
text: elementColumn.children[ySelect].provider.getShow(xSelect).description
|
||||
font.pointSize: 13
|
||||
color: "#cdd7d9"
|
||||
width: tabView.parent.width * 0.6
|
||||
wrapMode: Text.WordWrap
|
||||
maximumLineCount: 4
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
}
|
||||
}
|
||||
Item {
|
||||
height: 40
|
||||
ScrollView {
|
||||
z: 1.0
|
||||
height: parent.height * 0.75
|
||||
width: parent.width
|
||||
contentWidth: 2000
|
||||
contentHeight: 2000
|
||||
ScrollBar.horizontal.position: xSelect * 0.135
|
||||
ScrollBar.vertical.position: ySelect * 0.22
|
||||
Behavior on ScrollBar.horizontal.position {
|
||||
NumberAnimation {
|
||||
duration: 200
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
}
|
||||
Behavior on ScrollBar.vertical.position {
|
||||
NumberAnimation {
|
||||
duration: 200
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
}
|
||||
Flickable{
|
||||
clip: true
|
||||
Column {
|
||||
id: elementColumn
|
||||
spacing: 20
|
||||
@@ -85,6 +82,8 @@ StackLayout {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
states: [
|
||||
State {
|
||||
name: "deselected"
|
||||
|
||||
@@ -15,7 +15,13 @@ Column {
|
||||
Row {
|
||||
Item {
|
||||
height: parent.height
|
||||
width: 16
|
||||
width: 16 + (xIndex * 270)
|
||||
Behavior on width {
|
||||
NumberAnimation {
|
||||
duration: 200
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
}
|
||||
}
|
||||
Text {
|
||||
text: title
|
||||
|
||||
@@ -0,0 +1,40 @@
|
||||
import QtQuick 2.12
|
||||
|
||||
Row {
|
||||
id: root
|
||||
property string title
|
||||
property int year
|
||||
property string description
|
||||
Item {
|
||||
height: parent.height
|
||||
width: 16
|
||||
}
|
||||
Column {
|
||||
height: parent.height
|
||||
width: parent.width - 16
|
||||
spacing: 20
|
||||
Item {
|
||||
height: 20
|
||||
width: parent.width
|
||||
}
|
||||
Text {
|
||||
text: title
|
||||
font.pointSize: 30
|
||||
color: "#cdd7d9"
|
||||
}
|
||||
Text {
|
||||
text: year
|
||||
font.pointSize: 15
|
||||
color: "#99afb4"
|
||||
}
|
||||
Text {
|
||||
text: description
|
||||
font.pointSize: 13
|
||||
color: "#cdd7d9"
|
||||
width: parent.width * 0.6
|
||||
wrapMode: Text.WordWrap
|
||||
maximumLineCount: 4
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user