Making shape of port based on pin count

Author: machinekoder

qml/BBB_shape.png

@@ -202,11 +202,9 @@ Rectangle {
             id: port9
 
             anchors.top: parent.top
-            anchors.bottom: parent.bottom
             anchors.left: parent.left
             width: parent.width * 0.054
-            anchors.topMargin: parent.height * 0.265
-            anchors.bottomMargin: parent.height * 0.18
+            anchors.topMargin: parent.height * 0.275
             anchors.leftMargin: parent.width * 0.245
             currentColorMap: selector.currentColorMap
             loadedOverlays: overlaySelector.output
@@ -234,11 +232,9 @@ Rectangle {
             id: port8
 
             anchors.top: parent.top
-            anchors.bottom: parent.bottom
             anchors.right: parent.right
             width: parent.width * 0.054
-            anchors.topMargin: parent.height * 0.265
-            anchors.bottomMargin: parent.height * 0.18
+            anchors.topMargin: parent.height * 0.275
             anchors.rightMargin: parent.width * 0.245
             currentColorMap: selector.currentColorMap
             loadedOverlays: overlaySelector.output

qml/BBB_shape.svg

@@ -105,7 +105,7 @@ Rectangle {
     id: main
 
     width: 50
-    height: 500
+    height: grid.height + grid.spacing * 4
     color: "white"
     border.color: "black"
     border.width: main.width * 0.05
@@ -124,7 +124,9 @@ Rectangle {
         id: grid
         spacing: main.width * 0.06
         columns: main.pinRows
-        anchors.centerIn: parent
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.top: parent.top
+        anchors.margins: spacing * 2
     }
 }