Skip to content
This repository was archived by the owner on Mar 3, 2025. It is now read-only.

Commit 4045c72

Browse files
thizethize
committed
[Update] Simple Type
1 parent 9ff04be commit 4045c72

12 files changed

+67
-33
lines changed

‎README.md

100755100644
File mode changed.

‎images/icon@1x.png

100755100644
File mode changed.

‎images/icon@2x.png

100755100644
File mode changed.

‎manifest.json

100755100644
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,5 +42,5 @@
4242
}
4343
}
4444
],
45-
"version": "3.3.1"
45+
"version": "3.3.2"
4646
}

‎src/widgets/children.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,10 @@ class Children {
5656
simpleType(widgets) {
5757
const { fix } = require("../util");
5858
return `
59-
[${widgets}].to${this.type}(${this.stackAlignment})${this.columnOrRowMainAlignment}${this.columnOrRowCrossAlignment}.w(${fix(this.w)}).h(${fix(this.h)})
59+
${this.type}(
60+
${this.stackAlignment}
61+
children: <Widget>[${widgets},],
62+
)${this.columnOrRowMainAlignment}${this.columnOrRowCrossAlignment}.w(${fix(this.w)}).h(${fix(this.h)})
6063
`;
6164
}
6265

‎src/widgets/container.js

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,8 @@ class ContainerWidget {
7171
const tl = radii.topLeft, tr = radii.topRight, br = radii.bottomRight, bl = radii.bottomLeft;
7272
noCorner = tl == 0 && tl === tr && tl === br && tl === bl;
7373
}
74-
if (!xdNode.strokeEnabled && noCorner && !xdNode.shadow.visible && xdNode.fill instanceof xd.Color) {
75-
d = `.backgroundColor(${getColor(xdNode.fill)})`;
74+
if (!xdNode.strokeEnabled && noCorner && (xdNode.shadow == null || !xdNode.shadow.visible) && xdNode.fill instanceof xd.Color) {
75+
d = `.bgColor(${getColor(xdNode.fill)})`;
7676
} else {
7777
d = getStyledDecoration(xdNode, parameters);
7878
}
@@ -87,9 +87,8 @@ function getProp(xdNode, prop) {
8787
return o && o[prop];
8888
}
8989

90-
9190
function getStyledAlignmentByFather(node, fatherNode) {
92-
const { xdAlignmentToDartAlignment } = require("./util/xd_alignment_to_dart_alignment");
91+
const { xdAlignmentToStyledDartAlignment } = require("./util/xd_alignment_to_dart_alignment");
9392
const top = node.bounds.y1 - fatherNode.bounds.y1;
9493
const right = fatherNode.bounds.x2 - node.bounds.x2;
9594
const bot = fatherNode.bounds.y2 - node.bounds.y2;
@@ -98,12 +97,12 @@ function getStyledAlignmentByFather(node, fatherNode) {
9897
const alignY = (top / (top + auxBot));
9998
let auxRight = right == 0 && left == 0 ? 1 : right;
10099
const alignX = (left / (left + auxRight));
101-
const resAlignment = xdAlignmentToDartAlignment(alignX, alignY);
102-
if (resAlignment == 'Alignment.center') {
103-
return `${node.toDart()}.center()`;
104-
}
105-
if (resAlignment != 'Alignment.topLeft') {
106-
return `${node.toDart()}.alignment(${resAlignment})`;
100+
const resAlignment = xdAlignmentToStyledDartAlignment(alignX, alignY);
101+
if (resAlignment[0] != '.topLeft') {
102+
if (resAlignment.length == 1) {
103+
return `${node.toDart()}${resAlignment[0]}`;
104+
}
105+
return `${node.toDart()}.alignment(${resAlignment[0]},${resAlignment[1]})`;
107106
}
108107
if (onlyTag) return '';
109108
return node.toDart();

‎src/widgets/grid.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ class GridWidget {
1212
if (withStyledWidget) {
1313
return `Container(
1414
// [${this.xdNode.name}] Repeat grid aren't supported
15-
).w(${this.xdNode.localBounds.width}).h(${this.xdNode.localBounds.height}).backgroundColor(Colors.red)`;
15+
).w(${this.xdNode.localBounds.width}).h(${this.xdNode.localBounds.height}).bgColor(Colors.red)`;
1616
}
1717
return `
1818
Container(

‎src/widgets/mask.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ class MaskWidget {
1616
if (withStyledWidget) {
1717
return `Container(
1818
// [${this.xdNode.name}] Group masks aren't supported.
19-
).w(${this.xdNode.localBounds.width}).h(${this.xdNode.localBounds.height}).backgroundColor(Colors.red)`;
19+
).w(${this.xdNode.localBounds.width}).h(${this.xdNode.localBounds.height}).bgColor(Colors.red)`;
2020
}
2121
return `
2222
Container(

‎src/widgets/svg.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -33,10 +33,9 @@ class SvgWidget {
3333
let withStyledWidget = document.querySelector('input[name="simpleType"]');
3434
withStyledWidget = withStyledWidget != null ? withStyledWidget.checked : null;
3535
if (withStyledWidget) {
36-
return `SvgPicture.asset(
36+
return `
3737
//TODO: ${node.name}
38-
'assets/${node.name.replace('svg_', '')}.svg',
39-
).w(${fix(width)}).h(${fix(height)})`;
38+
'assets/${node.name.replace('svg_', '')}.svg'.svgAsset().w(${fix(width)}).h(${fix(height)})`;
4039
}
4140
return `SvgPicture.asset(
4241
//TODO: ${node.name}
@@ -97,10 +96,9 @@ class Path {
9796
let withStyledWidget = document.querySelector('input[name="simpleType"]');
9897
withStyledWidget = withStyledWidget != null ? withStyledWidget.checked : null;
9998
if (withStyledWidget) {
100-
return `SvgPicture.string(
99+
return `
101100
// ${this.xdNode.name}
102-
${svg},
103-
).w(${fix(width)}).h(${fix(height)})`;
101+
${svg}.svgString().w(${fix(width)}).h(${fix(height)})`;
104102
}
105103
return `SvgPicture.string(
106104
// ${this.xdNode.name}

‎src/widgets/text.js

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -105,13 +105,15 @@ function _borderText(xdNode, dartCode) {
105105
}
106106

107107
function styledText(xdNode, textParam) {
108+
//TODO: tAlignment
108109
const { getOpacity } = require("../util");
109-
const c = `.textColor(${getColor(xdNode.fill, getOpacity(xdNode))})`;
110-
const fs = `.fontSize(${xdNode.fontSize})`;
110+
const al = _getStyledTextAlign(xdNode);
111+
const c = `.color(${getColor(xdNode.fill, getOpacity(xdNode))})`;
112+
const fs = `.size(${xdNode.fontSize})`;
111113
const weight = _getFontWeight(xdNode.fontStyle);
112-
const fw = weight ? `.fontWeight(${weight})` : '';
114+
const fw = weight ? `.weight(${weight})` : '';
113115
const family = _getFontFamilyName(xdNode);
114-
const ff = googleFonts.includes(family) ? `.textStyle(GoogleFonts.${family}())` : `.fontFamily('${_getFontFamily(xdNode)}')`;
116+
const ff = googleFonts.includes(family) ? `.textStyle(GoogleFonts.${family}())` : `.family('${_getFontFamily(xdNode)}')`;
115117
//! Text Shadow
116118
const shadow = xdNode.shadow;
117119
let ts = '';
@@ -122,7 +124,7 @@ function styledText(xdNode, textParam) {
122124
const x = shadow.x;
123125
const y = shadow.y;
124126
const offset = (x || y ? x == 0 && y == 0 ? '' : `, offset: Offset(${x}, ${y}),` : '');
125-
ts = `.textShadow(${blur}${color}${offset})`;
127+
ts = `.shadow(${blur}${color}${offset})`;
126128
}
127129
//! Text Decoration
128130
let td = '';
@@ -142,9 +144,9 @@ function styledText(xdNode, textParam) {
142144
const sc = xdSec == 'round' ? '' : `cap: StrokeCap.${xdSec},`;
143145
const sj = xdSj == 'round' ? '' : `join: StrokeJoin.${xdSj},`;
144146
const sw = xdNode.strokeWidth == 6 ? '' : `width: ${xdNode.strokeWidth},`;
145-
tb = `.textBorder(color:${getColor(xdNode.stroke, getOpacity(xdNode))},${sw}${sc}${sj})`;
147+
tb = `.border(color:${getColor(xdNode.stroke, getOpacity(xdNode))},${sw}${sc}${sj})`;
146148
}
147-
return `Text(${textParam})${ff}${c}${fs}${fw}${ts}${td}${tb}`;
149+
return `${textParam}.text()${ff}${c}${al}${fs}${fw}${ts}${td}${tb}`;
148150
}
149151

150152
function escapeString(str) {
@@ -294,7 +296,7 @@ function _getHeightParam(o) {
294296
}
295297

296298
function _getShadowsParam(xdNode) {
297-
return (xdNode.shadow == null || !xdNode.shadow.visible ? '' :
299+
return ((xdNode.shadow == null || !xdNode.shadow.visible) ? '' :
298300
`shadows: [${_getShadow(xdNode.shadow)}], `);
299301
}
300302

@@ -310,6 +312,14 @@ function _getTextAlign(align) {
310312
align === 'center' ? 'center' : 'left');
311313
}
312314

315+
function _getStyledTextAlign(xdNode) {
316+
const align = xdNode.textAlign;
317+
if (align == 'left') return '';
318+
if (align == 'right') return '.tRight';
319+
if (align == 'center') return '.tCenter';
320+
return '';
321+
}
322+
313323
function _getFontStyle(style) {
314324
style = style.toLowerCase();
315325
let match = style.match(FONT_STYLES_RE);

‎src/widgets/util/decorations.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ function getColorOrDecorationParam(xdNode, parameters) {
2525
const tl = radii.topLeft, tr = radii.topRight, br = radii.bottomRight, bl = radii.bottomLeft;
2626
noCorner = tl == 0 && tl === tr && tl === br && tl === bl;
2727
}
28-
if (!xdNode.strokeEnabled && noCorner && !xdNode.shadow.visible && xdNode.fill instanceof xd.Color) {
28+
if (!xdNode.strokeEnabled && noCorner && (xdNode.shadow == null || !xdNode.shadow.visible) && xdNode.fill instanceof xd.Color) {
2929
return _getFillParam(xdNode, parameters);
3030
} else {
3131
return getDecorationParam(xdNode, parameters);
@@ -160,7 +160,7 @@ function _getBorderRadiusForRectangle(o) {
160160
if (tl === tr && tl === br && tl === bl) {
161161
let withStyledWidget = document.querySelector('input[name="simpleType"]');
162162
withStyledWidget = withStyledWidget != null ? withStyledWidget.checked : null;
163-
if (withStyledWidget) return `${tl}.circularBorder`;
163+
if (withStyledWidget) return `${tl}.circularBorderRadius()`;
164164
return `BorderRadius.circular(${tl})`;
165165
} else {
166166
if ((tl == tr || (tl <= 1 && tr <= 1)) && (br == bl || (br <= 1 && bl <= 1))) {
@@ -189,8 +189,8 @@ function _getRadiusParam(param, value) {
189189
if (value <= 1) { return ''; }
190190
let withStyledWidget = document.querySelector('input[name="simpleType"]');
191191
withStyledWidget = withStyledWidget != null ? withStyledWidget.checked : null;
192-
if (withStyledWidget) return `${param}: ${value}.circular, `;
193-
return `${param}: aRadius.circular(${value}), `;
192+
if (withStyledWidget) return `${param}: ${value}.circularRadius(), `;
193+
return `${param}: Radius.circular(${value}), `;
194194
}
195195

196196

‎src/widgets/util/xd_alignment_to_dart_alignment.js

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ function xdAlignmentToDartAlignment(x, y) {
66
const dy = fix(fixAlignment(y));
77
const align = `Alignment(${dx},${dy})`;
88
const dif = Math.abs(dx - dy);
9-
if(dif < 0.02) return 'Alignment.center';
9+
if (dif < 0.02) return 'Alignment.center';
1010
return nameAlignment[align] ? nameAlignment[align] : align;
1111
}
1212

@@ -22,7 +22,31 @@ const nameAlignment = {
2222
'Alignment(0.0,1.0)': 'Alignment.bottomCenter',
2323
}
2424

25+
function xdAlignmentToStyledDartAlignment(x, y) {
26+
const { fix } = require('../../util');
27+
/// 0 to 1, have to be -1 to 1
28+
const dx = fix(fixAlignment(x));
29+
const dy = fix(fixAlignment(y));
30+
const align = `Alignment(${dx},${dy})`;
31+
const dif = Math.abs(dx - dy);
32+
if (dif < 0.02) return ['.center()'];
33+
return nameStyleAlignment[align] ? [nameStyleAlignment[align]] : [dx, dy];
34+
}
35+
36+
const nameStyleAlignment = {
37+
'Alignment(-1.0,-1.0)': '.topLeft',
38+
'Alignment(1.0,-1.0)': '.topRight',
39+
'Alignment(0.0,-1.0)': '.topCenter',
40+
'Alignment(1.0,0.0)': '.centerRight',
41+
'Alignment(-1.0,0.0)': '.centerLeft',
42+
'Alignment(0.0,0.0)': '.center()',
43+
'Alignment(1.0,1.0)': '.bottomRight',
44+
'Alignment(-1.0,1.0)': '.bottomLeft',
45+
'Alignment(0.0,1.0)': '.bottomCenter',
46+
}
47+
2548
exports.xdAlignmentToDartAlignment = xdAlignmentToDartAlignment;
49+
exports.xdAlignmentToStyledDartAlignment = xdAlignmentToStyledDartAlignment;
2650

2751
/// 0 => -1
2852
/// 0.5 => 0

0 commit comments

Comments
 (0)