git.iko.soy/unity8
on xenial help sign in
Rework header row/column creation
f66f9d3Albert Astals
plugins/Dash/CardCreator.js+37−33
compare with xenial
unifiedsplit
@@ -141,7 +141,16 @@ var headerRowCode = 'Row { \n\
141 %1 \n\
141 %1 \n\
142 %2 \n\
142 %2 \n\
143 anchors.right: parent.right; \n\
143 anchors.right: parent.right; \n\
144− anchors.margins: margins;\n';
144+ anchors.margins: margins;\n\
145+ %3 \n\
146+ }\n';
147+
148+var headerColumnCode = 'Column { \n\
149+ anchors.verticalCenter: parent.verticalCenter; \n\
150+ spacing: units.dp(2); \n\
151+ width: parent.width - x;\n\
152+ %1 \n\
153+ }\n';
145
154
146var mascotShapeLoaderCode = 'Loader { \n\
155var mascotShapeLoaderCode = 'Loader { \n\
147 id: mascotShapeLoader; \n\
156 id: mascotShapeLoader; \n\
@@ -311,7 +320,6 @@ function cardString(template, components) {
311
320
312 if (hasHeaderRow) {
321 if (hasHeaderRow) {
313 code += 'readonly property int headerHeight: row.height + row.margins * 2;\n'
322 code += 'readonly property int headerHeight: row.height + row.margins * 2;\n'
314− code += headerRowCode.arg(headerVerticalAnchors).arg(headerLeftAnchor);
315 } else if (hasMascot) {
323 } else if (hasMascot) {
316 code += 'readonly property int headerHeight: mascotImage.height + units.gu(1) * 2;\n'
324 code += 'readonly property int headerHeight: mascotImage.height + units.gu(1) * 2;\n'
317 } else if (hasSubtitle) {
325 } else if (hasSubtitle) {
@@ -322,6 +330,7 @@ function cardString(template, components) {
322 code += 'readonly property int headerHeight: 0;\n'
330 code += 'readonly property int headerHeight: 0;\n'
323 }
331 }
324
332
333+ var mascotCode = "";
325 if (hasMascot) {
334 if (hasMascot) {
326 var useMascotShape = !hasBackground && !headerAsOverlay;
335 var useMascotShape = !hasBackground && !headerAsOverlay;
327 var anchors = "";
336 var anchors = "";
@@ -336,15 +345,16 @@ function cardString(template, components) {
336 }
345 }
337
346
338 if (useMascotShape) {
347 if (useMascotShape) {
339− code += mascotShapeLoaderCode.arg(anchors);
348+ mascotCode += mascotShapeLoaderCode.arg(anchors);
340 }
349 }
341
350
342 var mascotImageVisible = useMascotShape ? 'false' : 'showHeader';
351 var mascotImageVisible = useMascotShape ? 'false' : 'showHeader';
343− code += mascotImageCode.arg(anchors).arg(mascotImageVisible);
352+ mascotCode += mascotImageCode.arg(anchors).arg(mascotImageVisible);
344 }
353 }
345
354
346 var summaryColorWithBackground = 'backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < 0.7 ? "white" : "grey"';
355 var summaryColorWithBackground = 'backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < 0.7 ? "white" : "grey"';
347
356
357+ var titleSubtitleCode = "";
348 if (hasTitle) {
358 if (hasTitle) {
349 var color;
359 var color;
350 if (headerAsOverlay) {
360 if (headerAsOverlay) {
@@ -357,37 +367,29 @@ function cardString(template, components) {
357 color = '"grey"';
367 color = '"grey"';
358 }
368 }
359
369
360− var titleAnchors = "";
370+ var titleAnchors;
361− var subtitleAnchors = "";
371+ var subtitleAnchors;
362 if (hasMascot && hasSubtitle) {
372 if (hasMascot && hasSubtitle) {
373+ // Using row + column
363 titleAnchors = 'anchors { left: parent.left; right: parent.right }\n';
374 titleAnchors = 'anchors { left: parent.left; right: parent.right }\n';
364 subtitleAnchors = titleAnchors;
375 subtitleAnchors = titleAnchors;
365− code += 'Column { \n\
366− anchors.verticalCenter: parent.verticalCenter; \n\
367− spacing: units.dp(2); \n\
368− width: parent.width - x;\n';
369 } else if (hasMascot) {
376 } else if (hasMascot) {
377+ // Using row + label
370 titleAnchors = 'anchors.verticalCenter: parent.verticalCenter;\n'
378 titleAnchors = 'anchors.verticalCenter: parent.verticalCenter;\n'
371− } else if (headerAsOverlay) {
372− titleAnchors = 'anchors.left: parent.left; \n\
373− anchors.leftMargin: units.gu(1); \n\
374− anchors.right: parent.right; \n\
375− anchors.top: overlayLoader.top; \n\
376− anchors.topMargin: units.gu(1);\n';
377− subtitleAnchors = 'anchors.left: titleLabel.left; \n\
378− anchors.leftMargin: titleLabel.leftMargin; \n\
379− anchors.right: titleLabel.right; \n\
380− anchors.top: titleLabel.bottom; \n\
381− anchors.topMargin: units.dp(2);\n';
382 } else {
379 } else {
383− titleAnchors = "anchors.right: parent.right;";
380+ if (headerAsOverlay) {
384− if (hasMascot) {
381+ // Using anchors to the overlay
385− titleAnchors += 'anchors.left: mascotImage.right; \n\
382+ titleAnchors = 'anchors.left: parent.left; \n\
386− anchors.leftMargin: units.gu(1);\n';
383+ anchors.leftMargin: units.gu(1); \n\
384+ anchors.right: parent.right; \n\
385+ anchors.top: overlayLoader.top; \n\
386+ anchors.topMargin: units.gu(1);\n';
387 } else {
387 } else {
388+ // Using anchors to the mascot/parent
389+ titleAnchors = "anchors.right: parent.right;";
388 titleAnchors += headerLeftAnchor;
390 titleAnchors += headerLeftAnchor;
391+ titleAnchors += headerVerticalAnchors;
389 }
392 }
390− titleAnchors += headerVerticalAnchors;
391 subtitleAnchors = 'anchors.left: titleLabel.left; \n\
393 subtitleAnchors = 'anchors.left: titleLabel.left; \n\
392 anchors.leftMargin: titleLabel.leftMargin; \n\
394 anchors.leftMargin: titleLabel.leftMargin; \n\
393 anchors.right: titleLabel.right; \n\
395 anchors.right: titleLabel.right; \n\
@@ -396,20 +398,22 @@ function cardString(template, components) {
396 }
398 }
397
399
398 var titleLabelVisibleExtra = (headerAsOverlay ? '&& overlayLoader.active': '');
400 var titleLabelVisibleExtra = (headerAsOverlay ? '&& overlayLoader.active': '');
399− code += titleLabelCode.arg(titleAnchors).arg(color).arg(titleLabelVisibleExtra);
401+ titleSubtitleCode += titleLabelCode.arg(titleAnchors).arg(color).arg(titleLabelVisibleExtra);
400
402
401 if (hasSubtitle) {
403 if (hasSubtitle) {
402− code += subtitleLabelCode.arg(subtitleAnchors).arg(color);
404+ titleSubtitleCode += subtitleLabelCode.arg(subtitleAnchors).arg(color);
405+ }
403
406
404− // Close Column
405− if (hasMascot)
407+ if (hasMascot && hasSubtitle) {
406− code += '}\n';
408+ // If using row + column wrap the code in the column
409+ titleSubtitleCode = headerColumnCode.arg(titleSubtitleCode);
407 }
410 }
408 }
411 }
409
412
410 if (hasHeaderRow) {
413 if (hasHeaderRow) {
411− // Close Row
414+ code += headerRowCode.arg(headerVerticalAnchors).arg(headerLeftAnchor).arg(mascotCode + titleSubtitleCode);
412− code += '}\n';
415+ } else {
416+ code += mascotCode + titleSubtitleCode;
413 }
417 }
414
418
415 if (hasSummary) {
419 if (hasSummary) {