Merge pull request #511 from EnsembleUI/datagrid-issue

Changed border styling of data grid view

Author: vinothvino42

assets/schema/ensemble_schema.json

@@ -1238,6 +1238,92 @@
         }
       ]
     },
+    "DataGrid-payload": {
+      "type": "object",
+      "allOf": [
+        {
+          "$ref": "#/$defs/DataRow-Templated-payload"
+        },
+        {
+          "properties": {
+            "children": {
+                "$ref": "#/$defs/DataRow"
+            },
+            "styles": {
+              "allOf": [
+                {
+                  "$ref": "#/$defs/baseStyles"
+                },
+                {
+                  "$ref": "#/$defs/boxLayoutStyles"
+                },
+                {
+                  "headingTextStyle": {
+                    "type": "object",
+                    "description": "Set the text style for the heading text",
+                    "$ref": "#/$defs/TextStyle"
+                  },
+                  "dataTextStyle": {
+                    "type": "object",
+                    "description": "Set the text style for the data item text",
+                    "$ref": "#/$defs/TextStyle"
+                  }
+                }
+              ]
+            },
+            "horizontalMargin": {
+              "type": "integer",
+              "description": "The leading and trailing gap for the DataGrid view.",
+              "minimum": 0
+            },
+            "dataRowHeight": {
+              "type": "integer",
+              "description": "Set the height of the data row item.",
+              "minimum": 0
+            },
+            "headingRowHeight": {
+              "type": "integer",
+              "description": "Set the height of the heading row item.",
+              "minimum": 0
+            },
+            "columnSpacing": {
+              "type": "number",
+              "description": "Set the padding for the column.",
+              "minimum": 0
+            }
+          }
+        }
+      ]
+    },
+    "DataRow-Templated-payload": {
+      "type": "object",
+      "properties": {
+        "item-template": {
+          "type": "object",
+          "properties": {
+            "data": {
+              "type": "string",
+              "description": "Bind to an array of data from an API response or a variable"
+            },
+            "name": {
+              "type": "string",
+              "description": "Set the name to reference as you iterate through the array of data"
+            },
+            "template": {
+              "$ref": "#/$defs/DataRow",
+              "description": "The data row widget to render for each item"
+            }
+          }
+        }
+      }
+    },
+    "DataRow": {
+      "type": "array",
+      "description": "List of widgets",
+      "items": {
+        "$ref": "#/$defs/Widget"
+      }
+    },
     "Stack-payload": {
       "type": "object",
       "required": ["children"],

lib/layout/data_grid.dart

@@ -62,14 +62,6 @@ class DataGrid extends StatefulWidget
       'DataColumns': (List cols) {
         this.cols = cols;
       },
-      'headingTextStyle': (Map styles) {
-        controller.headingTextController = TextController();
-        TextUtils.setStyles(styles, controller.headingTextController!);
-      },
-      'dataTextStyle': (Map styles) {
-        controller.dataTextController = TextController();
-        TextUtils.setStyles(styles, controller.dataTextController!);
-      },
       'horizontalMargin': (val) =>
           controller.horizontalMargin = Utils.optionalDouble(val),
       'dataRowHeight': (val) =>
@@ -80,29 +72,6 @@ class DataGrid extends StatefulWidget
           controller.columnSpacing = Utils.optionalDouble(val),
       'dividerThickness': (val) =>
           controller.dividerThickness = Utils.optionalDouble(val),
-      'border': (Map val) {
-        Map<String, dynamic> map = {};
-        val.forEach((key, value) {
-          if (value is Map) {
-            Color color = Utils.getColor(value['color']) ?? Colors.black;
-            double width = Utils.getDouble(value['width'], fallback: 1.0);
-            map[key] = BorderSide(color: color, width: width);
-          } else if (key == 'borderRadius') {
-            double? radius = Utils.optionalDouble(value);
-            map[key] = (radius == null)
-                ? BorderRadius.zero
-                : BorderRadius.circular(radius);
-          }
-        });
-        controller.border = TableBorder(
-            top: map['top'] ?? BorderSide.none,
-            right: map['right'] ?? BorderSide.none,
-            bottom: map['bottom'] ?? BorderSide.none,
-            left: map['left'] ?? BorderSide.none,
-            horizontalInside: map['horizontalInside'] ?? BorderSide.none,
-            verticalInside: map['verticalInside'] ?? BorderSide.none,
-            borderRadius: map['borderRadius'] ?? BorderRadius.zero);
-      },
     };
   }
 }
@@ -173,7 +142,7 @@ class EnsembleDataRowState extends State<EnsembleDataRow> {
   }
 }
 
-class DataGridController extends WidgetController {
+class DataGridController extends BoxController {
   List<Widget>? children;
   double? horizontalMargin;
   TextController? headingTextController;
@@ -182,7 +151,22 @@ class DataGridController extends WidgetController {
   double? columnSpacing;
   TextController? dataTextController;
   double? dividerThickness;
-  TableBorder border = const TableBorder();
+
+  @override
+  Map<String, Function> getBaseSetters() {
+    Map<String, Function> setters = super.getBaseSetters();
+    setters.addAll({
+      'headingText': (Map styles) {
+        headingTextController = TextController();
+        TextUtils.setStyles(styles, headingTextController!);
+      },
+      'dataText': (Map styles) {
+        dataTextController = TextController();
+        TextUtils.setStyles(styles, dataTextController!);
+      },
+    });
+    return setters;
+  }
 }
 
 class DataGridState extends WidgetState<DataGrid> with TemplatedWidgetState {
@@ -317,7 +301,12 @@ class DataGridState extends WidgetState<DataGrid> with TemplatedWidgetState {
       dataTextStyle: dataTextStyle,
       columnSpacing: widget.controller.columnSpacing,
       dividerThickness: widget.controller.dividerThickness,
-      border: widget.controller.border,
+      border: TableBorder.all(
+        color: widget.controller.borderColor ?? Colors.black,
+        width: widget.controller.borderWidth?.toDouble() ?? 1.0,
+        borderRadius:
+            widget.controller.borderRadius?.getValue() ?? BorderRadius.zero,
+      ),
     );
     return SingleChildScrollView(
         scrollDirection: Axis.vertical,