AddShapesController Class Reference

Inheritance diagram for AddShapesController:

Additional Inherited Members
Public Member Functions inherited from Controller
	constructor (component)
	destroy ()
	Destruction this controller instance after component destroyed.
	getComponentByName (name)
	handle (...args)
Public Member Functions inherited from Disposable
	addDestroyHook (...hooks)
	destroy ()
Static Public Member Functions inherited from Controller
static	extend (proto, statics)
	Extends from Controller class and generates a new Controller class! More...
static	getName ()
	Name of the controller class used in @controller directive. More...
Protected Member Functions inherited from Controller
	mounted ()
	This method is called after the component is inserted into DOM tree, where you can add some event listeners to the component or handle any other tasks. More...
	postlink ()
	This method is called during component postlink lifecycle. More...
	prelink ()
	This method is called during component prelink lifecycle. More...
Static Protected Member Functions inherited from Controller
static	services ()
Protected Attributes inherited from Controller
Component	component
	The component of this controller. More...

Detailed Description

Feature:

Add shape objects. Advance edit feature.

Usage:

in template:

<ribbon-button @tooltip tooltip-title="add shapes" icon-class="fv__icon-menu-add-shapes" @controller="page-editor:AddShapesController as asc" not-immediately="true">
    <dropdown popup-class="fv__ui-shapes-dropdown" separate="false">
        <div class="fv__ui-shape-type-title">path</div>
        <dropdown-item name="path">
            <xbutton icon-class="fv__icon-path-line" @on.click="asc.addPath('Line')" name="Line"></xbutton>
            <xbutton icon-class="fv__icon-path-rect" @on.click="asc.addPath('Rectangle')" name="Rectangle"></xbutton>
            <xbutton icon-class="fv__icon-path-roundedRect" @on.click="asc.addPath('RoundRect')" name="RoundRect"></xbutton>
            <xbutton icon-class="fv__icon-path-circle" @on.click="asc.addPath('Ellipse')" name="Ellipse"></xbutton>
            <xbutton icon-class="fv__icon-path-brokenLine" @on.click="asc.addPath('Polyline')" name="Polyline"></xbutton>
            <xbutton icon-class="fv__icon-path-pentagonal" @on.click="asc.addPath('Polygon')" name="Polygon"></xbutton>
            <xbutton icon-class="fv__icon-path-curve" @on.click="asc.addPath('Polybezier')" name="Polybezier"></xbutton>
            <xbutton icon-class="fv__icon-path-closedCurve" @on.click="asc.addPath('Curve')" name="Curve"></xbutton>
            <xbutton icon-class="fv__icon-path-closedIrregularFigure" @on.click="asc.addPath('Freedom')" name="Freedom"></xbutton>
        </dropdown-item>
        <div class="fv__ui-shape-type-title">shading</div>
        <dropdown-item name="shading">
            <xbutton icon-class='fv__icon-shading-rect' @on.click="asc.addShading('Rectangle')" name="Rectangle"></xbutton>
            <xbutton icon-class='fv__icon-shading-roundedRect' @on.click="asc.addShading('RoundRect')" name="RoundRect"></xbutton>
            <xbutton icon-class='fv__icon-shading-circle' @on.click="asc.addShading('Ellipse')" name="Ellipse"></xbutton>
            <xbutton icon-class='fv__icon-shading-brokenLine' @on.click="asc.addShading('Polyline')" name="Polyline"></xbutton>
            <xbutton icon-class='fv__icon-shading-Pentagonal' @on.click="asc.addShading('Polygon')" name="Polygon"></xbutton>
            <xbutton icon-class='fv__icon-shading-curve' @on.click="asc.addShading('Polybezier')" name="Polybezier"></xbutton>
            <xbutton icon-class='fv__icon-shading-closedCurve' @on.click="asc.addShading('Curve')" name="Curve"></xbutton>
            <xbutton icon-class='fv__icon-shading-closedIrregularFigure' @on.click="asc.addShading('Freedom')" name="Freedom"></xbutton>
        </dropdown-item>
    </dropdown>
</ribbon-button>

Since

9.1.0