text: Ext.data.JsonP.dr_statebutton({"tagname":"class","name":"dr.statebutton","autodetected":{},"files":[{"filename":"classdocs.js","href":"classdocs.html#dr-statebutton"}],"extends":"dr.view","members":[{"name":"activeview","tagname":"attribute","owner":"dr.statebutton","id":"attribute-activeview","meta":{"readonly":true}},{"name":"bgcolor","tagname":"attribute","owner":"dr.view","id":"attribute-bgcolor","meta":{}},{"name":"border","tagname":"attribute","owner":"dr.view","id":"attribute-border","meta":{}},{"name":"bordercolor","tagname":"attribute","owner":"dr.view","id":"attribute-bordercolor","meta":{}},{"name":"borderstyle","tagname":"attribute","owner":"dr.view","id":"attribute-borderstyle","meta":{}},{"name":"boundsheight","tagname":"attribute","owner":"dr.view","id":"attribute-boundsheight","meta":{"readonly":true}},{"name":"boundswidth","tagname":"attribute","owner":"dr.view","id":"attribute-boundswidth","meta":{"readonly":true}},{"name":"boundsx","tagname":"attribute","owner":"dr.view","id":"attribute-boundsx","meta":{"readonly":true}},{"name":"boundsxdiff","tagname":"attribute","owner":"dr.view","id":"attribute-boundsxdiff","meta":{"readonly":true}},{"name":"boundsy","tagname":"attribute","owner":"dr.view","id":"attribute-boundsy","meta":{"readonly":true}},{"name":"boundsydiff","tagname":"attribute","owner":"dr.view","id":"attribute-boundsydiff","meta":{"readonly":true}},{"name":"boxshadow","tagname":"attribute","owner":"dr.view","id":"attribute-boxshadow","meta":{}},{"name":"clickable","tagname":"attribute","owner":"dr.view","id":"attribute-clickable","meta":{}},{"name":"clip","tagname":"attribute","owner":"dr.view","id":"attribute-clip","meta":{}},{"name":"cursor","tagname":"attribute","owner":"dr.view","id":"attribute-cursor","meta":{}},{"name":"height","tagname":"attribute","owner":"dr.view","id":"attribute-height","meta":{}},{"name":"id","tagname":"attribute","owner":"dr.node","id":"attribute-id","meta":{}},{"name":"ignorelayout","tagname":"attribute","owner":"dr.view","id":"attribute-ignorelayout","meta":{}},{"name":"inited","tagname":"attribute","owner":"dr.node","id":"attribute-inited","meta":{"readonly":true}},{"name":"innerheight","tagname":"attribute","owner":"dr.view","id":"attribute-innerheight","meta":{"readonly":true}},{"name":"innerwidth","tagname":"attribute","owner":"dr.view","id":"attribute-innerwidth","meta":{"readonly":true}},{"name":"interactive","tagname":"attribute","owner":"dr.statebutton","id":"attribute-interactive","meta":{}},{"name":"isaligned","tagname":"attribute","owner":"dr.view","id":"attribute-isaligned","meta":{"readonly":true}},{"name":"isvaligned","tagname":"attribute","owner":"dr.view","id":"attribute-isvaligned","meta":{"readonly":true}},{"name":"layouthint","tagname":"attribute","owner":"dr.view","id":"attribute-layouthint","meta":{}},{"name":"layouts","tagname":"attribute","owner":"dr.view","id":"attribute-layouts","meta":{"readonly":true}},{"name":"name","tagname":"attribute","owner":"dr.node","id":"attribute-name","meta":{}},{"name":"opacity","tagname":"attribute","owner":"dr.view","id":"attribute-opacity","meta":{}},{"name":"padding","tagname":"attribute","owner":"dr.view","id":"attribute-padding","meta":{}},{"name":"perspective","tagname":"attribute","owner":"dr.view","id":"attribute-perspective","meta":{}},{"name":"rotation","tagname":"attribute","owner":"dr.view","id":"attribute-rotation","meta":{}},{"name":"scriptincludes","tagname":"attribute","owner":"dr.node","id":"attribute-scriptincludes","meta":{}},{"name":"scriptincludeserror","tagname":"attribute","owner":"dr.node","id":"attribute-scriptincludeserror","meta":{}},{"name":"scrollable","tagname":"attribute","owner":"dr.view","id":"attribute-scrollable","meta":{}},{"name":"scrollbars","tagname":"attribute","owner":"dr.view","id":"attribute-scrollbars","meta":{}},{"name":"scrollx","tagname":"attribute","owner":"dr.view","id":"attribute-scrollx","meta":{}},{"name":"scrolly","tagname":"attribute","owner":"dr.view","id":"attribute-scrolly","meta":{}},{"name":"state","tagname":"attribute","owner":"dr.statebutton","id":"attribute-state","meta":{}},{"name":"states","tagname":"attribute","owner":"dr.statebutton","id":"attribute-states","meta":{"readonly":true}},{"name":"subnodes","tagname":"attribute","owner":"dr.node","id":"attribute-subnodes","meta":{"readonly":true}},{"name":"subviews","tagname":"attribute","owner":"dr.view","id":"attribute-subviews","meta":{"readonly":true}},{"name":"visible","tagname":"attribute","owner":"dr.view","id":"attribute-visible","meta":{}},{"name":"width","tagname":"attribute","owner":"dr.view","id":"attribute-width","meta":{}},{"name":"x","tagname":"attribute","owner":"dr.view","id":"attribute-x","meta":{}},{"name":"xanchor","tagname":"attribute","owner":"dr.view","id":"attribute-xanchor","meta":{}},{"name":"xscale","tagname":"attribute","owner":"dr.view","id":"attribute-xscale","meta":{}},{"name":"y","tagname":"attribute","owner":"dr.view","id":"attribute-y","meta":{}},{"name":"yanchor","tagname":"attribute","owner":"dr.view","id":"attribute-yanchor","meta":{}},{"name":"yscale","tagname":"attribute","owner":"dr.view","id":"attribute-yscale","meta":{}},{"name":"z","tagname":"attribute","owner":"dr.view","id":"attribute-z","meta":{}},{"name":"zanchor","tagname":"attribute","owner":"dr.view","id":"attribute-zanchor","meta":{}},{"name":"animate","tagname":"method","owner":"dr.node","id":"method-animate","meta":{"chainable":true}},{"name":"createChild","tagname":"method","owner":"dr.node","id":"method-createChild","meta":{}},{"name":"defaultSetAttributeBehavior","tagname":"method","owner":"Eventable","id":"method-defaultSetAttributeBehavior","meta":{}},{"name":"destroy","tagname":"method","owner":"dr.node","id":"method-destroy","meta":{}},{"name":"doLayoutAdded","tagname":"method","owner":"dr.view","id":"method-doLayoutAdded","meta":{}},{"name":"doLayoutRemoved","tagname":"method","owner":"dr.view","id":"method-doLayoutRemoved","meta":{}},{"name":"doSubnodeAdded","tagname":"method","owner":"dr.view","id":"method-doSubnodeAdded","meta":{"private":true}},{"name":"doSubnodeRemoved","tagname":"method","owner":"dr.view","id":"method-doSubnodeRemoved","meta":{"private":true}},{"name":"doSubviewAdded","tagname":"method","owner":"dr.view","id":"method-doSubviewAdded","meta":{}},{"name":"doSubviewRemoved","tagname":"method","owner":"dr.view","id":"method-doSubviewRemoved","meta":{}},{"name":"getLayoutHint","tagname":"method","owner":"dr.view","id":"method-getLayoutHint","meta":{}},{"name":"moveBehind","tagname":"method","owner":"dr.view","id":"method-moveBehind","meta":{}},{"name":"moveInFrontOf","tagname":"method","owner":"dr.view","id":"method-moveInFrontOf","meta":{}},{"name":"moveToBack","tagname":"method","owner":"dr.view","id":"method-moveToBack","meta":{}},{"name":"sendEvent","tagname":"method","owner":"Eventable","id":"method-sendEvent","meta":{"chainable":true}},{"name":"setAndFire","tagname":"method","owner":"Eventable","id":"method-setAndFire","meta":{}},{"name":"setAttribute","tagname":"method","owner":"Eventable","id":"method-setAttribute","meta":{"chainable":true}},{"name":"setAttributes","tagname":"method","owner":"Eventable","id":"method-setAttributes","meta":{"chainable":true}},{"name":"onclick","tagname":"event","owner":"dr.view","id":"event-onclick","meta":{}},{"name":"ondestroy","tagname":"event","owner":"dr.node","id":"event-ondestroy","meta":{}},{"name":"oninit","tagname":"event","owner":"dr.node","id":"event-oninit","meta":{}},{"name":"onmousedown","tagname":"event","owner":"dr.view","id":"event-onmousedown","meta":{}},{"name":"onmouseout","tagname":"event","owner":"dr.view","id":"event-onmouseout","meta":{}},{"name":"onmouseover","tagname":"event","owner":"dr.view","id":"event-onmouseover","meta":{}},{"name":"onmouseup","tagname":"event","owner":"dr.view","id":"event-onmouseup","meta":{}},{"name":"onscroll","tagname":"event","owner":"dr.view","id":"event-onscroll","meta":{}},{"name":"subviewAdded","tagname":"event","owner":"dr.view","id":"event-subviewAdded","meta":{}},{"name":"subviewRemoved","tagname":"event","owner":"dr.view","id":"event-subviewRemoved","meta":{}}],"alternateClassNames":[],"aliases":{},"id":"class-dr.statebutton","short_doc":"A button that may be configured with views associated with named states. ...","component":false,"superclasses":["Module","Eventable","dr.node","dr.view"],"subclasses":["dr.bitmapbutton"],"mixedInto":[],"mixins":[],"parentMixins":[],"requires":[],"uses":[],"html":"<div><pre class=\"hierarchy\"><h4>Hierarchy</h4><div class='subclass first-child'><a href='#!/api/Module' rel='Module' class='docClass'>Module</a><div class='subclass '><a href='#!/api/Eventable' rel='Eventable' class='docClass'>Eventable</a><div class='subclass '><a href='#!/api/dr.node' rel='dr.node' class='docClass'>dr.node</a><div class='subclass '><a href='#!/api/dr.view' rel='dr.view' class='docClass'>dr.view</a><div class='subclass '><strong>dr.statebutton</strong></div></div></div></div></div><h4>Subclasses</h4><div class='dependency'><a href='#!/api/dr.bitmapbutton' rel='dr.bitmapbutton' class='docClass'>dr.bitmapbutton</a></div><h4>Files</h4><div class='dependency'><a href='source/classdocs.html#dr-statebutton' target='_blank'>classdocs.js</a></div></pre><div class='doc-contents'><p>A button that may be configured with views associated with named states. Change which view is active by setting the state attribute. If the state names 'default', 'over', and 'down' are used then state changes based on mouse interactions will automatically be configured by default. If those states are not present then mouse interactions will not be automatically configured, and will be left to the developer to implement.</p>\n\n<p>Here is a statebutton configured with three bitmaps associated with the states default, over, and down. Notice the mouse interaction is set up by default.</p>\n\n<pre class='inline-example '><code>&lt;statebutton width=\"100\" height=\"100\"&gt;\n  &lt;bitmap name=\"defaultv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/default.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"default\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"overv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/over.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"over\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"downv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/down.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"down\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n&lt;/statebutton&gt;\n</code></pre>\n\n<p>Setting the interactive attribute to false disables the default hover and down state changes.</p>\n\n<pre class='inline-example '><code>&lt;statebutton interactive=\"false\" width=\"100\" height=\"100\"&gt;\n  &lt;bitmap name=\"defaultv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/default.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"default\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"overv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/over.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"over\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"downv\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/down.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"down\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n&lt;/statebutton&gt;\n</code></pre>\n\n<p>Configuring custom states will also set the interactive flag to false, and then you can add your own custom state changes</p>\n\n<pre class='inline-example '><code>&lt;statebutton width=\"100\" height=\"100\"&gt;\n  &lt;attribute name=\"statetracker\" type=\"number\" value=\"0\"&gt;&lt;/attribute&gt;\n  &lt;handler event=\"onclick\"&gt;\n    var newStateIndex = this.statetracker + 1;\n    if (newStateIndex == 3) newStateIndex = 0;\n    this.setAttribute('statetracker', newStateIndex)\n    this.setAttribute('state', this.states[newStateIndex])\n  &lt;/handler&gt;\n\n  &lt;bitmap name=\"onev\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/default.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"one\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"twov\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/over.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"two\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n\n  &lt;bitmap name=\"threev\" width=\"100%\" height=\"100%\" src=\"../api-examples-resources/down.png\"&gt;\n    &lt;attribute name=\"state\" type=\"string\" value=\"three\"&gt;&lt;/attribute&gt;\n  &lt;/bitmap&gt;\n&lt;/statebutton&gt;\n</code></pre>\n</div><div class='members'><div class='members-section'><div class='definedBy'>Defined By</div><h3 class='members-title icon-attribute'>Attributes</h3><div class='subsection'><div id='attribute-activeview' class='member first-child not-inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><span class='defined-in' rel='dr.statebutton'>dr.statebutton</span><br/><a href='source/classdocs.html#dr-statebutton-attribute-activeview' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.statebutton-attribute-activeview' class='name expandable'>activeview</a> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>The currently active view</p>\n</div><div class='long'><p>The currently active view</p>\n</div></div></div><div id='attribute-bgcolor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-bgcolor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-bgcolor' class='name expandable'>bgcolor</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Sets this view's background color</p>\n</div><div class='long'><p>Sets this view's background color</p>\n</div></div></div><div id='attribute-border' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-border' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-border' class='name expandable'>border</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Sets this view's border width</p>\n</div><div class='long'><p>Sets this view's border width</p>\n</div></div></div><div id='attribute-bordercolor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-bordercolor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-bordercolor' class='name expandable'>bordercolor</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Sets this view's border color</p>\n</div><div class='long'><p>Sets this view's border color</p>\n</div></div></div><div id='attribute-borderstyle' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-borderstyle' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-borderstyle' class='name expandable'>borderstyle</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Sets this view's border style (can be any css border-style value)</p>\n</div><div class='long'><p>Sets this view's border style (can be any css border-style value)</p>\n</div></div></div><div id='attribute-boundsheight' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundsheight' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundsheight' class='name expandable'>boundsheight</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The height of the bounding box for the\nview. ...</div><div class='long'><p>The height of the bounding box for the\nview. This value accounts for rotation and scaling of the view. This is\nthe height non-descendant views should use if the view is rotated or\nscaled.</p>\n</div></div></div><div id='attribute-boundswidth' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundswidth' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundswidth' class='name expandable'>boundswidth</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The width of the bounding box for the\nview. ...</div><div class='long'><p>The width of the bounding box for the\nview. This value accounts for rotation and scaling of the view. This is\nthe width non-descendant views should use if the view is rotated or\nscaled.</p>\n</div></div></div><div id='attribute-boundsx' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundsx' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundsx' class='name expandable'>boundsx</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The x position of the bounding box for the\nview. ...</div><div class='long'><p>The x position of the bounding box for the\nview. This value accounts for rotation and scaling of the view.</p>\n</div></div></div><div id='attribute-boundsxdiff' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundsxdiff' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundsxdiff' class='name expandable'>boundsxdiff</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The difference between the x position\nof the view and the boundsx of the view. ...</div><div class='long'><p>The difference between the x position\nof the view and the boundsx of the view. Useful when you need to offset\na view to make it line up when it is scaled or rotated.</p>\n</div></div></div><div id='attribute-boundsy' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundsy' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundsy' class='name expandable'>boundsy</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The y position of the bounding box for the\nview. ...</div><div class='long'><p>The y position of the bounding box for the\nview. This value accounts for rotation and scaling of the view.</p>\n</div></div></div><div id='attribute-boundsydiff' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boundsydiff' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boundsydiff' class='name expandable'>boundsydiff</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The difference between the y position\nof the view and the boundsy of the view. ...</div><div class='long'><p>The difference between the y position\nof the view and the boundsy of the view. Useful when you need to offset\na view to make it line up when it is scaled or rotated.</p>\n</div></div></div><div id='attribute-boxshadow' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-boxshadow' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-boxshadow' class='name expandable'>boxshadow</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Drop shadow using standard CSS format (offset-x offset-y blur-radius spread-radius color). ...</div><div class='long'><p>Drop shadow using standard CSS format (offset-x offset-y blur-radius spread-radius color). For example: \"10px 10px 5px 0px #888888\".</p>\n</div></div></div><div id='attribute-clickable' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-clickable' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-clickable' class='name expandable'>clickable</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>If true, this view recieves mouse events. ...</div><div class='long'><p>If true, this view recieves mouse events. Automatically set to true when an onclick/mouse* event is registered for this view.</p>\n<p>Defaults to: <code>false</code></p></div></div></div><div id='attribute-clip' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-clip' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-clip' class='name expandable'>clip</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>If true, this view clips to its bounds ...</div><div class='long'><p>If true, this view clips to its bounds</p>\n<p>Defaults to: <code>false</code></p></div></div></div><div id='attribute-cursor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-cursor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-cursor' class='name expandable'>cursor</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Cursor that should be used when the mouse is over this view, can be any CSS cursor value. ...</div><div class='long'><p>Cursor that should be used when the mouse is over this view, can be any CSS cursor value. Only applies when clickable is true.</p>\n<p>Defaults to: <code>&#39;pointer&#39;</code></p></div></div></div><div id='attribute-height' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-height' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-height' class='name expandable'>height</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>This view's height. ...</div><div class='long'><p>This view's height. There are several categories of allowed values.\n  1) Fixed: If a number is provided the height will be a fixed\n     pixel size.\n  2) Percentage: If a number followed by a '%' sign is provided the\n     height will constrained to a percent of the parent views\n     inner height.\n  3) Auto: If the string 'auto' is provided the height will be constrained\n     to the maximum y bounds of the view children of this view. This\n     feature is implemented like a Layout, so you can use ignorelayout\n     on a child view to disregard them for auto sizing. Furthermore,\n     views with a percentage height, percentage y, or a y-position of\n     'center', 'middle' or 'bottom' will also be disregarded. Note that\n     'top' is not ignored since it does not necessarily result in a\n     circular constraint.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-id' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-id' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-id' class='name expandable'>id</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Gives this node a global ID, which can be looked up in the global window object. ...</div><div class='long'><p>Gives this node a global ID, which can be looked up in the global window object.\nTake care to not override builtin globals, or override your own instances!</p>\n</div></div></div><div id='attribute-ignorelayout' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-ignorelayout' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-ignorelayout' class='name expandable'>ignorelayout</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Indicates if layouts should ignore this view or not. ...</div><div class='long'><p>Indicates if layouts should ignore this view or not. A variety of\nconfiguration mechanisms are supported. Provided true or false will\ncause the view to be ignored or not by all layouts. If instead a\nserialized map is provided the keys of the map will target values\nthe layouts with matching names. A special key of '*' indicates a\ndefault value for all layouts not specifically mentioned in the map.</p>\n<p>Defaults to: <code>&#39;false&#39;</code></p></div></div></div><div id='attribute-inited' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-inited' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-inited' class='name expandable'>inited</a> : Boolean<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>True when this node and all its children are completely initialized</p>\n</div><div class='long'><p>True when this node and all its children are completely initialized</p>\n</div></div></div><div id='attribute-innerheight' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-innerheight' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-innerheight' class='name expandable'>innerheight</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The height of the view less padding and\nborder. ...</div><div class='long'><p>The height of the view less padding and\nborder. This is the height child views should use if border or padding\nis being used by the view.</p>\n</div></div></div><div id='attribute-innerwidth' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-innerwidth' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-innerwidth' class='name expandable'>innerwidth</a> : Number<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>The width of the view less padding and\nborder. ...</div><div class='long'><p>The width of the view less padding and\nborder. This is the width child views should use if border or padding\nis being used by the view.</p>\n</div></div></div><div id='attribute-interactive' class='member  not-inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><span class='defined-in' rel='dr.statebutton'>dr.statebutton</span><br/><a href='source/classdocs.html#dr-statebutton-attribute-interactive' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.statebutton-attribute-interactive' class='name expandable'>interactive</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>When true default, over, and down states are applied automatically based on mouse/touch interactions. ...</div><div class='long'><p>When true default, over, and down states are applied automatically based on mouse/touch interactions. Set to false to disable the default behavior.</p>\n<p>Defaults to: <code>&quot;true&quot;</code></p></div></div></div><div id='attribute-isaligned' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-isaligned' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-isaligned' class='name expandable'>isaligned</a> : Boolean<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>Indicates that the x attribute is\nset to one of the \"special\" alignment values.</p>\n</div><div class='long'><p>Indicates that the x attribute is\nset to one of the \"special\" alignment values.</p>\n</div></div></div><div id='attribute-isvaligned' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-isvaligned' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-isvaligned' class='name expandable'>isvaligned</a> : Boolean<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>Indicates that the y attribute is\nset to one of the \"special\" alignment values.</p>\n</div><div class='long'><p>Indicates that the y attribute is\nset to one of the \"special\" alignment values.</p>\n</div></div></div><div id='attribute-layouthint' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-layouthint' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-layouthint' class='name expandable'>layouthint</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Provides per view hinting to layouts. ...</div><div class='long'><p>Provides per view hinting to layouts. The specific hints supported\nare layout specific. Hints are provided as a map. A map key may\nbe prefixied with the name of a layout followed by a '/'. This will\ntarget that hint at a specific layout. If the prefix is ommitted or\na prefix of '*' is used the hint will be targeted to all layouts.</p>\n<p>Defaults to: <code>&#39;&#39;</code></p></div></div></div><div id='attribute-layouts' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-layouts' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-layouts' class='name expandable'>layouts</a> : <a href=\"#!/api/dr.layout\" rel=\"dr.layout\" class=\"docClass\">dr.layout</a>[]<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'>An array of this views's layouts. ...</div><div class='long'><p>An array of this views's layouts. Only defined when needed.</p>\n</div></div></div><div id='attribute-name' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-name' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-name' class='name expandable'>name</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Names this node in its parent scope so it can be referred to later.</p>\n</div><div class='long'><p>Names this node in its parent scope so it can be referred to later.</p>\n</div></div></div><div id='attribute-opacity' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-opacity' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-opacity' class='name expandable'>opacity</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's opacity, values can be a float from 0.0 to 1.0 ...</div><div class='long'><p>Sets this view's opacity, values can be a float from 0.0 to 1.0</p>\n<p>Defaults to: <code>1.0</code></p></div></div></div><div id='attribute-padding' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-padding' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-padding' class='name expandable'>padding</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'><p>Sets this view's padding</p>\n</div><div class='long'><p>Sets this view's padding</p>\n</div></div></div><div id='attribute-perspective' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-perspective' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-perspective' class='name expandable'>perspective</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's perspective depth along the z access, values in pixels. ...</div><div class='long'><p>Sets this view's perspective depth along the z access, values in pixels.\nWhen this value is set, items further from the camera will appear smaller, and closer items will be larger.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-rotation' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-rotation' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-rotation' class='name expandable'>rotation</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's rotation in degrees. ...</div><div class='long'><p>Sets this view's rotation in degrees.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-scriptincludes' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-scriptincludes' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-scriptincludes' class='name expandable'>scriptincludes</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>A comma separated list of URLs to javascript includes required as dependencies. ...</div><div class='long'><p>A comma separated list of URLs to javascript includes required as dependencies. Useful if you need to ensure a third party library is available.</p>\n</div></div></div><div id='attribute-scriptincludeserror' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-scriptincludeserror' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-scriptincludeserror' class='name expandable'>scriptincludeserror</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'><p>An error to show if scriptincludes fail to load</p>\n</div><div class='long'><p>An error to show if scriptincludes fail to load</p>\n</div></div></div><div id='attribute-scrollable' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-scrollable' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-scrollable' class='name expandable'>scrollable</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>If true, this view clips to its bounds and provides scrolling to see content that overflows the bounds ...</div><div class='long'><p>If true, this view clips to its bounds and provides scrolling to see content that overflows the bounds</p>\n<p>Defaults to: <code>false</code></p></div></div></div><div id='attribute-scrollbars' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-scrollbars' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-scrollbars' class='name expandable'>scrollbars</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>Controls the visibility of scrollbars if scrollable is true ...</div><div class='long'><p>Controls the visibility of scrollbars if scrollable is true</p>\n<p>Defaults to: <code>false</code></p></div></div></div><div id='attribute-scrollx' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-scrollx' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-scrollx' class='name expandable'>scrollx</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets the horizontal scroll position of the view. ...</div><div class='long'><p>Sets the horizontal scroll position of the view. Only relevant if\nthis.scrollable is true. Setting this value will generate both a\nscrollx event and a scroll event.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-scrolly' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-scrolly' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-scrolly' class='name expandable'>scrolly</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets the vertical scroll position of the view. ...</div><div class='long'><p>Sets the vertical scroll position of the view. Only relevant if\nthis.scrollable is true. Setting this value will generate both a\nscrolly event and a scroll event.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-state' class='member  not-inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><span class='defined-in' rel='dr.statebutton'>dr.statebutton</span><br/><a href='source/classdocs.html#dr-statebutton-attribute-state' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.statebutton-attribute-state' class='name expandable'>state</a> : String<span class=\"signature\"></span></div><div class='description'><div class='short'>The currently active state. ...</div><div class='long'><p>The currently active state.</p>\n<p>Defaults to: <code>&quot;default&quot;</code></p></div></div></div><div id='attribute-states' class='member  not-inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><span class='defined-in' rel='dr.statebutton'>dr.statebutton</span><br/><a href='source/classdocs.html#dr-statebutton-attribute-states' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.statebutton-attribute-states' class='name expandable'>states</a> : String[]<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>An array of the states</p>\n</div><div class='long'><p>An array of the states</p>\n</div></div></div><div id='attribute-subnodes' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-attribute-subnodes' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-attribute-subnodes' class='name expandable'>subnodes</a> : <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a>[]<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>An array of this node's child nodes</p>\n</div><div class='long'><p>An array of this node's child nodes</p>\n</div></div></div><div id='attribute-subviews' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-subviews' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-subviews' class='name expandable'>subviews</a> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a>[]<span class=\"signature\"><span class='readonly' >readonly</span></span></div><div class='description'><div class='short'><p>An array of this views's child views</p>\n</div><div class='long'><p>An array of this views's child views</p>\n</div></div></div><div id='attribute-visible' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-visible' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-visible' class='name expandable'>visible</a> : Boolean<span class=\"signature\"></span></div><div class='description'><div class='short'>If false, this view is invisible ...</div><div class='long'><p>If false, this view is invisible</p>\n<p>Defaults to: <code>true</code></p></div></div></div><div id='attribute-width' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-width' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-width' class='name expandable'>width</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>This view's width. ...</div><div class='long'><p>This view's width. There are several categories of allowed values.\n  1) Fixed: If a number is provided the width will be a fixed\n     pixel size.\n  2) Percentage: If a number followed by a '%' sign is provided the\n     width will constrained to a percent of the parent views\n     inner width.\n  3) Auto: If the string 'auto' is provided the width will be constrained\n     to the maximum x bounds of the view children of this view. This\n     feature is implemented like a Layout, so you can use ignorelayout\n     on a child view to disregard them for auto sizing. Furthermore,\n     views with a percentage width, percentage x, or an x-position of\n     'center' or 'right' will also be disregarded. Note that 'left' is\n     not ignored since it does not necessarily result in a circular\n     constraint.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-x' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-x' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-x' class='name expandable'>x</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>This view's x-position. ...</div><div class='long'><p>This view's x-position. There are several categories of allowed values.\n  1) Fixed: If a number is provided the x-position will be a fixed\n     pixel position relative to the parent view.\n  2) Percentage: If a number followed by a '%' sign is provided the\n     x-position will constrained to a percent of the parent views\n     inner width.\n  3) Aligned Left: If the string 'left' is provided the x-position will\n     be constrained so that the view's left bound is aligned with the\n     inner left edge of the parent view. To clarify, aligning left is\n     different from a fixed x-position of 0 since it accounts for\n     transformations applied to the view.\n  4) Aligned Right: If the string 'right' is provided the x-position will\n     be constrained so that the view's right bound is aligned with the\n     inner right edge of the parent view. Like align left, this means\n     transformations applied to the view are accounted for.\n  5) Aligned Center: If the string 'center' or 'middle' is provided the\n     x-position will be constrained so that the midpoint of the width\n     bound of the view is the same as the midpoint of the inner width of\n     the parent view. Like align left, this means transformations applied\n     to the view are accounted for.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-xanchor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-xanchor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-xanchor' class='name expandable'>xanchor</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets the horizontal center of the view's transformations (such as\nrotation) There are several categories of allowed v...</div><div class='long'><p>Sets the horizontal center of the view's transformations (such as\nrotation) There are several categories of allowed values:\n  1) Fixed: If a number is provided the x anchor will be a fixed\n     pixel position.\n  2) Left: If the string 'left' is provided the left edge of the view\n     will be used. This is equivalent to a fixed value of 0.\n  3) Right: If the string 'right' is provided the right edge of the\n     view will be used.\n  4) Center: If the string 'center' is provided the midpoint of the\n     width of the view will be used.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-xscale' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-xscale' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-xscale' class='name expandable'>xscale</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's width scale ...</div><div class='long'><p>Sets this view's width scale</p>\n<p>Defaults to: <code>1.0</code></p></div></div></div><div id='attribute-y' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-y' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-y' class='name expandable'>y</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>This view's y-position. ...</div><div class='long'><p>This view's y-position. There are several categories of allowed values.\n  1) Fixed: If a number is provided the y-position will be a fixed\n     pixel position relative to the parent view.\n  2) Percentage: If a number followed by a '%' sign is provided the\n     y-position will constrained to a percent of the parent views\n     inner height.\n  3) Aligned Top: If the string 'top' is provided the y-position will\n     be constrained so that the view's top bound is aligned with the\n     inner top edge of the parent view. To clarify, aligning top is\n     different from a fixed y-position of 0 since it accounts for\n     transformations applied to the view.\n  4) Aligned Bottom: If the string 'bottom' is provided the y-position\n     will be constrained so that the view's bottom bound is aligned with\n     the inner bottom edge of the parent view. Like align top, this means\n     transformations applied to the view are accounted for.\n  5) Aligned Middle: If the string 'middle' or 'center' is provided the\n     y-position will be constrained so that the midpoint of the height\n     bound of the view is the same as the midpoint of the inner height of\n     the parent view. Like align top, this means transformations applied\n     to the view are accounted for.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-yanchor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-yanchor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-yanchor' class='name expandable'>yanchor</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets the vertical center of the view's transformations (such as\nrotation) There are several categories of allowed val...</div><div class='long'><p>Sets the vertical center of the view's transformations (such as\nrotation) There are several categories of allowed values:\n  1) Fixed: If a number is provided the y anchor will be a fixed\n     pixel position.\n  2) Top: If the string 'top' is provided the top edge of the view\n     will be used. This is equivalent to a fixed value of 0.\n  3) Bottom: If the string 'bottom' is provided the bottom edge of the\n     view will be used.\n  4) Center: If the string 'center' is provided the midpoint of the\n     height of the view will be used.</p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-yscale' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-yscale' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-yscale' class='name expandable'>yscale</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's height scale ...</div><div class='long'><p>Sets this view's height scale</p>\n<p>Defaults to: <code>1.0</code></p></div></div></div><div id='attribute-z' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-z' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-z' class='name expandable'>z</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets this view's z position (higher values are on top of other views)\n\n(note: setting a z value for a view implicitly...</div><div class='long'><p>Sets this view's z position (higher values are on top of other views)</p>\n\n<p><em>(note: setting a <code>z</code> value for a view implicitly sets its parent's <code>transform-style</code> to <code>preserve-3d</code>)</em></p>\n<p>Defaults to: <code>0</code></p></div></div></div><div id='attribute-zanchor' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-attribute-zanchor' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-attribute-zanchor' class='name expandable'>zanchor</a> : Number<span class=\"signature\"></span></div><div class='description'><div class='short'>Sets the z-axis center of the view's transformations (such as rotation) ...</div><div class='long'><p>Sets the z-axis center of the view's transformations (such as rotation)</p>\n<p>Defaults to: <code>0</code></p></div></div></div></div></div><div class='members-section'><div class='definedBy'>Defined By</div><h3 class='members-title icon-method'>Methods</h3><div class='subsection'><div id='method-animate' class='member first-child inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-method-animate' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-method-animate' class='name expandable'>animate</a>( <span class='pre'>obj, Number</span> ) : <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a><span class=\"signature\"><span class='chainable' >chainable</span></span></div><div class='description'><div class='short'>Animates this node's attribute(s) ...</div><div class='long'><p>Animates this node's attribute(s)</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>obj</span> : Object<div class='sub-desc'><p>A hash of attribute names and values to animate to</p>\n</div></li><li><span class='pre'>Number</span> : Object<div class='sub-desc'><p>duration The duration of the animation in milliseconds</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'><a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a></span><div class='sub-desc'><p>this</p>\n</div></li></ul></div></div></div><div id='method-createChild' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-method-createChild' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-method-createChild' class='name expandable'>createChild</a>( <span class='pre'>Object</span> ) : <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a><span class=\"signature\"></span></div><div class='description'><div class='short'>Used to create child instances on a node. ...</div><div class='long'><p>Used to create child instances on a node.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>Object</span> : Object<div class='sub-desc'><p>options Should include a class attribute: 'class', e.g. {class: 'view'} unless a <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a> is desired.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'><a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a></span><div class='sub-desc'>\n</div></li></ul></div></div></div><div id='method-defaultSetAttributeBehavior' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/Eventable' rel='Eventable' class='defined-in docClass'>Eventable</a><br/><a href='source/layout.html#Eventable-method-defaultSetAttributeBehavior' target='_blank' class='view-source'>view source</a></div><a href='#!/api/Eventable-method-defaultSetAttributeBehavior' class='name expandable'>defaultSetAttributeBehavior</a>( <span class='pre'>name, value</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>The default behavior to execute in setAttribute once setters have been\nrun. ...</div><div class='long'><p>The default behavior to execute in setAttribute once setters have been\nrun. Stores the value on this object and fires an event.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>name</span> : String<div class='sub-desc'><p>the name of the attribute to set</p>\n</div></li><li><span class='pre'>value</span> : Object<div class='sub-desc'><p>the value to set to</p>\n</div></li></ul></div></div></div><div id='method-destroy' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-method-destroy' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-method-destroy' class='name expandable'>destroy</a>( <span class='pre'></span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Destroys this node ...</div><div class='long'><p>Destroys this node</p>\n</div></div></div><div id='method-doLayoutAdded' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doLayoutAdded' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doLayoutAdded' class='name expandable'>doLayoutAdded</a>( <span class='pre'>layout</span> ) : void<span class=\"signature\"></span></div><div class='description'><div class='short'>Called when a layout is added to this view. ...</div><div class='long'><p>Called when a layout is added to this view. Provides a hook for\nsubclasses. No need for subclasses to call super. Do not call this\nmethod to add a layout. Instead call setParent.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>layout</span> : <a href=\"#!/api/dr.layout\" rel=\"dr.layout\" class=\"docClass\">dr.layout</a><div class='sub-desc'><p>The layout that was added.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'>void</span><div class='sub-desc'>\n</div></li></ul></div></div></div><div id='method-doLayoutRemoved' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doLayoutRemoved' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doLayoutRemoved' class='name expandable'>doLayoutRemoved</a>( <span class='pre'>layout</span> ) : void<span class=\"signature\"></span></div><div class='description'><div class='short'>Called when a layout is removed from this view. ...</div><div class='long'><p>Called when a layout is removed from this view. Provides a hook for\nsubclasses. No need for subclasses to call super. Do not call this\nmethod to remove a layout. Instead call _removeFromParent.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>layout</span> : <a href=\"#!/api/dr.layout\" rel=\"dr.layout\" class=\"docClass\">dr.layout</a><div class='sub-desc'><p>The layout that was removed.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'>void</span><div class='sub-desc'>\n</div></li></ul></div></div></div><div id='method-doSubnodeAdded' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doSubnodeAdded' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doSubnodeAdded' class='name expandable'>doSubnodeAdded</a>( <span class='pre'>node</span> )<span class=\"signature\"><span class='private' >private</span></span></div><div class='description'><div class='short'>Calls doSubviewAdded/doLayoutAdded if the added subnode is a view or\nlayout respectively. ...</div><div class='long'><p>Calls doSubviewAdded/doLayoutAdded if the added subnode is a view or\nlayout respectively. Subclasses should call super.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>node</span> : Object<div class='sub-desc'></div></li></ul><p>Overrides: <a href=\"#!/api/dr.node-method-doSubnodeAdded\" rel=\"dr.node-method-doSubnodeAdded\" class=\"docClass\">dr.node.doSubnodeAdded</a></p></div></div></div><div id='method-doSubnodeRemoved' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doSubnodeRemoved' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doSubnodeRemoved' class='name expandable'>doSubnodeRemoved</a>( <span class='pre'>node</span> )<span class=\"signature\"><span class='private' >private</span></span></div><div class='description'><div class='short'>Calls doSubviewRemoved/doLayoutRemoved if the removed subnode is a view or\nlayout respectively. ...</div><div class='long'><p>Calls doSubviewRemoved/doLayoutRemoved if the removed subnode is a view or\nlayout respectively. Subclasses should call super.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>node</span> : Object<div class='sub-desc'></div></li></ul><p>Overrides: <a href=\"#!/api/dr.node-method-doSubnodeRemoved\" rel=\"dr.node-method-doSubnodeRemoved\" class=\"docClass\">dr.node.doSubnodeRemoved</a></p></div></div></div><div id='method-doSubviewAdded' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doSubviewAdded' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doSubviewAdded' class='name expandable'>doSubviewAdded</a>( <span class='pre'>sv</span> ) : void<span class=\"signature\"></span></div><div class='description'><div class='short'>Called when a subview is added to this view. ...</div><div class='long'><p>Called when a subview is added to this view. Provides a hook for\nsubclasses. No need for subclasses to call super. Do not call this\nmethod to add a subview. Instead call setParent.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>sv</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The subview that was added.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'>void</span><div class='sub-desc'>\n</div></li></ul></div></div></div><div id='method-doSubviewRemoved' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-doSubviewRemoved' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-doSubviewRemoved' class='name expandable'>doSubviewRemoved</a>( <span class='pre'>sv</span> ) : void<span class=\"signature\"></span></div><div class='description'><div class='short'>Called when a subview is removed from this view. ...</div><div class='long'><p>Called when a subview is removed from this view. Provides a hook for\nsubclasses. No need for subclasses to call super. Do not call this\nmethod to remove a subview. Instead call _removeFromParent.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>sv</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The subview that was removed.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'>void</span><div class='sub-desc'>\n</div></li></ul></div></div></div><div id='method-getLayoutHint' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-getLayoutHint' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-getLayoutHint' class='name expandable'>getLayoutHint</a>( <span class='pre'>layoutName, key</span> ) : *<span class=\"signature\"></span></div><div class='description'><div class='short'>Gets the value of a named layout hint. ...</div><div class='long'><p>Gets the value of a named layout hint.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>layoutName</span> : String<div class='sub-desc'><p>The name of the layout to match.</p>\n</div></li><li><span class='pre'>key</span> : String<div class='sub-desc'><p>The name of the hint to match.</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'>*</span><div class='sub-desc'><p>The value of the hint or undefined if not found.</p>\n</div></li></ul></div></div></div><div id='method-moveBehind' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-moveBehind' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-moveBehind' class='name expandable'>moveBehind</a>( <span class='pre'>View</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Moves view to the behind sibling view ...</div><div class='long'><p>Moves view to the behind sibling view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>View</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>to move behind</p>\n</div></li></ul></div></div></div><div id='method-moveInFrontOf' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-moveInFrontOf' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-moveInFrontOf' class='name expandable'>moveInFrontOf</a>( <span class='pre'>View</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Moves view to the front of sibling view ...</div><div class='long'><p>Moves view to the front of sibling view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>View</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>to move in front of</p>\n</div></li></ul></div></div></div><div id='method-moveToBack' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-method-moveToBack' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-method-moveToBack' class='name expandable'>moveToBack</a>( <span class='pre'></span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Moves view behind all other sibling views ...</div><div class='long'><p>Moves view behind all other sibling views</p>\n</div></div></div><div id='method-sendEvent' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/Eventable' rel='Eventable' class='defined-in docClass'>Eventable</a><br/><a href='source/layout.html#Eventable-method-sendEvent' target='_blank' class='view-source'>view source</a></div><a href='#!/api/Eventable-method-sendEvent' class='name expandable'>sendEvent</a>( <span class='pre'>name, value</span> ) : <a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a><span class=\"signature\"><span class='chainable' >chainable</span></span></div><div class='description'><div class='short'>Sends an event ...</div><div class='long'><p>Sends an event</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>name</span> : String<div class='sub-desc'><p>the name of the event to send</p>\n</div></li><li><span class='pre'>value</span> : Object<div class='sub-desc'><p>the value to send with the event</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'><a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a></span><div class='sub-desc'><p>this</p>\n</div></li></ul></div></div></div><div id='method-setAndFire' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/Eventable' rel='Eventable' class='defined-in docClass'>Eventable</a><br/><a href='source/layout.html#Eventable-method-setAndFire' target='_blank' class='view-source'>view source</a></div><a href='#!/api/Eventable-method-setAndFire' class='name expandable'>setAndFire</a>( <span class='pre'>name, value</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Stores the value on this object and fires an event. ...</div><div class='long'><p>Stores the value on this object and fires an event.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>name</span> : String<div class='sub-desc'><p>the name of the attribute to set</p>\n</div></li><li><span class='pre'>value</span> : Object<div class='sub-desc'><p>the value to set to</p>\n</div></li></ul></div></div></div><div id='method-setAttribute' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/Eventable' rel='Eventable' class='defined-in docClass'>Eventable</a><br/><a href='source/layout.html#Eventable-method-setAttribute' target='_blank' class='view-source'>view source</a></div><a href='#!/api/Eventable-method-setAttribute' class='name expandable'>setAttribute</a>( <span class='pre'>name, value</span> ) : <a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a><span class=\"signature\"><span class='chainable' >chainable</span></span></div><div class='description'><div class='short'>Sets an attribute on this object, calls a setter function if it exists. ...</div><div class='long'><p>Sets an attribute on this object, calls a setter function if it exists.\nAlso stores the attribute in a property on the object and sends an event\nwith the new value.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>name</span> : String<div class='sub-desc'><p>the name of the attribute to set</p>\n</div></li><li><span class='pre'>value</span> : Object<div class='sub-desc'><p>the value to set to</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'><a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a></span><div class='sub-desc'><p>this</p>\n</div></li></ul></div></div></div><div id='method-setAttributes' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/Eventable' rel='Eventable' class='defined-in docClass'>Eventable</a><br/><a href='source/layout.html#Eventable-method-setAttributes' target='_blank' class='view-source'>view source</a></div><a href='#!/api/Eventable-method-setAttributes' class='name expandable'>setAttributes</a>( <span class='pre'>attributes</span> ) : <a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a><span class=\"signature\"><span class='chainable' >chainable</span></span></div><div class='description'><div class='short'>Calls setAttribute for each name/value pair in the attributes object ...</div><div class='long'><p>Calls setAttribute for each name/value pair in the attributes object</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>attributes</span> : Object<div class='sub-desc'><p>An object of name/value pairs to be set</p>\n</div></li></ul><h3 class='pa'>Returns</h3><ul><li><span class='pre'><a href=\"#!/api/Eventable\" rel=\"Eventable\" class=\"docClass\">Eventable</a></span><div class='sub-desc'><p>this</p>\n</div></li></ul></div></div></div></div></div><div class='members-section'><div class='definedBy'>Defined By</div><h3 class='members-title icon-event'>Events</h3><div class='subsection'><div id='event-onclick' class='member first-child inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onclick' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onclick' class='name expandable'>onclick</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when this view is clicked ...</div><div class='long'><p>Fired when this view is clicked</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-ondestroy' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-event-ondestroy' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-event-ondestroy' class='name expandable'>ondestroy</a>( <span class='pre'>node</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when this node and all its children are about to be destroyed ...</div><div class='long'><p>Fired when this node and all its children are about to be destroyed</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>node</span> : <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-oninit' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.node' rel='dr.node' class='defined-in docClass'>dr.node</a><br/><a href='source/layout.html#dr-node-event-oninit' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.node-event-oninit' class='name expandable'>oninit</a>( <span class='pre'>node</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when this node and all its children are completely initialized ...</div><div class='long'><p>Fired when this node and all its children are completely initialized</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>node</span> : <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.node\" rel=\"dr.node\" class=\"docClass\">dr.node</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-onmousedown' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onmousedown' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onmousedown' class='name expandable'>onmousedown</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when the mouse goes down on this view ...</div><div class='long'><p>Fired when the mouse goes down on this view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-onmouseout' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onmouseout' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onmouseout' class='name expandable'>onmouseout</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when the mouse moves off this view ...</div><div class='long'><p>Fired when the mouse moves off this view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-onmouseover' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onmouseover' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onmouseover' class='name expandable'>onmouseover</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when the mouse moves over this view ...</div><div class='long'><p>Fired when the mouse moves over this view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-onmouseup' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onmouseup' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onmouseup' class='name expandable'>onmouseup</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when the mouse goes up on this view ...</div><div class='long'><p>Fired when the mouse goes up on this view</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that fired the event</p>\n</div></li></ul></div></div></div><div id='event-onscroll' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-onscroll' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-onscroll' class='name expandable'>onscroll</a>( <span class='pre'>scroll</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when the scroll position changes. ...</div><div class='long'><p>Fired when the scroll position changes. Also provides information about\nthe scroll width and scroll height though it does not refire when those\nvalues change since the DOM does not generate an event when they do. This\nevent is typically delayed by a few millis after setting scrollx or\nscrolly since the underlying DOM event fires during the next DOM refresh\nperformed by the browser.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>scroll</span> : Object<div class='sub-desc'><p>The following four properties are defined:\n    scrollx:number The horizontal scroll position.\n    scrolly:number The vertical scroll position.\n    scrollwidth:number The width of the scrollable area. Note this is\n      not the maximum value for scrollx since that depends on the bounds\n      of the scrollable view. The maximum can be calculated using this\n      formula: scrollwidth - view.width + 2<em>view.border\n    scrollheight:number The height of the scrollable area. Note this is\n      not the maximum value for scrolly since that depends on the bounds\n      of the scrollable view. The maximum can be calculated using this\n      formula: scrollheight - view.height + 2</em>view.border</p>\n</div></li></ul></div></div></div><div id='event-subviewAdded' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-subviewAdded' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-subviewAdded' class='name expandable'>subviewAdded</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when a subview is added to this view. ...</div><div class='long'><p>Fired when a subview is added to this view.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that was added</p>\n</div></li></ul></div></div></div><div id='event-subviewRemoved' class='member  inherited'><a href='#' class='side expandable'><span>&nbsp;</span></a><div class='title'><div class='meta'><a href='#!/api/dr.view' rel='dr.view' class='defined-in docClass'>dr.view</a><br/><a href='source/layout.html#dr-view-event-subviewRemoved' target='_blank' class='view-source'>view source</a></div><a href='#!/api/dr.view-event-subviewRemoved' class='name expandable'>subviewRemoved</a>( <span class='pre'>view</span> )<span class=\"signature\"></span></div><div class='description'><div class='short'>Fired when a subview is removed from this view. ...</div><div class='long'><p>Fired when a subview is removed from this view.</p>\n<h3 class=\"pa\">Parameters</h3><ul><li><span class='pre'>view</span> : <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a><div class='sub-desc'><p>The <a href=\"#!/api/dr.view\" rel=\"dr.view\" class=\"docClass\">dr.view</a> that was removed</p>\n</div></li></ul></div></div></div></div></div></div></div>","meta":{}});