# GraffitiTimeline
Class Inherits GraffitiWebUIControl
## About
GraffitiTimeline is a powerful timeline display component designed to allow your users to view tasks in a time-oriented mechanism.Features:
*
Locale support
*
Grouping
*
Orientation customization
*
Major and minor labels
*
Custom Styling
*
Rolling mode to track current time
*
User editing
*
Zoom
*
Point, Box, and Line item types
## Preview


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 |
| --- | :---: | --- |
| Alignments | Default <br> Center <br> Left <br> Right | Supported alignment types. |
| AxisOrientations | Bottom <br> Top <br> Both <br> None | Supported axis orientations. |
| HeightModes | Auto <br> Fixed <br> FitItems | Supported height models. |
| ItemOrientations | Bottom <br> Top | Supported item orientation models. |
| SupportedLocales | en <br> en_US <br> en_GB <br> it <br> it_IT <br> it_CH <br> nl <br> nl_NL <br> nl_BE <br> de <br> de_DE <br> fr <br> fr_FR <br> fr_CA <br> fr_BE <br> uk <br> uk_UA <br> ru <br> ru_RU <br> pl <br> pl_PL | Supported locales and languages. |
| TimeScales | None <br> Year <br> Month <br> Week <br> Weekday <br> Day <br> Hour <br> Minute <br> Second | Supported time scale values. |
## Event Definitions
| Name | Parameters | Return Type | Description |
| --- | :---: | :---: | --- |
| BarMoved | bar as GraffitiTimelineBar | (None) | Raised when the user drags a bar to a new position. |
| Closing | (None) | (None) | |
| GroupsOrderChange | (None) | (None) | Raised when the user has reordered groups. |
| ItemAction | item as GraffitiTimelineItem | (None) | Raised when the user clicks on an item. |
| ItemMoved | item as GraffitiTimelineItem | (None) | Raised when the user has moved an item on the timeline. |
| ItemRemoved | item as GraffitiTimelineItem | (None) | Raised when the user removes an item by clicking the X button. |
| ItemSelectionChange | selectedItems() as GraffitiTimelineItem | (None) | Raised when the user has altered the selected items in the display. |
| Shown | (None) | (None) | |
| TimeAction | atDate as DateTime <br> toGroup as GraffitiTimelineGroup | (None) | Raised when user clicks an area of the timeline that does not contain an item. |
| ViewChanged | (None) | (None) | Raised when the user has change the viewable area range by scrolling, dragging, or zooming. |
## Methods
| Name | Parameters | Return Type | Description |
| --- | :---: | :---: | --- |
| AddBar | newBar as GraffitiTimelineBar | (None) | Adds a new bar to the timeline. |
| AddGroup | newGroup as GraffitiTimelineGroup | (None) | Adds a new group to the timeline. |
| AddItem | newItem as GraffitiTimelineItem | (None) | Adds a new item to the timeline. |
| AddRestriction | newRestriction as GraffitiTimelineRestriction | (None) | Adds a new restriction to the timeline. |
| BarAt | index as Integer | GraffitiTimelineBar | Returns the bar at the specified index. |
| DeslectAll | (None) | (None) | Deselects all selected items. |
| GroupAt | Index as Integer | GraffitiTimelineGroup | Returns the group at the specified index. |
| ItemAt | Index as Integer | GraffitiTimelineItem | Returns the item at the specified index. |
| LastBarIndex | (None) | Integer | Returns the index of the final bar added. |
| LastGroupIndex | (None) | Integer | Returns the index of the final group added. |
| LastItemIndex | (None) | Integer | Returns the index of the final item added. |
| LastRestrictionIndex | (None) | Integer | Returns the index of the final restriction added. |
| Redraw | (None) | (None) | Force a UI update. |
| RemoveAllBars | (None) | (None) | Removes all bars from the component. |
| RemoveAllGroups | (None) | (None) | Removes all groups from the component. |
| RemoveAllItems | (None) | (None) | Removes all items from the component. |
| RemoveAllRestrictions | (None) | (None) | Removes all restrictions from the component. |
| RemoveBar | BarToRemove as GraffitiTimelineBar | (None) | Removes the specified bar. |
| RemoveGroup | GroupToRemove as GraffitiTimelineGroup <br> RemoveAllItems as Boolean = True | (None) | Removes the specified group. |
| RemoveItem | ItemToRemove as GraffitiTimelineItem | (None) | Removes the specified item. |
| RemoveRestriction | RestrictionToRemove as GraffitiTimelineRestriction | (None) | Removes the specified restriction. |
| RestrictionAt | index as Integer | GraffitiTimelineRestriction | Returns the restriction at the specified index. |
| ShowAll | (None) | (None) | Scroll and Zoom the display to fit all items. |
| ShowItem | ItemToShow as GraffitiTimelineItem | (None) | Scroll and Zoom the display to show the specified item. |
| ShowTime | TimeToShow as DateTime | (None) | Scroll and Zoom the display to show the specified date object's value. |
| Attributes | Hidden = True | UpdateProperty | |
| Attributes | Hidden = True | UpdatePropertyMultiple | |
| ZoomIn | Percentage as Integer | (None) | Zoom the display in by the supplied percentage value. |
| ZoomOut | Percentage as Integer | (None) | Zoom the display out by the supplied percentage value. |
## Properties
| Name | Type | Default Value | Description |
| --- | :---: | :---: | --- |
| Alignment | GraffitiTimeline.Alignments | Nil | Alignment of items with type 'box', 'range', and 'background'. |
| CanAddItem | Boolean | Nil | When True, users are able to add items by interacting with the component. |
| CanChangeItemGroup | Boolean | Nil | When True, users can drag items from one group to another. |
| CanChangeItemTime | Boolean | Nil | When True, users can drag items to change their value. |
| CanMove | Boolean | Nil | Specifies whether the Timeline can be moved and zoomed by dragging the window. |
| CanMultiselect | Boolean | Nil | When True, users can select multiple items. |
| CanMultiselectGroup | Boolean | Nil | When True, users can select multiple groups. |
| CanOrderGroups | Boolean | Nil | When True users can drag groups to reorder them. |
| CanRemoveGroup | Boolean | Nil | When True, users can remove groups by interacting with the UI. |
| CanRemoveItem | Boolean | Nil | When True, users can remove items by interacting with the UI. |
| CanSelect | Boolean | Nil | When True, users can select items by clicking on them. |
| CanZoom | Boolean | Nil | When True, users can zoom the display by interacting with it. |
| CanZoomMouse | Boolean | Nil | When True, users can zoom the display using the mouse wheel. |
| CustomStyling | String | Nil | Controls custom CSS style. |
| DateMaximum | DateTime | Nil | The maximum date and time that can be displayed. |
| DateMinimum | DateTime | Nil | The minimum date and time that can be displayed. |
| DisplayLocale | SupportedLocales | Nil | Current display locale. |
| HeightMode | HeightModes | Nil | Vertical sizing of the timeline display within the component. |
| MarginAxis | Integer | Nil | Distance between axis points. |
| MarginItemHorizontal | Integer | Nil | Margin for horizontal item display. |
| MarginItemVertical | Integer | Nil | Margin for vertical item display. |
| OrientationAxis | AxisOrientations | Nil | Orientation of axis display. |
| OrientationItem | ItemOrientations | Nil | Orientation of items relative to the axis. |
| OverrideItemEdit | Boolean | Nil | When True, item edit properties are overridden in favor of those on the Timeline instance. |
| RollingMode | Boolean | Nil | When True, the timeline display will shift continuously to display the current date/time at center. |
| RollingModeOffset | Integer | Nil | Set how far from the left the rolling mode is implemented from. Percentage value (0-100). |
| ShowCurrentTime | Boolean | Nil | When True, displays a bar at the current date/time that the user cannot interact with. |
| ShowHelpTags | Boolean | Nil | When the mouse is hovered of an item with a helptag, it will be displayed if this value is true. |
| ShowMajorLabels | Boolean | Nil | Determines whether major labels, such as the day, are displayed. |
| ShowMinorLabels | Boolean | Nil | Determines whether minor labels, such as seconds, are displayed. |
| TimeAxisScale | TimeScales | Nil | Granularity of the time display. |
| TimeAxisStep | Integer | Nil | Interval used for the TimeAxisScale. |
| ViewEnd | DateTime | Nil | The current maximum viewable date in the display. |
| ViewStart | DateTime | Nil | The current minimum viewable date in the display. |