GRAFFITIKANBAN - GRAFFITISUITE DOCS

# 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 ![](https://graffitisuite.com/wp-content/uploads/2023/05/desktop_kanban1.png) Previous Next ## Compatibility ### Framework API Version | 1.0 | 2.0 | | :---: | :---: | | False | True | ### Console | 32-Bit | 64-Bit | | :---: | :---: | | True | True | ### Desktop | 32-Bit | 64-Bit | | :---: | :---: | | True | True | ### iOS | 32-Bit | 64-Bit | | :---: | :---: | | False | True | ### Web | 32-Bit | 64-Bit | | :---: | :---: | | True | True | ## Enumerations | Name | Value | Description | | --- | :---: | --- | | DragBehaviors | Anywhere Handle | Supported drag operation handles. | | DropBehaviors | Revert Remove Nearest | Supported drop result behaviors when a drag operation ends outside an expected area. | | Indicators | Default Primary Secondary Success Danger Warning Info Light Dark Link | Supported Bootstrap styles. | ## 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 item as GraffitiKanbanMenuItem | (None) | Fired when the user clicks or taps one of a column's GraffitiKanbanMenuItems | | ColumnMoved | column as GraffitiKanbanColumn 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 fromColumn as GraffitiKanbanColumn fromIndex as Integer toColumn as GraffitiKanbanColumn toIndex as Integer | (None) | Fired when an item is drag-moved by the user | | ItemPressed | item as GraffitiKanbanItem | (None) | | | ItemRemoved | item as GraffitiKanbanItem 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 item as GraffitiKanbanListItem | (None) | Fired when the user edits a list item on a GraffitiKanbanItem | | ListItemPressed | onItem as GraffitiKanbanItem item as GraffitiKanbanListItem | (None) | Fired when the user clicks or taps on a list item | | Shown | (None) | (None) | | ## Methods | Name | Parameters | Return Type | Description | | --- | :---: | :---: | --- | | AddColumn | col as GraffitiKanbanColumn | (None) | Adds the specified column to display | | AddItem | col as GraffitiKanbanColumn item as GraffitiKanbanItem | (None) | Adds the specified item to the specified column | | AddListItem | toItem as GraffitiKanbanItem item as GraffitiKanbanListItem | (None) | Adds the specified list item to the specified GraffitiKanbanItem | | AddMenuItem | col as GraffitiKanbanColumn item as GraffitiKanbanMenuItem | (None) | Adds the specified menu item to the specified GraffitiKanbanColumn | | Column | index as Integer | GraffitiKanbanColumn | Returns the column object at the specified index | | indicatorToClass | value as Indicators | String | | | InsertColumn | atIndex as Integer col as GraffitiKanbanColumn | (None) | Inserts col at the atIndex position | | InsertItem | atIndex as Integer onColumn as GraffitiKanbanColumn item as GraffitiKanbanItem | (None) | Inserts item to onColumn at the index specified by atIndex | | InsertListItem | atIndex as Integer onItem as GraffitiKanbanItem item as GraffitiKanbanListItem | (None) | Inserts the specified list item. | | InsertMenuItem | atIndex as Integer onColumn as GraffitiKanbanColumn item as GraffitiKanbanMenuItem | (None) | Inserts the specified menu item. | | Item | col as GraffitiKanbanColumn index as Integer | GraffitiKanbanItem | Return the item at index on col | | LastColumnIndex | (None) | Integer | Returns the index of the final added column | | LastItemIndex | col as GraffitiKanbanColumn | Integer | Returns the index of the final added item on col | | LastListItemIndex | item as GraffitiKanbanItem | Integer | Returns the index of the final added list item on item | | LastMenuItemIndex | col as GraffitiKanbanColumn | Integer | Returns the index of the final added menu item on col | | ListItem | item as GraffitiKanbanItem index as Integer | GraffitiKanbanListItem | Returns the GraffitiKanbanListItem at the specified index on item | | MenuItem | col as GraffitiKanbanColumn index as Integer | GraffitiKanbanMenuItem | Returns the menu item specified by index from col | | RemoveAllColumns | (None) | (None) | Removes all columns. | | RemoveAllItems | col as GraffitiKanbanColumn | (None) | Removes all items. | | RemoveAllListItems | onItem as GraffitiKanbanItem | (None) | Removes all list items. | | RemoveAllMenuItems | col as GraffitiKanbanColumn | (None) | Removes all menu items. | | RemoveColumn | col as GraffitiKanbanColumn | (None) | Removes the specified column from the component | | RemoveItem | col as GraffitiKanbanColumn item as GraffitiKanbanItem | (None) | Removes the item specified from the passed column | | RemoveListItem | onItem as GraffitiKanbanItem item as GraffitiKanbanListItem | (None) | Removes item from the list items of onItem | | RemoveMenuItem | col as GraffitiKanbanColumn item as GraffitiKanbanMenuItem | (None) | Remove item from col | | ScrollTo | col as GraffitiKanbanColumn | (None) | Scrolls horizontally and vertically to the specified column | | ScrollTo | item as GraffitiKanbanItem | (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 | | | DragBehavior | DragBehaviors | Nil | Determines how a drag operation is initiated. | | 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 | | ShowDragHandles | Boolean | Nil | | | StackColumns | Boolean | Nil | When True, columns will be stacked vertically rather than span horizontally. |