OLD | NEW |
1 Sky Style Language | 1 Sky Style Language |
2 ================== | 2 ================== |
3 | 3 |
4 Planed changes | 4 Planed changes |
5 -------------- | 5 -------------- |
6 | 6 |
7 Add //-to-end-of-line comments to be consistent with the script | 7 Add //-to-end-of-line comments to be consistent with the script |
8 language. | 8 language. |
9 | 9 |
10 | 10 |
(...skipping 327 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
338 readonly attribute Boolean needsLayout; // means that a property with needsL
ayout:true has changed on this node or one of its descendants | 338 readonly attribute Boolean needsLayout; // means that a property with needsL
ayout:true has changed on this node or one of its descendants |
339 readonly attribute LayoutManager layoutManager; | 339 readonly attribute LayoutManager layoutManager; |
340 | 340 |
341 readonly attribute LayoutManager ownerLayoutManager; // defaults to the pare
ntNode.layoutManager | 341 readonly attribute LayoutManager ownerLayoutManager; // defaults to the pare
ntNode.layoutManager |
342 // if you are not the ownerLayoutManager, then ignore this StyleNode in la
yout() and paintChildren() | 342 // if you are not the ownerLayoutManager, then ignore this StyleNode in la
yout() and paintChildren() |
343 // using walkChildren() does this for you | 343 // using walkChildren() does this for you |
344 | 344 |
345 readonly attribute Boolean needsPaint; // means that either needsLayout is t
rue or a property with needsPaint:true has changed on this node or one of its de
scendants | 345 readonly attribute Boolean needsPaint; // means that either needsLayout is t
rue or a property with needsPaint:true has changed on this node or one of its de
scendants |
346 | 346 |
347 // only the ownerLayoutManager can change these | 347 // only the ownerLayoutManager can change these |
348 readonly attribute Float x; | 348 readonly attribute Float x; // relative to left edge of ownerLayoutManager |
349 readonly attribute Float y; | 349 readonly attribute Float y; // relative to top edge of ownerLayoutManager |
350 readonly attribute Float width; | 350 readonly attribute Float width; |
351 readonly attribute Float height; | 351 readonly attribute Float height; |
352 } | 352 } |
353 | 353 |
354 The flattened tree is represented as a hierarchy of Node objects. For | 354 The flattened tree is represented as a hierarchy of Node objects. For |
355 any element that only contains text node children, the "text" property | 355 any element that only contains text node children, the "text" property |
356 is set accordingly. For elements with mixed text node and non-text | 356 is set accordingly. For elements with mixed text node and non-text |
357 node children, each run of text nodes is represented as a separate | 357 node children, each run of text nodes is represented as a separate |
358 Node with the "text" property set accordingly and the styles set as if | 358 Node with the "text" property set accordingly and the styles set as if |
359 the Node inherited everything inheritable from its parent. | 359 the Node inherited everything inheritable from its parent. |
(...skipping 69 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
429 virtual LayoutValueRange getIntrinsicHeight(Float? defaultHeight = null); | 429 virtual LayoutValueRange getIntrinsicHeight(Float? defaultHeight = null); |
430 // returns min-height, height, and max-height, normalised, defaulting to v
alues given in LayoutValueRange | 430 // returns min-height, height, and max-height, normalised, defaulting to v
alues given in LayoutValueRange |
431 // if argument is provided, it overrides height | 431 // if argument is provided, it overrides height |
432 | 432 |
433 virtual Dimensions layout(Number? width, Number? height); | 433 virtual Dimensions layout(Number? width, Number? height); |
434 // returns { } | 434 // returns { } |
435 // the return value should include the final value for whichever of the wi
dth and height arguments that is null | 435 // the return value should include the final value for whichever of the wi
dth and height arguments that is null |
436 // TODO(ianh): should we just grab the width and height from assumeDimensi
ons()? | 436 // TODO(ianh): should we just grab the width and height from assumeDimensi
ons()? |
437 | 437 |
438 void paint(RenderingSurface canvas); | 438 void paint(RenderingSurface canvas); |
439 // set a clip rect on the canvas | 439 // set a clip rect on the canvas for rect(0,0,this.width,this.height) |
440 // call the painter of each property, in order they were registered, which
on this element has a painter | 440 // call the painter of each property, in order they were registered, which
on this element has a painter |
441 // call this.paintChildren() | 441 // call this.paintChildren() |
442 // unset the clip | 442 // unset the clip |
443 | 443 |
444 virtual void paintChildren(RenderingSurface canvas); | 444 virtual void paintChildren(RenderingSurface canvas); |
445 // just calls paint() for each child returned by walkChildren() whose need
sPaint is true | 445 // just calls paint() for each child returned by walkChildren() whose need
sPaint is true, |
| 446 // after transforming the coordinate space by translate(child.x,child.y) |
446 | 447 |
447 virtual Node hitTest(Float x, Float y); | 448 virtual Node hitTest(Float x, Float y); |
448 // default implementation uses the node's children nodes' x, y, | 449 // default implementation uses the node's children nodes' x, y, |
449 // width, and height, skipping any that have width=0 or height=0, or | 450 // width, and height, skipping any that have width=0 or height=0, or |
450 // whose ownerLayoutManager is not |this| | 451 // whose ownerLayoutManager is not |this| |
451 // default implementation walks the tree backwards from its built-in order | 452 // default implementation walks the tree backwards from its built-in order |
452 // if no child is hit, then return this.node | 453 // if no child is hit, then return this.node |
453 // override this if you changed your children's z-order, or if you used ta
ke() to | 454 // override this if you changed your children's z-order, or if you used ta
ke() to |
454 // hoist some descendants up to be your responsibility, or if your childre
n aren't | 455 // hoist some descendants up to be your responsibility, or if your childre
n aren't |
455 // rectangular (e.g. you lay them out in a hex grid) | 456 // rectangular (e.g. you lay them out in a hex grid) |
| 457 // make sure to offset the value you pass your children: child.layoutManag
er.hitTest(x-child.x, y-child.y) |
456 | 458 |
457 } | 459 } |
458 | 460 |
459 dictionary LayoutValueRange { | 461 dictionary LayoutValueRange { |
460 // negative values here should be treated as zero | 462 // negative values here should be treated as zero |
461 Float minimum = 0; | 463 Float minimum = 0; |
462 Float value = 0; // ideal desired width; if it's not in the range minimum ..
maximum then it overrides minimum and maximum | 464 Float value = 0; // ideal desired width; if it's not in the range minimum ..
maximum then it overrides minimum and maximum |
463 (Float or Infinity) maximum = Infinity; | 465 (Float or Infinity) maximum = Infinity; |
464 } | 466 } |
465 | 467 |
(...skipping 13 matching lines...) Expand all Loading... |
479 | 481 |
480 Paint | 482 Paint |
481 ----- | 483 ----- |
482 | 484 |
483 callback void Painter (StyleNode node, RenderingSurface canvas); | 485 callback void Painter (StyleNode node, RenderingSurface canvas); |
484 | 486 |
485 class RenderingSurface { | 487 class RenderingSurface { |
486 // ... | 488 // ... |
487 } | 489 } |
488 | 490 |
| 491 The convention is that the layout manager who calls your paint will |
| 492 have transformed the coordinate space so that you should assume that |
| 493 your top-left pixel is at 0,0. |
| 494 |
489 | 495 |
490 Default Styles | 496 Default Styles |
491 -------------- | 497 -------------- |
492 | 498 |
493 In the constructors for the default elements, they add to themselves | 499 In the constructors for the default elements, they add to themselves |
494 StyleDeclaration objects as follows: | 500 StyleDeclaration objects as follows: |
495 | 501 |
496 * ``import`` | 502 * ``import`` |
497 * ``template`` | 503 * ``template`` |
498 * ``style`` | 504 * ``style`` |
(...skipping 23 matching lines...) Expand all Loading... |
522 * ``error`` | 528 * ``error`` |
523 This adds to itself the declaration with value: | 529 This adds to itself the declaration with value: |
524 ``{ display: { value: sky.ErrorLayoutManager } }`` | 530 ``{ display: { value: sky.ErrorLayoutManager } }`` |
525 | 531 |
526 The ``div`` element doesn't have any default styles. | 532 The ``div`` element doesn't have any default styles. |
527 | 533 |
528 These declarations are all shared between all the elements (so e.g. if | 534 These declarations are all shared between all the elements (so e.g. if |
529 you reach in and change the declaration that was added to a ``title`` | 535 you reach in and change the declaration that was added to a ``title`` |
530 element, you're going to change the styles of all the other | 536 element, you're going to change the styles of all the other |
531 default-hidden elements). | 537 default-hidden elements). |
OLD | NEW |