# GraffitiKanban
Class Inherits GraffitiWebUIControl
## About
GraffitiKanban is an amazing idea-board and collaboration component. Build out a project management application, save notes easily, or anything else you can dream up!Features:
*
Responsive column resizing
*
Drag columns or items to rearrange
*
Supports Dark Mode
*
Easily build in lists
## Preview

Previous
Next
## Warnings
### Linux Support
Support varies by Linux distribution and installed libwebkit library and version.
### Windows Support
Requires the presence of an HTMLViewer on a window or container within the project.
## Compatibility
### Framework API Version
| 1.0 | 2.0 |
| :---: | :---: |
| True | True |
### Desktop
| 32-Bit | 64-Bit |
| :---: | :---: |
| True | True |
## Enumerations
| Name | Value | Description |
| --- | :---: | --- |
| DragBehaviors | Anywhere <br> Handle | |
| DropBehaviors | Revert <br> Remove <br> Nearest | |
| Indicators | Default <br> Primary <br> Secondary <br> Success <br> Danger <br> Warning <br> Info <br> Light <br> Dark <br> Link | |
## Event Definitions
| Name | Parameters | Return Type | Description |
| --- | :---: | :---: | --- |
| Close | (None) | (None) | |
| ColumnAddPressed | column as GraffitiKanbanColumn | (None) | Fired when the user clicks the button at the bottom of a column |
| ColumnMenuItemPressed | column as GraffitiKanbanColumn <br> item as GraffitiKanbanMenuItem | (None) | Fired when the user clicks or taps one of a column's GraffitiKanbanMenuItems |
| ColumnMoved | column as GraffitiKanbanColumn <br> newIndex as Integer | (None) | Fired when the user moves a column by dragging |
| ColumnPressed | column as GraffitiKanbanColumn | (None) | |
| ColumnRemoved | column as GraffitiKanbanColumn | (None) | Fired when a column is removed as a result of the user dragging it off the display. This only occurs when using the Remove DropBehavior |
| ColumnSubtitleChanged | column as GraffitiKanbanColumn | (None) | Fired when the user changes the subtitle text of a column |
| ColumnTitleChanged | column as GraffitiKanbanColumn | (None) | Fired when the user changes the subtitle text of a column |
| ItemAvatarPressed | item as GraffitiKanbanItem | (None) | Fired when the user clicks an item's avatar image |
| ItemButtonPressed | item as GraffitiKanbanItem | (None) | Fired when the user clicks the button of an item |
| ItemContentChanged | item as GraffitiKanbanItem | (None) | Fired when the user edits the content of an item |
| ItemMoved | item as GraffitiKanbanItem <br> fromColumn as GraffitiKanbanColumn <br> fromIndex as Integer <br> toColumn as GraffitiKanbanColumn <br> toIndex as Integer | (None) | Fired when an item is drag-moved by the user |
| ItemPressed | item as GraffitiKanbanItem | (None) | |
| ItemRemoved | item as GraffitiKanbanItem <br> fromColumn as GraffitiKanbanColumn | (None) | Fired when an item is removed by user dragging it off the display. This only occurs when using the Remove DropBehavior |
| ItemTitleChanged | item as GraffitiKanbanItem | (None) | Fired when the user edits an item's title |
| ItemValueChanged | item as GraffitiKanbanItem | (None) | Raised when the value of an item has changed. |
| ListItemChanged | onItem as GraffitiKanbanItem <br> item as GraffitiKanbanListItem | (None) | Fired when the user edits a list item on a GraffitiKanbanItem |
| ListItemPressed | onItem as GraffitiKanbanItem <br> item as GraffitiKanbanListItem | (None) | Fired when the user clicks or taps on a list item |
| Shown | (None) | (None) | |
## Methods
| Name | Parameters | Return Type | Description |
| --- | :---: | :---: | --- |
| Sub | AddColumn | (None) | Adds the specified column to display |
| Sub | AddItem | (None) | Adds the specified item to the specified column |
| Sub | AddListItem | (None) | Adds the specified list item to the specified GraffitiKanbanItem |
| Sub | AddMenuItem | (None) | Adds the specified menu item to the specified GraffitiKanbanColumn |
| Function | Column | As | Returns the column object at the specified index |
| Sub | Constructor | (None) | Creates a new instance of the class. |
| Attributes | Hidden | indicatorToClass | |
| Sub | InsertColumn | (None) | Inserts col at the atIndex position |
| Sub | InsertItem | (None) | Inserts item to onColumn at the index specified by atIndex |
| Sub | InsertListItem | (None) | |
| Sub | InsertMenuItem | (None) | |
| Function | Item | As | Return the item at index on col |
| Function | LastColumnIndex | As | Returns the index of the final added column |
| Function | LastItemIndex | As | Returns the index of the final added item on col |
| Function | LastListItemIndex | As | Returns the index of the final added list item on item |
| Function | LastMenuItemIndex | As | Returns the index of the final added menu item on col |
| Function | ListItem | As | Returns the GraffitiKanbanListItem at the specified index on item |
| Function | MenuItem | As | Returns the menu item specified by index from col |
| Sub | RemoveAllColumns | (None) | |
| Sub | RemoveAllItems | (None) | |
| Sub | RemoveAllListItems | (None) | |
| Sub | RemoveAllMenuItems | (None) | |
| Sub | RemoveColumn | (None) | Removes the specified column from the component |
| Sub | RemoveItem | (None) | Removes the item specified from the passed column |
| Sub | RemoveListItem | (None) | Removes item from the list items of onItem |
| Sub | RemoveMenuItem | (None) | Remove item from col |
| Sub | ScrollTo | (None) | Scrolls horizontally and vertically to the specified column |
| Sub | ScrollTo | (None) | Scrolls horizontally and vertically to the specified column |
| Attributes | Hidden = True | UpdateProperty | |
| Attributes | Hidden = True | UpdatePropertyMultiple | |
## Properties
| Name | Type | Default Value | Description |
| --- | :---: | :---: | --- |
| ColumnDropBehavior | DropBehaviors | Nil | How drag and drop operations which result in the column being dropped outside of a valid drop target are to be resolved |
| ColumnsWidthExtraLarge | Integer | Nil | Percentage width of columns when the display width is greater than 1200 pixels |
| ColumnsWidthExtraSmall | Integer | Nil | Percentage width of columns when the display width is less than 576 pixels. This will also result in the columns reordering to a vertical stack rather spanning horizontally across the display |
| ColumnsWidthLarge | Integer | Nil | Percentage width of columns when the display width is greater than 992 pixels but less than 1200 pixels |
| ColumnsWidthMedium | Integer | Nil | Percentage width of columns when the display width is greater than 768 pixels but less than 992 pixels |
| ColumnsWidthSmall | Integer | Nil | Percentage width of columns when the display width is greater than 576 pixels but less than 768 pixels |
| CustomTheme | String | Nil | Overrides the default Bootstrap 4 theming. |
| DragBehavior | DragBehaviors | Nil | |
| DropBehavior | DropBehaviors | Nil | How drag and drop operations which result in the item being dropped outside of a valid drop target are to be resolved |
| Private | | GraffitiKanbanColumn | |
| Private | As | = | |
| Private | As | Nil | |
| Private | As | = | |
| Private | As | Nil | |
| Private | As | Nil | |
| Private | As | = | |
| Private | As | = | |
| Private | As | = | |
| Private | As | = | |
| Private | As | = | |
| Private | As | Nil | |
| Private | As | = | |
| Private | As | = | |
| Private | As | Nil | |
| Private | As | = | |
| Private | As | = | |
| ShowDragHandles | Boolean | Nil | |