development/flutter
development/flutter
1
0
Fork 0
mirror of https://github.com/flutter/flutter synced 2024-08-27 12:00:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Specs: update the layout and paint schemes to match discussions better

Browse source 
Review URL: https://codereview.chromium.org/745863002
This commit is contained in:
Hixie 2014-11-20 13:58:53 -08:00
parent 85817b24a0
commit edcbad7686
4 changed files with 27 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
examples/README.md
View file

@ -1,2 +1,3 @@
These are work-in-progress examples of how the language might look.
They won't currently work.
Some of these examples are examples of what sky supports now.
Others are examples of what sky hopes to one day support.
Therefore not all these examples actually work today.

2
examples/style/block-layout.sky
View file

@ -21,7 +21,7 @@ SKY MODULE
let y = 0;
while (!loop.done) {
let child = loop.value;
if (child.needsLayout) {
if (child.needsLayout || child.descendantNeedsLayout) {
let dims = child.layoutManager.layout(width, null);
this.setChildSize(child, dims.width, dims.height);
}

43
examples/style/hex-layout.sky
View file

@ -20,7 +20,7 @@
let y = 0;
while (!loop.done) {
let child = loop.value;
if (child.needsLayout) {
if (child.needsLayout || child.descendantNeedsLayout) {
child.layoutManager.layout(cellDim, cellDim);
// we ignore the size the child reported from layout(), and force it to the cell dimensions
this.setChildSize(child, cellDim, cellDim);
@ -40,30 +40,6 @@
height: height,
}
}
function getIntrinsicWidth() {
// this is the logic that LayoutManager.getIntrinsicWidth() has by default
// shown here because I wrote it before realising it should be the default
let width = this.node.getProperty('width');
if (typeof width != 'number')
width = 0;
let minWidth = this.node.getProperty('min-width');
if (typeof width != 'number')
minWidth = 0;
let maxWidth = this.node.getProperty('max-width');
if (typeof width != 'number')
maxWidth = Infinity;
if (maxWidth < minWidth)
maxWidth = minWidth;
if (width > maxWidth)
width = maxWidth;
if (width < minWidth)
width = minWidth;
return {
minimum: minWidth,
value: width,
maximum: maxWidth,
};
}
function getIntrinsicHeight() {
let height = this.node.getProperty('height');
if (typeof height != 'number') {
@ -93,20 +69,19 @@
let loop = children.next();
while (!loop.done) {
let child = loop.value;
if (child.needsPaint) {
if (child.needsPaint || child.descendantNeedsPaint) {
canvas.save();
try {
canvas.beginPath();
canvas.translate(child.x, child.y);
canvas.moveTo(0, cellDim/4);
canvas.lineTo(cellDim/2, 0);
canvas.lineTo(cellDim, cellDim/4);
canvas.lineTo(cellDim, 3*cellDim/4);
canvas.lineTo(cellDim/2, cellDim);
canvas.moveTo(0, 3*cellDim/4);
canvas.moveTo(child.x, child.y + cellDim/4);
canvas.lineTo(child.x + cellDim/2, child.y);
canvas.lineTo(child.x + cellDim, child.y + cellDim/4);
canvas.lineTo(child.x + cellDim, child.y + 3*cellDim/4);
canvas.lineTo(child.x + cellDim/2, child.y + cellDim);
canvas.moveTo(child.x, child.y + 3*cellDim/4);
canvas.closePath();
canvas.clip();
child.paint(canvas);
this.paintChild(child);
} finally {
canvas.restore();
}

28
examples/style/toolbar-layout.sky
View file

@ -52,7 +52,7 @@ SKY MODULE
springCount += 1;
pendingSpacing = spacing; // not +=, because we only have one extra spacing per batch of springs
} else {
if (child.needsLayout) {
if (child.needsLayout || child.descendantNeedsLayout) {
childHeight = child.layoutManager.getIntrinsicHeight();
if (childHeight.value < height)
childHeight = childHeight.value;
@ -185,25 +185,25 @@ SKY MODULE
}
function paintChildren(canvas) {
let width = this.node.width;
let children = this.walkChildren();
let loop = children.next();
while ((!loop.done) && (loop.value != this.firstSkippedChild))
this.paintChild(loop.value, canvas);
if (this.showingOverflow)
this.paintChild(this.overflowChild, canvas);
}
function paintChild(child, canvas) {
if (child.needsPaint) {
canvas.save();
try {
canvas.beginPath();
canvas.translate(child.x, child.y);
canvas.rect(0, 0, child.width, child.height);
canvas.clip();
child.paint(canvas);
} finally {
canvas.restore();
}
}
function inChild(child, x, y) {
return (x >= child.x) && (y >= child.y) && (x < child.x+child.width) && (y < child.y+child.height);
}
function hitTest(x, y) {
let children = this.walkChildrenBackwards();
let loop = children.next();
while ((!loop.done) && (loop.value != this.firstSkippedChild))
if (this.inChild(loop.value, x, y))
return loop.value;
if (this.showingOverflow)
if (this.inChild(this.overflowChild, x, y))
return this.overflowChild;
}
}
sky.registerLayoutManager('toolbar', module.exports.ToolbarLayoutManager);