Skip to content

Commit f3ad232

Browse files
committed
Add support for borders, width, and height on tables
1 parent 31359b7 commit f3ad232

File tree

2 files changed

+69
-54
lines changed

2 files changed

+69
-54
lines changed

example/lib/main.dart

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ class _MyHomePageState extends State<MyHomePage> {
118118
),
119119
"li": Style(
120120
// backgroundColor: Colors.red,
121-
// fontSize: 20,
121+
// fontSize: FontSize(20),
122122
// margin: const EdgeInsets.only(top: 32),
123123
),
124124
"h1, h3, h5": Style(
@@ -128,8 +128,12 @@ class _MyHomePageState extends State<MyHomePage> {
128128
"#whitespace": Style(
129129
backgroundColor: Colors.deepPurple,
130130
),
131-
"table": Style(backgroundColor: Color.fromARGB(0x50, 0xee, 0xee, 0xee)),
132-
"tr": Style(border: Border(bottom: BorderSide(color: Colors.grey))),
131+
"table": Style(
132+
backgroundColor: Color.fromARGB(0x50, 0xee, 0xee, 0xee),
133+
),
134+
"tr": Style(
135+
border: Border(bottom: BorderSide(color: Colors.grey)),
136+
),
133137
"th": Style(
134138
padding: EdgeInsets.all(6),
135139
backgroundColor: Colors.grey,

lib/src/layout_element.dart

Lines changed: 62 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -28,38 +28,46 @@ class TableLayoutElement extends LayoutElement {
2828

2929
@override
3030
Widget toWidget(RenderContext context) {
31-
32-
final colWidths = children.where((c) => c.name == "colgroup").map((group) {
33-
return group.children.where((c) => c.name == "col").map((c) {
34-
final widthStr = c.attributes["width"] ?? "";
35-
if (widthStr.endsWith("%")) {
36-
final width = double.tryParse(widthStr.substring(0, widthStr.length - 1)) * 0.01;
37-
return FractionColumnWidth(width);
38-
} else {
39-
final width = double.tryParse(widthStr);
40-
return FixedColumnWidth(width);
41-
}
42-
});
43-
}).expand((i) => i).toList().asMap();
31+
final colWidths = children
32+
.where((c) => c.name == "colgroup")
33+
.map((group) {
34+
return group.children.where((c) => c.name == "col").map((c) {
35+
final widthStr = c.attributes["width"] ?? "";
36+
if (widthStr.endsWith("%")) {
37+
final width = double.tryParse(widthStr.substring(0, widthStr.length - 1)) * 0.01;
38+
return FractionColumnWidth(width);
39+
} else {
40+
final width = double.tryParse(widthStr);
41+
return FixedColumnWidth(width);
42+
}
43+
});
44+
})
45+
.expand((i) => i)
46+
.toList()
47+
.asMap();
4448

4549
return Container(
4650
decoration: BoxDecoration(
47-
color: style.backgroundColor
51+
color: style.backgroundColor,
52+
border: style.border,
4853
),
54+
width: style.width,
55+
height: style.height,
4956
child: Table(
5057
columnWidths: colWidths,
51-
children: children.map((c) {
52-
if (c is TableSectionLayoutElement) {
53-
return c.toTableRows(context);
54-
}
55-
return null;
56-
})
58+
children: children
59+
.map((c) {
60+
if (c is TableSectionLayoutElement) {
61+
return c.toTableRows(context);
62+
}
63+
return null;
64+
})
5765
.where((t) {
58-
return t != null;
59-
})
60-
.toList()
61-
.expand((i) => i)
62-
.toList(),
66+
return t != null;
67+
})
68+
.toList()
69+
.expand((i) => i)
70+
.toList(),
6371
));
6472
}
6573
}
@@ -101,21 +109,26 @@ class TableRowLayoutElement extends LayoutElement {
101109

102110
TableRow toTableRow(RenderContext context) {
103111
return TableRow(
104-
decoration: BoxDecoration(
105-
border: style.border,
106-
),
107-
children: children.map((c) {
108-
if (c is StyledElement && c.name == 'td' || c.name == 'th') {
109-
return TableCell(
110-
child: Container(
111-
padding: c.style.padding,
112-
decoration: BoxDecoration(
113-
color: c.style.backgroundColor
114-
),
115-
child: RichText(text: context.parser.parseTree(context, c))));
116-
}
117-
return null;
118-
}).where((c) => c != null).toList());
112+
decoration: BoxDecoration(
113+
border: style.border,
114+
color: style.backgroundColor,
115+
),
116+
children: children
117+
.map((c) {
118+
if (c is StyledElement && c.name == 'td' || c.name == 'th') {
119+
return TableCell(
120+
child: Container(
121+
padding: c.style.padding,
122+
decoration: BoxDecoration(
123+
color: c.style.backgroundColor,
124+
border: c.style.border,
125+
),
126+
child: RichText(text: context.parser.parseTree(context, c))));
127+
}
128+
return null;
129+
})
130+
.where((c) => c != null)
131+
.toList());
119132
}
120133
}
121134

@@ -128,22 +141,24 @@ class TableStyleElement extends StyledElement {
128141
}) : super(name: name, children: children, style: style, node: node);
129142
}
130143

131-
TableStyleElement parseTableDefinitionElement(
132-
dom.Element element, List<StyledElement> children) {
144+
TableStyleElement parseTableDefinitionElement(dom.Element element, List<StyledElement> children) {
133145
switch (element.localName) {
134146
case "colgroup":
135147
case "col":
136148
return TableStyleElement(
137-
name: element.localName,
138-
children: children,
139-
node: element
149+
name: element.localName,
150+
children: children,
151+
node: element,
140152
);
141153
default:
142154
return TableStyleElement();
143155
}
144156
}
157+
145158
LayoutElement parseLayoutElement(
146-
dom.Element element, List<StyledElement> children) {
159+
dom.Element element,
160+
List<StyledElement> children,
161+
) {
147162
switch (element.localName) {
148163
case "table":
149164
return TableLayoutElement(
@@ -161,11 +176,7 @@ LayoutElement parseLayoutElement(
161176
);
162177
break;
163178
case "tr":
164-
return TableRowLayoutElement(
165-
name: element.localName,
166-
children: children,
167-
node: element
168-
);
179+
return TableRowLayoutElement(name: element.localName, children: children, node: element);
169180
break;
170181
default:
171182
return TableLayoutElement(children: children);

0 commit comments

Comments
 (0)