Files
htpc-client/layouts/components/ContentViewElementShow.qml
T

113 lines
3.6 KiB
QML

import QtQuick 2.12
import QtQuick.Controls 1.4
import QtGraphicalEffects 1.12
Column {
property var show
anchors.fill: parent
Item {
id: parentElem
property int baseHeight: 300
property int childHeight: baseHeight
property int childWidth: baseHeight * 0.68
property int childHeightExpanded: baseHeight + 50
property int childWidthExpanded: (baseHeight + 50) * 0.68
property int borderWidth: 3
property int borderRadius: 1
property int borderRectHeight: childHeight + (borderWidth * 2)
property int borderRectWidth: childWidth + (borderWidth * 2)
property int borderRectHeightExpanded: childHeightExpanded + (borderWidth * 2)
property int borderRectWidthExpanded: childWidthExpanded + (borderWidth * 2)
height: 300 + (borderWidth * 2)
width: (300 * 0.68) + (borderWidth * 2)
state: (elemSelected && (index == xIndex)) ? "selected" : "deselected"
anchors.horizontalCenter: parent.horizontalCenter
DropShadow {
id: dropShadow
anchors.fill: img
verticalOffset: 15
samples: 80
opacity: 0.5
color: "black"
source: img
}
Rectangle {
id: rect
color: "transparent"
border.color: "orange"
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
radius: parent.borderRadius
}
Image {
id: img
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
source: show.poster
mipmap: true
}
states: [
State {
name: "deselected"
PropertyChanges {
target: rect
border.width: 0
height: parent.borderRectHeight
width: parent.borderRectWidth
}
PropertyChanges {
target: dropShadow
visible: false
}
PropertyChanges {
target: img
width: parent.childWidth
height: parent.childHeight
}
},
State {
name: "selected"
PropertyChanges {
target: rect
border.width: parent.borderWidth
height: parent.borderRectHeightExpanded
width: parent.borderRectWidthExpanded
}
PropertyChanges {
target: dropShadow
visible: true
}
PropertyChanges {
target: img
width: parent.childWidthExpanded
height: parent.childHeightExpanded
}
}
]
transitions: [
Transition {
NumberAnimation {
properties: "border.width,width,height"
duration: 100
easing.type: Easing.Linear
}
}
]
}
//Item {width: 1; height: 15}
//Text {
// text: show.title
// color: "white"
// font.pointSize: 14
// anchors.horizontalCenter: parent.horizontalCenter
//}
//Item {width: 1; height: 5}
//Text {
// text: show.year
// color: "white"
// font.pointSize: 14
// anchors.horizontalCenter: parent.horizontalCenter
//}
}