Skip to main content

Some information on this page is outdated. Docs are work in progress.

What is a toolbar?

The toolbar is a set of settings for individual tools. An example toolbar for Shape Tool consists of Tool size integer, Fill shape boolean, and fill color.


How toolbars work

Toolbar is an abstract wrapper class for List of Settings, that allows easy access and settings sharing.

If several tools contain the same setting (same Setting Names), the toolbar will save and restore them on tool change. For example, if you change tool size in Pen Tool to 5px and then select Line Tool, the toolbar will still contain the same 5px tool size.

Accessing settings

To get a setting, use the GetSetting method, for example:

var toolbar = new BasicToolbar(); // Basic Toolbar contains only ToolSize setting
Setting toolSizeSetting = toolbar.GetSetting("ToolSize");

Creating toolbars

Creating toolbars is very easy, you just need to inherit from any Toolbar class. Then initialize your settings in the constructor.

Example Toolbar:

public class BasicShapeToolbar : BasicToolbar
public bool Fill => GetSetting<BoolSetting>(nameof(Fill)).Value;
public Color FillColor => GetSetting<ColorSetting>(nameof(FillColor)).Value;

//This Toolbar will contain 3 settings, ToolSize from BasicToolbar, Fill and FillColor
public BasicShapeToolbar()
Settings.Add(new BoolSetting("Fill", "Fill shape: "));
Settings.Add(new ColorSetting("FillColor", "Fill color"));

Applying Toolbar to Tool

To associate any Toolbar with the tool, assign Toolbar variable in the Tool constructor

public class ExampleToolViewModel : ToolViewModel
public ExampleToolViewModel()
Toolbar = ToolbarFactory.Create<ExampleToolViewModel, ExampleToolbar>();


To learn about Settings, check out this guide

All available toolbars can be found in PixiEditor.Models.Tools.ToolSettings.Toolbars namespace