[vlc-devel] [PATCH] qml: introduce horizontal and vertical spacing property in ExpandGridView

[Prince Gupta]

---
 modules/gui/qt/widgets/qml/ExpandGridView.qml | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/modules/gui/qt/widgets/qml/ExpandGridView.qml b/modules/gui/qt/widgets/qml/ExpandGridView.qml
index ac6aadf..0a7b512 100644
--- a/modules/gui/qt/widgets/qml/ExpandGridView.qml
+++ b/modules/gui/qt/widgets/qml/ExpandGridView.qml
@@ -18,6 +18,7 @@
 import QtQuick 2.11
 import QtQuick.Controls 2.4
 import "qrc:///util/KeyHelper.js" as KeyHelper
+import "qrc:///style/"
 
 NavigableFocusScope {
     id: root
@@ -31,6 +32,12 @@ NavigableFocusScope {
     property int marginBottom: root.cellHeight / 2
     property int marginTop: root.cellHeight / 3
 
+    property int horizontalSpacing: VLCStyle.margin_normal
+    property int verticalSpacing: VLCStyle.margin_normal
+
+    readonly property int _effectiveCellWidth: cellWidth + horizontalSpacing
+    readonly property int _effectiveCellHeight: cellHeight + verticalSpacing
+
     property variant delegateModel
     property variant model
 
@@ -86,7 +93,7 @@ NavigableFocusScope {
     }
 
     function getNbItemsPerRow() {
-        return Math.max(Math.floor(width / root.cellWidth), 1)
+        return Math.max(Math.floor((width + root.horizontalSpacing) / root._effectiveCellWidth), 1)
     }
 
     function getItemRowCol(id) {
@@ -98,9 +105,9 @@ NavigableFocusScope {
 
     function getItemPos(id) {
         var colCount = root.getNbItemsPerRow()
-        var remainingSpace = flickable.width - colCount * root.cellWidth
+        var remainingSpace = flickable.width - (colCount * root._effectiveCellWidth) + root.horizontalSpacing
         var rowCol = getItemRowCol(id)
-        return [(rowCol[0] * root.cellWidth) + (remainingSpace / 2), rowCol[1] * root.cellHeight + headerHeight]
+        return [(rowCol[0] * root._effectiveCellWidth) + (remainingSpace / 2), rowCol[1] * root._effectiveCellHeight + headerHeight]
     }
 
     //use the same signature as Gridview.positionViewAtIndex(index, PositionMode mode)
@@ -119,7 +126,7 @@ NavigableFocusScope {
         var newContentY = flickable.contentY
 
         var itemTopY = root.getItemPos(index)[1]
-        var itemBottomY = itemTopY + root.cellHeight
+        var itemBottomY = itemTopY + root._effectiveCellHeight
 
         var viewTopY = flickable.contentY
         var viewBottomY = viewTopY + flickable.height
-- 
2.20.1