Simple Section Tile Layout Manager


/ Published in: ActionScript 3
Save to your folder(s)

This layout manager doesn't support virtualization.


Copy this code and paste it in your HTML
  1. //see Evtim Georgiev article http://www.adobe.com/devnet/flex/articles/spark_layouts.html
  2. package org.corlan.layout {
  3.  
  4. import mx.core.ILayoutElement;
  5. import spark.components.supportClasses.GroupBase;
  6. import spark.layouts.BasicLayout;
  7.  
  8. public class SectionListLayout extends BasicLayout {
  9.  
  10. private var _horizontalGap:Number = 0;
  11. private var _verticalGap:Number = 0;
  12. private var explicitColumnWidth:Number;
  13. private var _columnWidth:Number = 250;
  14.  
  15. public function SectionListLayout() {
  16. super();
  17. }
  18.  
  19. public function set horizontalGap(value:Number):void {
  20. _horizontalGap = value;
  21.  
  22. // We must invalidate the layout
  23. var layoutTarget:GroupBase = target;
  24. if (layoutTarget) {
  25. layoutTarget.invalidateSize();
  26. layoutTarget.invalidateDisplayList();
  27. }
  28. }
  29.  
  30. public function set verticalGap(value:Number):void {
  31. _verticalGap = value;
  32.  
  33. // We must invalidate the layout
  34. var layoutTarget:GroupBase = target;
  35. if (layoutTarget) {
  36. layoutTarget.invalidateSize();
  37. layoutTarget.invalidateDisplayList();
  38. }
  39. }
  40.  
  41. public function set columnWidth(value:Number):void {
  42. explicitColumnWidth = value;
  43. if (value == _columnWidth)
  44. return;
  45.  
  46. _columnWidth = value;
  47. var layoutTarget:GroupBase = target;
  48. if (layoutTarget) {
  49. layoutTarget.invalidateSize();
  50. layoutTarget.invalidateDisplayList();
  51. }
  52. }
  53.  
  54. // When extending the BasicLayout
  55. // you have to override this method
  56. override public function measure():void {
  57.  
  58. }
  59.  
  60. //
  61. override public function updateDisplayList(containerWidth:Number, containerHeight:Number):void {
  62. // The position for the first element
  63. var x:Number = 0;
  64. var y:Number = 0;
  65. var maxWidth:Number = 0;
  66. var maxHeight:Number = 0;
  67. var elementWidth:Number, elementHeight:Number;
  68.  
  69. // loop through the elements
  70. var layoutTarget:GroupBase = target;
  71. var count:int = layoutTarget.numElements;
  72. var element:ILayoutElement;
  73. for (var i:int = 0; i < count; i++) {
  74. // get the current element, we're going to work with the
  75. // ILayoutElement interface
  76. element = useVirtualLayout ?
  77. layoutTarget.getVirtualElementAt(i) :
  78. layoutTarget.getElementAt(i);
  79.  
  80. // Resize the element to its preferred size by passing
  81. // NaN for the width and height constraints
  82. element.setLayoutBoundsSize(NaN, NaN);
  83. elementHeight = element.getLayoutBoundsHeight();
  84. if ((element as Object).data
  85. && (element as Object).data.section) {
  86.  
  87. element.setLayoutBoundsSize(containerWidth, elementHeight);
  88. elementWidth = containerWidth;
  89. } else {
  90. element.setLayoutBoundsSize(_columnWidth, elementHeight);
  91. elementWidth = _columnWidth;
  92. }
  93.  
  94. // Would the element fit on this line, or should we move
  95. // to the next line?
  96. if (x + elementWidth > containerWidth) {
  97. x = 0;
  98. y += elementHeight + _verticalGap;
  99. }
  100.  
  101. // Position the element
  102. element.setLayoutBoundsPosition(x, y);
  103.  
  104. // Find maximum element extents. This is needed for
  105. // the scrolling support.
  106. maxWidth = Math.max(maxWidth, x + elementWidth);
  107. maxHeight = Math.max(maxHeight, y + elementHeight);
  108.  
  109. // Update the current position, add the gap
  110. x += elementWidth + _horizontalGap;
  111. }
  112.  
  113. // Scrolling support - update the content size
  114. layoutTarget.setContentSize(maxWidth, maxHeight);
  115. }
  116. }
  117. }

URL: http://corlan.org/?p=2931

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.