| OLD | NEW |
| 1 SKY MODULE | 1 SKY MODULE |
| 2 <import src="sky:core" as="sky"/> | 2 <import src="sky:core" as="sky"/> |
| 3 <!-- | 3 <!-- |
| 4 ! this module provides trivial vertical block layout | 4 ! this module provides trivial vertical block layout |
| 5 ! no margins, padding, borders, etc | 5 ! no margins, padding, borders, etc |
| 6 !--> | 6 !--> |
| 7 <script> | 7 <script> |
| 8 module.exports.BlockLayoutManager = class BlockLayoutManager extends sky.Layout
Manager { | 8 module.exports.BlockLayoutManager = class BlockLayoutManager extends sky.Layout
Manager { |
| 9 function layout(width, height) { | 9 function layout(width, height) { |
| 10 this.markAsLaidOut(); | |
| 11 if (width == null) | 10 if (width == null) |
| 12 width = this.getIntrinsicWidth().value; | 11 width = this.getIntrinsicWidth().value; |
| 13 let autoHeight = false; | 12 let autoHeight = false; |
| 14 if (height == null) { | 13 if (height == null) { |
| 15 height = 0; | 14 height = 0; |
| 16 autoHeight = true; | 15 autoHeight = true; |
| 17 } | 16 } |
| 18 this.assumeDimensions(width, height); | 17 this.assumeDimensions(width, height); |
| 19 let children = this.walkChildren(); | 18 let children = this.walkChildren(); |
| 20 let loop = children.next(); | 19 let loop = children.next(); |
| 21 let y = 0; | 20 let y = 0; |
| 22 while (!loop.done) { | 21 while (!loop.done) { |
| 23 let child = loop.value; | 22 let child = loop.value; |
| 24 if (child.needsLayout || child.descendantNeedsLayout) { | 23 if (child.needsLayout || child.descendantNeedsLayout) { |
| 25 let dims = child.layoutManager.layout(width, null); | 24 let dims = child.layoutManager.layout(width, null); |
| 26 this.setChildSize(child, dims.width, dims.height); | 25 this.setChildSize(child, dims.width, dims.height); |
| 27 } | 26 } |
| 28 this.setChildPosition(child, 0, y); | 27 this.setChildPosition(child, 0, y); |
| 29 y += child.height; | 28 y += child.height; |
| 30 loop = children.next(); | 29 loop = children.next(); |
| 31 } | 30 } |
| 32 if (autoHeight) | 31 if (autoHeight) |
| 33 height = y; | 32 height = y; |
| 33 this.markAsLaidOut(); |
| 34 return { | 34 return { |
| 35 width: width, | 35 width: width, |
| 36 height: height, | 36 height: height, |
| 37 } | 37 } |
| 38 } | 38 } |
| 39 function layoutDescendants() { |
| 40 this.layout(node.width, node.height); |
| 41 } |
| 39 function getIntrinsicWidth() { | 42 function getIntrinsicWidth() { |
| 40 let width = this.node.getProperty('width'); | 43 let width = this.node.getProperty('width'); |
| 41 if (typeof width != 'number') { | 44 if (typeof width != 'number') { |
| 42 // e.g. width: auto | 45 // e.g. width: auto |
| 43 width = 0; | 46 width = 0; |
| 44 let children = this.walkChildren(); | 47 let children = this.walkChildren(); |
| 45 let loop = children.next(); | 48 let loop = children.next(); |
| 46 while (!loop.done) { | 49 while (!loop.done) { |
| 47 let child = loop.value; | 50 let child = loop.value; |
| 48 let childWidth = child.layoutManager.getIntrinsicWidth(); | 51 let childWidth = child.layoutManager.getIntrinsicWidth(); |
| (...skipping 17 matching lines...) Expand all Loading... |
| 66 if (height < childHeight.value) | 69 if (height < childHeight.value) |
| 67 height = childHeight.value; | 70 height = childHeight.value; |
| 68 loop = children.next(); | 71 loop = children.next(); |
| 69 } | 72 } |
| 70 } | 73 } |
| 71 return super(height); // applies and provides our own min-height/max-height
rules | 74 return super(height); // applies and provides our own min-height/max-height
rules |
| 72 } | 75 } |
| 73 } | 76 } |
| 74 sky.registerLayoutManager('block', module.exports.BlockLayoutManager); | 77 sky.registerLayoutManager('block', module.exports.BlockLayoutManager); |
| 75 </script> | 78 </script> |
| OLD | NEW |