Merge pull request Sub6Resources#519 from vrtdev/bugfix/491-table-columns-intrinsic-width

ryan-berger · web-flow · commit 17735cedaeb3 · 2021-02-04T12:59:37.000-07:00
Use intrinsic with for &lt;table&gt; columns with otherwise undefined size
diff --git a/lib/src/layout_element.dart b/lib/src/layout_element.dart
@@ -31,6 +31,18 @@ class TableLayoutElement extends LayoutElement {
 
   @override
   Widget toWidget(RenderContext context) {
+    return Container(
+      decoration: BoxDecoration(
+        color: style.backgroundColor,
+        border: style.border,
+      ),
+      width: style.width,
+      height: style.height,
+      child: _layoutCells(context),
+    );
+  }
+
+  Widget _layoutCells(RenderContext context) {
     final rows = <TableRowLayoutElement>[];
     List<TrackSize> columnSizes = <TrackSize>[];
     for (var child in children) {
@@ -48,14 +60,14 @@ class TableLayoutElement extends LayoutElement {
                       colWidth.substring(0, colWidth.length - 1));
                   return percentageSize != null && !percentageSize.isNaN
                       ? FlexibleTrackSize(percentageSize * 0.01)
-                      : FlexibleTrackSize(1);
+                      : IntrinsicContentTrackSize();
                 } else if (colWidth != null) {
                   final fixedPxSize = double.tryParse(colWidth);
                   return fixedPxSize != null
                       ? FixedTrackSize(fixedPxSize)
-                      : FlexibleTrackSize(1);
+                      : IntrinsicContentTrackSize();
                 } else {
-                  return FlexibleTrackSize(1);
+                  return IntrinsicContentTrackSize();
                 }
               });
             })
@@ -101,7 +113,8 @@ class TableLayoutElement extends LayoutElement {
               ),
               child: SizedBox.expand(
                 child: Container(
-                  alignment: child.style.alignment ?? style.alignment ??
+                  alignment: child.style.alignment ??
+                      style.alignment ??
                       Alignment.centerLeft,
                   child: StyledText(
                     textSpan: context.parser.parseTree(context, child),
@@ -123,29 +136,21 @@ class TableLayoutElement extends LayoutElement {
     }
 
     // Create column tracks (insofar there were no colgroups that already defined them)
-    List<TrackSize> finalColumnSizes = (columnSizes ?? <TrackSize>[]).take(
-        columnMax).toList();
+    List<TrackSize> finalColumnSizes =
+        (columnSizes ?? <TrackSize>[]).take(columnMax).toList();
     finalColumnSizes += List.generate(
         max(0, columnMax - finalColumnSizes.length),
-            (_) => FlexibleTrackSize(1));
-    return Container(
-      decoration: BoxDecoration(
-        color: style.backgroundColor,
-        border: style.border,
-      ),
-      width: style.width,
-      height: style.height,
-      child: LayoutGrid(
-        gridFit: GridFit.loose,
-        templateColumnSizes: finalColumnSizes,
-        templateRowSizes: rowSizes,
-        children: cells,
-      ),
+        (_) => IntrinsicContentTrackSize());
+
+    return LayoutGrid(
+      gridFit: GridFit.loose,
+      templateColumnSizes: finalColumnSizes,
+      templateRowSizes: rowSizes,
+      children: cells,
     );
   }
 }
 
-
 class TableSectionLayoutElement extends LayoutElement {
   TableSectionLayoutElement({
     String name,
@@ -185,12 +190,12 @@ class TableCellElement extends StyledElement {
     Style style,
     dom.Element node,
   }) : super(
-      name: name,
-      elementId: elementId,
-      elementClasses: elementClasses,
-      children: children,
-      style: style,
-      node: node) {
+            name: name,
+            elementId: elementId,
+            elementClasses: elementClasses,
+            children: children,
+            style: style,
+            node: node) {
     colspan = _parseSpan(this, "colspan");
     rowspan = _parseSpan(this, "rowspan");
   }
@@ -201,8 +206,9 @@ class TableCellElement extends StyledElement {
   }
 }
 
-TableCellElement parseTableCellElement(dom.Element element,
-    List<StyledElement> children,
+TableCellElement parseTableCellElement(
+  dom.Element element,
+  List<StyledElement> children,
 ) {
   final cell = TableCellElement(
     name: element.localName,
@@ -228,8 +234,9 @@ class TableStyleElement extends StyledElement {
   }) : super(name: name, children: children, style: style, node: node);
 }
 
-TableStyleElement parseTableDefinitionElement(dom.Element element,
-    List<StyledElement> children,
+TableStyleElement parseTableDefinitionElement(
+  dom.Element element,
+  List<StyledElement> children,
 ) {
   switch (element.localName) {
     case "colgroup":
@@ -244,8 +251,9 @@ TableStyleElement parseTableDefinitionElement(dom.Element element,
   }
 }
 
-LayoutElement parseLayoutElement(dom.Element element,
-    List<StyledElement> children,
+LayoutElement parseLayoutElement(
+  dom.Element element,
+  List<StyledElement> children,
 ) {
   switch (element.localName) {
     case "table":
diff --git a/pubspec.yaml b/pubspec.yaml
@@ -16,7 +16,7 @@ dependencies:
   css_colors: ^1.0.2
 
   # Plugins for rendering the <table> tag.
-  flutter_layout_grid: ^0.10.2
+  flutter_layout_grid: ^0.10.5
 
   # Plugins for rendering the <video> tag.
   video_player: ^1.0.1
