PaintToolsPluginOptions: { buttonPosition?: number | false; fontNames?: string[]; toolbarLayout?: { effectsTools: ToolbarItemType[] | false; paintTools: ToolbarItemType[] | false; textTools: ToolbarItemType[] | false } }

Options for the PaintToolsPlugin.

Type declaration

  • Optional buttonPosition?: number | false

    The position where the "Paint tools", "Text tools" and "Effects" buttons should be inserted in the main toolbar. Use false or -1 to skip insertion. Undefined means the position will be determined automatically.

  • Optional fontNames?: string[]

    Array of available font names.

    Default

    ['Arial', 'Verdana', 'Helvetica', 'Tahoma', 'Trebuchet MS', 'Times New Roman', 'Georgia', 'Garamond', 'Courier New', 'Brush Script MT']

  • Optional toolbarLayout?: { effectsTools: ToolbarItemType[] | false; paintTools: ToolbarItemType[] | false; textTools: ToolbarItemType[] | false }

    Optional. Specifies the layout of the paint, text and effects toolbar. Defaults:

    • paintTools: ["Apply", "Cancel", "Splitter", "Selection", "Pencil", "Brush", "CloneStamp", "Eraser", "Splitter", "Size", "Color", "UseOriginalImage", "Splitter", "Undo", "Redo"]
    • textTools: ["Text", "Splitter", "FontSize", "FontName", "FontBold", "FontItalic", "FontColor", "Splitter", "Undo", "Redo", "Splitter", "Apply", "Cancel"]
    • effectsTools: ["Apply", "Cancel", "Splitter", "Selection", "Splitter", "BrightnessContrast", "Vibrance", "Blur", "Pixelate", "Splitter", "Eraser", "Size", "UseOriginalImage", "Splitter", "Undo", "Redo"]

    Example

    // Modify paint tools toolbar
    viewer.addPlugin(new PaintToolsPlugin({
    toolbarLayout: {
    paintTools: ["Pencil", "Size", "Color", "Splitter", "Apply", "Cancel"]
    }
    }));

    Example

    // Modify text tools toolbar
    viewer.addPlugin(new PaintToolsPlugin({
    toolbarLayout: {
    textTools: ["Text", "FontSize", "Splitter", "Apply", "Cancel"]
    }
    }));

    Example

    // Modify effects tools toolbar
    viewer.addPlugin(new PaintToolsPlugin({
    toolbarLayout: {
    effectsTools: ["Apply", "Cancel", "Splitter", "Brightness", "Pixelate" ]
    }
    }));

    Example

    // Hide the text tools and paint tools buttons from the main toolbar, showing only the effects button:
    viewer.addPlugin(new PaintToolsPlugin({
    toolbarLayout: {
    textTools: false,
    paintTools: false
    }
    }));
    • effectsTools: ToolbarItemType[] | false

      Array of items for the effects tools toolbar. Set to false if you want to hide this toolbar item.

      Default

      ["Apply", "Cancel", "Splitter", "Selection", "Splitter", "BrightnessContrast", "Vibrance", "Blur", "Pixelate", "Splitter", "Eraser", "Size", "UseOriginalImage", "Splitter", "Undo", "Redo"]

    • paintTools: ToolbarItemType[] | false

      Array of items for the paint tools toolbar. Set to false if you want to hide this toolbar item.

      Default

      ["Apply", "Cancel", "Splitter", "Selection", "Pencil", "Brush", "CloneStamp", "Eraser", "Splitter", "Size", "Color", "UseOriginalImage", "Splitter", "Undo", "Redo"]

    • textTools: ToolbarItemType[] | false

      Array of items for the text tools toolbar. Set to false if you want to hide this toolbar item.

      Default

      ["Apply", "Cancel" , "Splitter", "Text", "Splitter", "FontSize", "FontName", "FontBold", "FontItalic", "FontColor", "Splitter", "Undo", "Redo"]