digitalartifex/komplex-hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplified view code

Browse Source
This commit is contained in:
Digital Artifex
2026-06-23 21:02:17 -04:00
parent 5a150c29f9
commit 6d32ed6bce
8 changed files with 452 additions and 372 deletions
Download Patch File Download Diff File Expand all files Collapse all files
KomplexHubModule/Controls/CMakeLists.txt
+1
View File
@@ -16,5 +16,6 @@ qt6_add_qml_module(KomplexHubModule_Controls
"SearchResultList.qml"
QML_FILES PaginationBox.qml
QML_FILES PaginatorGrid.qml
QML_FILES HorizontalPaginator.qml
)
KomplexHubModule/Controls/HorizontalPaginator.qml
+169
View File
@@ -0,0 +1,169 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import KomplexHub
import KomplexHub.Controls
import KomplexHub.Kero
import KomplexHubPlugin
Item
{
readonly property bool searchable: false
property int resultsPerRow: (resultsContainer.width - (Constants.largeMargin * 2)) / (resultWidth + Constants.mediumMargin)
property int rows: ((resultsContainer.height - (Constants.largeMargin * 2)) / (resultHeight + Constants.mediumMargin))
property int resultsPerPage: resultsPerRow * rows
property int emptyWidth: (resultsContainer.width - (Constants.largeMargin * 2)) - (resultsPerRow * (resultWidth + Constants.mediumMargin))
property int resultWidth: 256
property int resultHeight: 245
property bool loading: false
property alias currentItem: resultsView.currentItem
property alias currentIndex: resultsView.currentIndex
property var model
property Component delegate
id: rootItem
Item
{
id: resultsContainer
anchors.fill: parent
RowLayout
{
anchors.fill: parent
Component
{
id: highlight
Rectangle
{
width: 256
height: 245
color: palette.accent
radius: 5
// x: resultsView.currentItem.x
// y: resultsView.currentItem.y
Behavior on x { SpringAnimation { spring: 3; damping: 0.2 } }
Behavior on y { SpringAnimation { spring: 3; damping: 0.2 } }
}
}
ListView
{
id: resultsView
Layout.fillHeight: true
Layout.fillWidth: true
spacing: Constants.mediumMargin
orientation: ListView.Horizontal
model: rootItem.model
delegate: rootItem.delegate
highlight: Rectangle { color: palette.accent; radius: 5 }
highlightFollowsCurrentItem: true
focus: true
add: Transition
{
NumberAnimation
{
properties: "x"
from: resultsContainer.width
duration: 250
}
NumberAnimation
{
properties: "opacity,scale"
to: 1.0
duration: 500
}
}
move: Transition
{
NumberAnimation
{
properties: "x,y"
duration: 250
}
}
displaced: Transition
{
NumberAnimation
{
properties: "x,y"
duration: 250
}
}
populate: Transition
{
NumberAnimation
{
properties: "opacity,scale"
to: 1.0
duration: 500
}
}
remove: Transition
{
NumberAnimation
{
properties: "x"
to: 0
duration: 250
}
NumberAnimation
{
properties: "opacity"
to: 0
duration: 250
}
}
}
Item
{
Layout.fillHeight: true
Layout.preferredWidth: 128
Rectangle
{
id: gradientMap
anchors.top: parent.top
anchors.right: moreButton.left
height: resultHeight
width: resultWidth / 4
gradient: Gradient
{
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: "transparent" }
GradientStop { position: 1.0; color: palette.light }
}
opacity: 0.5
}
SquareButton
{
id: moreButton
anchors.top: parent.top
anchors.right: parent.right
height: resultHeight
width: 64
icon.source: "qrc:/images/icons/icons8-forward.svg"
icon.height: 24
icon.width: 24
}
}
}
}
}
KomplexHubModule/Controls/PaginatorGrid.qml
+32 -1
View File
@@ -19,6 +19,9 @@ Item
property int resultHeight: 245
property bool loading: false
property alias currentItem: resultsView.currentItem
property alias currentIndex: resultsView.currentIndex
property var model
property Component delegate
@@ -78,6 +81,22 @@ Item
Layout.maximumWidth: emptyWidth / 2
}
Component
{
id: highlight
Rectangle
{
width: view.cellWidth
height: view.cellHeight
color: palette.accent
radius: 5
x: view.currentItem.x
y: view.currentItem.y
Behavior on x { SpringAnimation { spring: 3; damping: 0.2 } }
Behavior on y { SpringAnimation { spring: 3; damping: 0.2 } }
}
}
GridView
{
id: resultsView
@@ -86,10 +105,12 @@ Item
cellWidth: 256 + Constants.mediumMargin
cellHeight: 245 + Constants.mediumMargin
focus: true
model: rootItem.model
delegate: rootItem.delegate
highlight: Rectangle { color: palette.accent; radius: 5 }
highlightFollowsCurrentItem: true
focus: true
add: Transition
{
@@ -116,6 +137,15 @@ Item
}
}
displaced: Transition
{
NumberAnimation
{
properties: "x,y"
duration: 250
}
}
populate: Transition
{
NumberAnimation
@@ -146,6 +176,7 @@ Item
PaginationBox
{
id: buttonBoxLayout
height: 35
anchors.left: parent.left
KomplexHubModule/Controls/SearchResultItem.qml
+2 -11
View File
@@ -119,7 +119,8 @@ Item {
}
}
MouseArea {
MouseArea
{
property string lastState
id: mouseArea
@@ -155,16 +156,6 @@ Item {
}
}
onSelectedChanged: () => {
if(selected) {
searchResultItemRoot.triggered()
searchResultItemRoot.state = "selected"
}
else {
searchResultItemRoot.state = ""
}
}
states: [
State {
name: "hovered"