-
-
-
Class Ext.layout.AbsoluteLayout
-
-
- *
-
Inherits the anchoring of Ext.layout.AnchorLayout and adds the ability for x/y positioning using the
-standard x and y component config options.
-
-
-
-
Config Options
-
-
-
-
-
-
- | |
-
-
- extraCls : String
- An optional extra CSS class that will be added to the container (defaults to 'x-abs-layout-item'). This can be useful...
-
- An optional extra CSS class that will be added to the container (defaults to 'x-abs-layout-item'). This can be useful for adding customized styles to the container or any of its children using standard CSS rules.
- |
- AbsoluteLayout |
-
-
- | |
-
-
- renderHidden : Boolean
- True to hide each contained item on render (defaults to false).
- |
- ContainerLayout |
-
-
-
-
Public Properties
-
This class has no public properties.
-
Public Methods
-
This class has no public methods.
-
Public Events
-
This class has no public events.
-
This is a layout that inherits the anchoring of Ext.layout.AnchorLayout and adds the
+ability for x/y positioning using the standard x and y component config options.
+
This class is intended to be extended or created via the layout
+configuration property. See Ext.Container.layout for additional details.
+
Example usage:
+
var form = new Ext.form.FormPanel({
+ title: 'Absolute Layout',
+ layout:'absolute',
+ layoutConfig: {
+ // layout-specific configs go here
+ extraCls: 'x-abs-layout-item',
+ },
+ baseCls: 'x-plain',
+ url:'save-form.php',
+ defaultType: 'textfield',
+ items: [{
+ x: 0,
+ y: 5,
+ xtype:'label',
+ text: 'Send To:'
+ },{
+ x: 60,
+ y: 0,
+ name: 'to',
+ anchor:'100%' // anchor width by percentage
+ },{
+ x: 0,
+ y: 35,
+ xtype:'label',
+ text: 'Subject:'
+ },{
+ x: 60,
+ y: 30,
+ name: 'subject',
+ anchor: '100%' // anchor width by percentage
+ },{
+ x:0,
+ y: 60,
+ xtype: 'textarea',
+ name: 'msg',
+ anchor: '100% 100%' // anchor width and height
+ }]
+});
Config Options
|
| | anchor : StringThis configuation option is to be applied to child items of a container managed by
+this layout (ie. configured with ... This configuation option is to be applied to child items of a container managed by
+this layout (ie. configured with layout:'anchor').
+ This value is what tells the layout how an item should be anchored to the container. items
+added to an AnchorLayout accept an anchoring-specific config property of anchor which is a string
+containing two values: the horizontal anchor value and the vertical anchor value (for example, '100% 50%').
+The following types of anchor values are supported: | AnchorLayout |
| | extraCls : StringAn optional extra CSS class that will be added to the container. This can be useful for adding
+customized styles to t... An optional extra CSS class that will be added to the container. This can be useful for adding
+customized styles to the container or any of its children using standard CSS rules. See
+Ext.Component.ctCls also.
+ Note: extraCls defaults to '' except for the following classes
+which assign a value by default:
+
+To configure the above Classes with an extra CSS class append to the default. For example,
+for ColumnLayout: extraCls: 'x-column custom-class'
+ | ContainerLayout |
| | renderHidden : Boolean True to hide each contained item on render (defaults to false). | ContainerLayout |
Public Properties
|
| | fieldTpl : Ext.TemplateThe Ext.Template used by Field rendering layout classes (such as
+Ext.layout.FormLayout) to create the DOM structure o... | ContainerLayout |
Public Methods
This class has no public methods.
Public Events
This class has no public events.
PropertiesAnchorLayout -
Properties