dojox/drawing/ui/Toolbar (version 1.10)

Summary

A Toolbar used for holding buttons; typically representing the Stencils used for a DojoX Drawing.

Creates a GFX-based toolbar that holds GFX-based buttons. Can be either created within the actual drawing or within a separate DOM element. When within the drawing, the toolbar will cover a portion of the drawing; hence the option.

A Toolbar can be created programmatically or in markup. Currently markup is as a separate DOM element and programmatic is within the drawing.

Usage

var foo = new Toolbar(props,node);
dojox/drawing/ui/Toolbar
Parameter Type Description
props undefined
node undefined

Examples

Example 1

dojo.connect(myDrawing, "onSurfaceReady", function(){
    new dojox.drawing.ui.Toolbar({
        drawing:myDrawing,
        tools:"all",
        plugs:"all",
        selected:"ellipse"
    });
});


<div dojoType="dojox.drawing.ui.Toolbar" id="gfxToolbarNode" drawingId="drawingNode"
      class="gfxToolbar" tools="all" plugs="all" selected="ellipse" orient="H"></div>

Property Summary

  • marginThe space between each button.
  • paddingThe amount of spce between the top and left of the toolbar and the buttons.
  • radiusThe size of the button&#39;s rounded corner
  • sizeThe width and height of the button
  • strPlugsA comma delineated list of the plugins to include in the Toolbar.
  • strSelectedThe button that should be selected at startup.
  • strToolsA comma delineated list of the Stencil-tools to include in the Toolbar.
  • toolPlugGapThe distance between the tool buttons and plug buttons

Method Summary

Event Summary

Properties

margin
Defined by: dojox/drawing/ui/Toolbar

The space between each button.

padding
Defined by: dojox/drawing/ui/Toolbar

The amount of spce between the top and left of the toolbar and the buttons.

radius
Defined by: dojox/drawing/ui/Toolbar

The size of the button's rounded corner

size
Defined by: dojox/drawing/ui/Toolbar

The width and height of the button

strPlugs
Defined by: dojox/drawing/ui/Toolbar

A comma delineated list of the plugins to include in the Toolbar. If "all" is used, all registered plugins are included.

strSelected
Defined by: dojox/drawing/ui/Toolbar

The button that should be selected at startup.

strTools
Defined by: dojox/drawing/ui/Toolbar

A comma delineated list of the Stencil-tools to include in the Toolbar. If "all" is used, all registered tools are included.

toolPlugGap
Defined by: dojox/drawing/ui/Toolbar

The distance between the tool buttons and plug buttons

Methods

_mixprops(props,objNode)
Defined by dojox/drawing/ui/Toolbar

Internally used for mixing in props from an object or from a dom node.

Parameter Type Description
props Array
objNode Object | Node
addBack()
Defined by dojox/drawing/ui/Toolbar

Internal. Adds the back, behind the toolbar.

addPlugin()
Defined by dojox/drawing/ui/Toolbar
addTool()
Defined by dojox/drawing/ui/Toolbar
makeButtons()
Defined by dojox/drawing/ui/Toolbar

Internal. create buttons.

Events

onPlugClick(button)
Defined by: dojox/drawing/ui/Toolbar

Plugin click event. May be connected to.

Parameter Type Description
button Object

Examples

Example 1

dojo.connect(myDrawing, "onSurfaceReady", function(){
    new dojox.drawing.ui.Toolbar({
        drawing:myDrawing,
        tools:"all",
        plugs:"all",
        selected:"ellipse"
    });
});


<div dojoType="dojox.drawing.ui.Toolbar" id="gfxToolbarNode" drawingId="drawingNode"
      class="gfxToolbar" tools="all" plugs="all" selected="ellipse" orient="H"></div>
onRenderStencil(stencil)
Defined by: dojox/drawing/ui/Toolbar

Stencil render event.

Parameter Type Description
stencil Object

Examples

Example 1

dojo.connect(myDrawing, "onSurfaceReady", function(){
    new dojox.drawing.ui.Toolbar({
        drawing:myDrawing,
        tools:"all",
        plugs:"all",
        selected:"ellipse"
    });
});


<div dojoType="dojox.drawing.ui.Toolbar" id="gfxToolbarNode" drawingId="drawingNode"
      class="gfxToolbar" tools="all" plugs="all" selected="ellipse" orient="H"></div>
onToolClick(button)
Defined by: dojox/drawing/ui/Toolbar

Tool click event. May be connected to.

Parameter Type Description
button Object

Examples

Example 1

dojo.connect(myDrawing, "onSurfaceReady", function(){
    new dojox.drawing.ui.Toolbar({
        drawing:myDrawing,
        tools:"all",
        plugs:"all",
        selected:"ellipse"
    });
});


<div dojoType="dojox.drawing.ui.Toolbar" id="gfxToolbarNode" drawingId="drawingNode"
      class="gfxToolbar" tools="all" plugs="all" selected="ellipse" orient="H"></div>
Error in the documentation? Can’t find what you are looking for? Let us know!