Task Style

• Overview
• Style Application
• Reusable Style
• In-line Style
• Setting Global Default Style
• Task Style Parts
• Actual Task State (Actual)
• Task Progress
• Planned Task State (Baseline)
• Task Tooltip Configuration
• Timeline Plot Row Fill Configuration
• DataGrid Row Fill Configuration
• DataGrid Row Height
• DataGrid Tooltip
• DataGrid Font
• Splitter Line

Overview

Task Style - is the cope-stone of tuning tasks functionality and visualization. This style is used to configure all task types: Regular Task, Summary Task and Milestone.

The illustration below shows almost every elements that are configured in task style:

Style Application

There are two options for style application: you can create reusable predefined style and then apply it to a task (each style has the unique id), or in-line in task node. Below you will find out what are pros and cons of each method.

Reusable Style

Reusable styles give you an opportunity to describe how task should be displayed only once and then apply it when needed.

To define and apply style you should use XML as shown:

As you can see, once the style is defined in <task_styles> with certain id, you can apply it to the resource using style attribute: <task style="sampleStyle"/>

In-line Style

If you need to change some setting for one task only, you can avoid creation of the new style and configure task visualization in-line.

Here is a sample how style can be defined in-line:

As you can see we have <style> node within<task> node, syntax is the same for reusable and in-line style.

Setting Global Default Style

You can define named style and apply it to all elements, but this may be inconvenient when there are a lot of elements, for example periods in a project.

AnyGantt allows you to set defaults for basic styles using defaults section. See Default Styles for more.

Task Style Parts

There are three elements that present the task - Actual Task State, Task Progress and Planned Task State. Illustration below shows these three elements:

Each of these elements is configured using Bar Style. Bar style is in charge for configuration of border, fill, markers, labels and interactive states. Bar Style is described in details in Bar Style Tutorial .

Actual Task State (Actual)

Actual start time and end time is set using actual_start and actual_end attributes of <task> node, for example:
<task actual_start="2008.07.01" actual_end="2008.07.12"/>.

As said above - visual representation is configured using Bar Styles. Bar style for actual state in configured like that:

Live sample shows modified border and fill for actual state:

To learn more about configuration like that - please refer to Bar Style Tutorial.

Task Progress

Task progress is optional, but it is used in the most of the cases and set using progress attribute of <task> node, for example: <task progress="72"/>.

Just as actual state the visual representation is configured using Bar Style. Here is the sample XML showing the modification of progress fill and border:

Live sample shows the same modifications:

To learn more about configuration like that - please refer to Bar Style Tutorial.

Planned Task State (Baseline)

Planned task state is optional, it set using baseline_start and baseline_end attribute in <task> node, for example:
<task baseline_start="2008.07.01" baseline_end="2008.07.12"/>.

Planned task bar is displayed under the actual bar and has its own settings. To configure planned task bar the following XML is used:

Live sample shows altered fill and border for planned bar:

To learn more about configuration like that - please refer to Bar Style Tutorial.

Task Tooltip Configuration

Using Task Style you can override default tooltip in task datagrid .

XML syntax:

This XML shows only the basic settings, to learn more please see XML Reference.

In this sample each task has its own style that changes tooltip :

Timeline Plot Row Fill Configuration

You can configure how task row in timeline plot looks like in normal and hovered state using <row> node.

XML look like that:

This XML shows only the basic settings, to learn more please see XML Reference.

Sample below shows custom timeline plot fill for three tasks and default settings for the fourth:

DataGrid Row Fill Configuration

Besides timeline plot row fill you can set datagrid row fill. Use <row_datagrid> to do that.

XML Sample for datagrid row configuration:

Sample below shows custom datagrid plot fill for three tasks and default settings for the fourth:

DataGrid Row Height

Using Task Style you can override default datagrid row height:

Here is a sample of a chart where two tasks have custom height:

DataGrid Tooltip

Using Task Style you can override default tooltip in task datagrid .

XML syntax:

This XML shows only the basic settings, to learn more please see XML Reference.

In this sample each task has its own style that changes tooltip :

DataGrid Font

Besides row fill Task style can also configure font for all cells in datagrid. You can set font for normal and hover states. the only limitation is the fact that these settings override datagrid column font settings.

Datagrid font settings configuration XML:

One style with normal and hover states and font settings is applied to all of the summary tasks in this live sample:

Splitter Line

If you want a splitter line between tasks you can alter style of some task so a splitter line appears befor or after this task. To draw splitter you have to add splitter node:

Splitter can be placed above or below the task, you have to set position attribute to "Top" or "Bottom" to change this. Splitter is a simple line, so you can set its thickness and color. Here is a sample of a chart where some tasks have splitters: