From 1d8d00a7f29a0f84e6aeaa97efa4813fdeaa6d76 Mon Sep 17 00:00:00 2001 From: restitux Date: Tue, 30 Aug 2022 21:29:53 -0400 Subject: [PATCH] Refactor Show display to remove extra elements --- layouts/components/ContentViewElement.qml | 8 +- layouts/components/ContentViewElementShow.qml | 198 +++++++++--------- 2 files changed, 96 insertions(+), 110 deletions(-) diff --git a/layouts/components/ContentViewElement.qml b/layouts/components/ContentViewElement.qml index ca54259..e9f8173 100644 --- a/layouts/components/ContentViewElement.qml +++ b/layouts/components/ContentViewElement.qml @@ -25,12 +25,8 @@ Column { Repeater { property var provider: modelData model: repeaterModel - Item { - height: 300 - width: 350 * 0.68 - ContentViewElementShow { - show: provider.getShow(modelData) - } + ContentViewElementShow { + show: provider.getShow(modelData) } } } diff --git a/layouts/components/ContentViewElementShow.qml b/layouts/components/ContentViewElementShow.qml index 3580713..f300d9f 100644 --- a/layouts/components/ContentViewElementShow.qml +++ b/layouts/components/ContentViewElementShow.qml @@ -2,111 +2,101 @@ import QtQuick 2.12 import QtQuick.Controls 1.4 import QtGraphicalEffects 1.12 -Column { +Item { 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 - } - } - ] + property int baseHeight: 350 + property int childHeight: baseHeight + property int childWidth: baseHeight * 0.68 + property int childHeightExpanded: baseHeight * 15 / 14 + property int childWidthExpanded: (baseHeight * 15 / 14) * 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: baseHeight + width: (baseHeight * 8 / 7) * 0.68 + Column { + anchors.fill: parent + Item { + id: parentElem + state: (elemSelected && (index == xIndex)) ? "selected" : "deselected" + anchors.horizontalCenter: parent.horizontalCenter + anchors.fill: parent + 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: borderRectHeight + width: borderRectWidth + } + PropertyChanges { + target: dropShadow + visible: false + } + PropertyChanges { + target: img + width: childWidth + height: childHeight + } + }, + State { + name: "selected" + PropertyChanges { + target: rect + border.width: borderWidth + height: borderRectHeightExpanded + width: borderRectWidthExpanded + } + PropertyChanges { + target: dropShadow + visible: true + } + PropertyChanges { + target: img + width: childWidthExpanded + height: 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 - //} }