Abstract layout base class.

A layout is used to automatically distribute, align, or otherwise arrange the subviews of the view that contains it (it arranges the views that are it's siblings). Using a layout obviates the need to precisely position the views of an application and allows an application to resize or reconfigure gracefully according to the constraints of its container.

The layout class is a null layout — it does not arrange it's siblings. It is the base class that other layouts extend. simplelayout is a basic extension of the layout class. The example below illustrates using a simple layout to distribute views along the y axis.

Without a layout, it can be difficult to manually position your views A layout makes positioning simple and automatic ]]>

Layouts are so important, there is a shorthand for specifying them using the attribute of . The previous example could be more compactly specified:

A layout makes positioning simple and automatic ]]>

Because is the default layout, the above example could also have used just layout="axis: y".

Layouts, like constraints and animators, affect specific attributes of a view. Views can have more than one layout, as long as each set of attributes associated with a layout does not overlap with any of the other sets.

; if ( this.locked == locked ) return; if ( locked ){ this.lock(); } else { this.unlock(); } // Set locked to special default value of 2 to prevent updates until // __parentInit() is called. Set as early as possible - can't wait for // setter to be called. this.locked = 2 super.construct(view, args); this.subviews = []; this.vip = (this.immediateparent cast LzView); // view.layouts: If it doesn't already exist, layouts create an array //in the view that it attaches to that hold the list of layouts attached //to the view. if ( this.vip.layouts == null ){ this.vip.layouts = [ this ]; } else { this.vip.layouts.push( this ); } this.updateDelegate = new LzDelegate( this , "update" ); // register for unlock when parent inits, or unlock if already inited if (this.immediateparent.isinited) { this.__parentInit(); } else { new LzDelegate( this , "__parentInit", this.immediateparent, "oninit" ); } if ( this.__LZdeleted ) return; this.releaseLayout(true); super.destroy(); if ( this.locked ) { return; } //defalt behavior on reset is to update this.update( e ); var layoutAfter = sd.options['layoutAfter']; if ( layoutAfter ){ //this wants to get inserted in a specific place in the layout this.__LZinsertAfter( sd , layoutAfter ); } else { this.subviews.push ( sd ); } if ( ! sd.options['ignorelayout'] ){ this.addSubview( sd ); } var subviews = this.subviews; for ( var i = subviews.length-1; i >= 0; i-- ){ if ( subviews[ i ] == sd ){ subviews.splice( i , 1 ); break; } } this.reset(); //default behavior on addSubview is to reset var subviews = this.subviews; for (var i = subviews.length - 1; i >= 0; i-- ){ if ( subviews[ i ] == s ){ subviews.splice( i , 1 ); break; } } this.reset(); this.locked = true; this.locked = false; this.reset() // check for special value of 2, set in construct() if ( this.locked == 2){ if (this.isinited) { this.unlock(); } else { new LzDelegate( this , "unlock", this, "oninit" ); } } = 0 ; i-- ){ if ( this.vip.layouts[ i ] == this ){ this.vip.layouts.splice( i , 1 ); } } } ]]> var subviews = this.subviews; for (var i2 = subviews.length -1; i2 >= 0 ; i2-- ){ if ( subviews[ i2 ] === sub2 ){ subviews.splice( i2, 1 ); break; } } // check if sub2 was found if (i2==-1) { if ($debug) Debug.warn('second argument for setLayoutOrder() is not a subview') return; } if ( sub1 == "first" ){ subviews.unshift( sub2 ); } else if ( sub1 == "last" ){ subviews.push( sub2 ); } else { for (var i = subviews.length -1; i >= 0 ; i-- ){ if ( subviews[ i ] === sub1 ){ subviews.splice( i+1 , 0 , sub2 ); break; } } // check if sub1 was found if (i==-1) { if ($debug) { if (sub1 == sub2) { Debug.warn('%w is the same as %w', sub1, sub2) } else { Debug.warn('first argument for setLayoutOrder() is not a subview') } } // put sub2 back subviews.splice(i2, 0, sub2); } } this.reset(); return; = 0 && ( s1p < 0 || s2p < 0 ); i-- ){ if ( subviews[ i ] === sub1 ){ s1p = i; } if ( subviews[ i ] === sub2 ){ s2p = i; } } if (s1p >= 0 && s2p >= 0) { subviews[ s2p ] = sub1; subviews[ s1p ] = sub2; } else if ($debug) { Debug.warn('Invalid subviews for swapSubviewOrder()'); } this.reset(); return; ]]> var subviews = this.subviews; for ( var i = subviews.length -1 ; i >= 0; i-- ){ if ( subviews[ i ] == oldsub ){ subviews.splice( i , 0 , newsub ); } } return "lz.layout for view " + this.immediateparent;