Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / docs / source / Absolute.html
diff --git a/docs/source/Absolute.html b/docs/source/Absolute.html

new file mode 100644 (file)

index 0000000..157662d
--- /dev/null
+++ b/docs/source/Absolute.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-layout.container.Absolute'>/**
+</span> * @class Ext.layout.container.Absolute
+ * @extends Ext.layout.container.Anchor
+ * &lt;p&gt;This is a layout that inherits the anchoring of &lt;b&gt;{@link Ext.layout.container.Anchor}&lt;/b&gt; and adds the
+ * ability for x/y positioning using the standard x and y component config options.&lt;/p&gt;
+ * &lt;p&gt;This class is intended to be extended or created via the &lt;tt&gt;&lt;b&gt;{@link Ext.container.Container#layout layout}&lt;/b&gt;&lt;/tt&gt;
+ * configuration property.  See &lt;tt&gt;&lt;b&gt;{@link Ext.container.Container#layout}&lt;/b&gt;&lt;/tt&gt; for additional details.&lt;/p&gt;
+ * {@img Ext.layout.container.Absolute/Ext.layout.container.Absolute.png Ext.layout.container.Absolute container layout}
+ * &lt;p&gt;Example usage:&lt;/p&gt;
+ * &lt;pre&gt;&lt;code&gt;
+Ext.create('Ext.form.Panel', {
+    title: 'Absolute Layout',
+    width: 300,
+    height: 275,
+    layout:'absolute',
+    layoutConfig: {
+        // layout-specific configs go here
+        //itemCls: 'x-abs-layout-item',
+    },
+    url:'save-form.php',
+    defaultType: 'textfield',
+    items: [{
+        x: 10,
+        y: 10,
+        xtype:'label',
+        text: 'Send To:'
+    },{
+        x: 80,
+        y: 10,
+        name: 'to',
+        anchor:'90%'  // anchor width by percentage
+    },{
+        x: 10,
+        y: 40,
+        xtype:'label',
+        text: 'Subject:'
+    },{
+        x: 80,
+        y: 40,
+        name: 'subject',
+        anchor: '90%'  // anchor width by percentage
+    },{
+        x:0,
+        y: 80,
+        xtype: 'textareafield',
+        name: 'msg',
+        anchor: '100% 100%'  // anchor width and height
+    }],
+    renderTo: Ext.getBody()
+});
+&lt;/code&gt;&lt;/pre&gt;
+ */
+
+Ext.define('Ext.layout.container.Absolute', {
+
+    /* Begin Definitions */
+
+    alias: 'layout.absolute',
+    extend: 'Ext.layout.container.Anchor',
+    requires: ['Ext.chart.axis.Axis', 'Ext.fx.Anim'],
+    alternateClassName: 'Ext.layout.AbsoluteLayout',
+
+    /* End Definitions */
+
+    itemCls: Ext.baseCSSPrefix + 'abs-layout-item',
+
+    type: 'absolute',
+
+    onLayout: function() {
+        var me = this,
+            target = me.getTarget(),
+            targetIsBody = target.dom === document.body;
+
+        // Do not set position: relative; when the absolute layout target is the body
+        if (!targetIsBody) {
+            target.position();
+        }
+        me.paddingLeft = target.getPadding('l');
+        me.paddingTop = target.getPadding('t');
+        me.callParent(arguments);
+    },
+
+    // private
+    adjustWidthAnchor: function(value, comp) {
+        //return value ? value - comp.getPosition(true)[0] + this.paddingLeft: value;
+        return value ? value - comp.getPosition(true)[0] : value;
+    },
+
+    // private
+    adjustHeightAnchor: function(value, comp) {
+        //return value ? value - comp.getPosition(true)[1] + this.paddingTop: value;
+        return value ? value - comp.getPosition(true)[1] : value;
+    }
+});</pre></pre></body></html>
+\ No newline at end of file