2150 |
mathias |
1 |
if(!dojo._hasResource["dijit.layout.LayoutContainer"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
|
|
|
2 |
dojo._hasResource["dijit.layout.LayoutContainer"] = true;
|
|
|
3 |
dojo.provide("dijit.layout.LayoutContainer");
|
|
|
4 |
|
|
|
5 |
dojo.require("dijit.layout._LayoutWidget");
|
|
|
6 |
|
|
|
7 |
dojo.declare(
|
|
|
8 |
"dijit.layout.LayoutContainer",
|
|
|
9 |
dijit.layout._LayoutWidget,
|
|
|
10 |
{
|
|
|
11 |
// summary
|
|
|
12 |
// Provides Delphi-style panel layout semantics.
|
|
|
13 |
//
|
|
|
14 |
// details
|
|
|
15 |
// A LayoutContainer is a box with a specified size (like style="width: 500px; height: 500px;"),
|
|
|
16 |
// that contains children widgets marked with "layoutAlign" of "left", "right", "bottom", "top", and "client".
|
|
|
17 |
// It takes it's children marked as left/top/bottom/right, and lays them out along the edges of the box,
|
|
|
18 |
// and then it takes the child marked "client" and puts it into the remaining space in the middle.
|
|
|
19 |
//
|
|
|
20 |
// Left/right positioning is similar to CSS's "float: left" and "float: right",
|
|
|
21 |
// and top/bottom positioning would be similar to "float: top" and "float: bottom", if there were such
|
|
|
22 |
// CSS.
|
|
|
23 |
//
|
|
|
24 |
// Note that there can only be one client element, but there can be multiple left, right, top,
|
|
|
25 |
// or bottom elements.
|
|
|
26 |
//
|
|
|
27 |
// usage
|
|
|
28 |
// <style>
|
|
|
29 |
// html, body{ height: 100%; width: 100%; }
|
|
|
30 |
// </style>
|
|
|
31 |
// <div dojoType="dijit.layout.LayoutContainer" style="width: 100%; height: 100%">
|
|
|
32 |
// <div dojoType="dijit.layout.ContentPane" layoutAlign="top">header text</div>
|
|
|
33 |
// <div dojoType="dijit.layout.ContentPane" layoutAlign="left" style="width: 200px;">table of contents</div>
|
|
|
34 |
// <div dojoType="dijit.layout.ContentPane" layoutAlign="client">client area</div>
|
|
|
35 |
// </div>
|
|
|
36 |
//
|
|
|
37 |
// Lays out each child in the natural order the children occur in.
|
|
|
38 |
// Basically each child is laid out into the "remaining space", where "remaining space" is initially
|
|
|
39 |
// the content area of this widget, but is reduced to a smaller rectangle each time a child is added.
|
|
|
40 |
//
|
|
|
41 |
|
|
|
42 |
layout: function(){
|
|
|
43 |
dijit.layout.layoutChildren(this.domNode, this._contentBox, this.getChildren());
|
|
|
44 |
},
|
|
|
45 |
|
|
|
46 |
addChild: function(/*Widget*/ child, /*Integer?*/ insertIndex){
|
|
|
47 |
dijit._Container.prototype.addChild.apply(this, arguments);
|
|
|
48 |
if(this._started){
|
|
|
49 |
dijit.layout.layoutChildren(this.domNode, this._contentBox, this.getChildren());
|
|
|
50 |
}
|
|
|
51 |
},
|
|
|
52 |
|
|
|
53 |
removeChild: function(/*Widget*/ widget){
|
|
|
54 |
dijit._Container.prototype.removeChild.apply(this, arguments);
|
|
|
55 |
if(this._started){
|
|
|
56 |
dijit.layout.layoutChildren(this.domNode, this._contentBox, this.getChildren());
|
|
|
57 |
}
|
|
|
58 |
}
|
|
|
59 |
});
|
|
|
60 |
|
|
|
61 |
// This argument can be specified for the children of a LayoutContainer.
|
|
|
62 |
// Since any widget can be specified as a LayoutContainer child, mix it
|
|
|
63 |
// into the base widget class. (This is a hack, but it's effective.)
|
|
|
64 |
dojo.extend(dijit._Widget, {
|
|
|
65 |
// layoutAlign: String
|
|
|
66 |
// "none", "left", "right", "bottom", "top", and "client".
|
|
|
67 |
// See the LayoutContainer description for details on this parameter.
|
|
|
68 |
layoutAlign: 'none'
|
|
|
69 |
});
|
|
|
70 |
|
|
|
71 |
}
|