Skip to content

Commit 2d0b2d9

Browse files
gantt eud (#113)
* Update grid.md * Update toc.yml * 123 * Update image-gallery.md * Describe web Gantt (#106) * Update grid.md * Update toc.yml * 123 * Update image-gallery.md * describe Gantt EUD * describe Gantt * update structure and links * fix links * fix link * fix links * fix toolbar.md * fix link * minor change * minor fix * fix * Apply suggestions from code review Co-authored-by: albertov05 <[email protected]> * minor changes * apply suggestion Co-authored-by: albertov05 <[email protected]> (cherry picked from commit a43cd40)
1 parent d8c4e5e commit 2d0b2d9

34 files changed

+202
-2
lines changed
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
title: Gantt
3+
author: Anna Kondratova
4+
---
5+
# Gantt
6+
7+
This section describes the Gantt control's capabilities.
8+
9+
![](~/interface-elements-for-web/images/Gantt/overview.png)
10+
11+
**Data Editing**
12+
13+
* [Add, Edit and Delete Tasks](gantt/data-editing/modify-tasks.md)
14+
15+
* [Add and Delete Dependencies](gantt/data-editing/modify-dependencies.md)
16+
17+
* [Add, Edit and Delete Resources](gantt/data-editing/modify-resources.md)
18+
19+
**UI Elements**
20+
21+
- [Context Menu](gantt/context-menu.md)
22+
23+
- [Toolbar](gantt/toolbar.md)
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
title: Context Menu
3+
---
4+
# Context Menu
5+
6+
Right-click a task to invoke the context menu.
7+
8+
![Gantt - context menu](~/interface-elements-for-web/images/Gantt/context-menu.png)
9+
10+
The context menu provides the following commands:
11+
12+
| Command | Description |
13+
|---|---|
14+
| Add -> New Tasks | Adds a new task. |
15+
| Add -> New Subtask | Adds a new subtask. |
16+
| Task Details | Invokes a dialog window where a user can edit a task. |
17+
| Delete Task | Deletes a task. |
18+
| Delete Dependency | Deletes a dependency. |
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
---
2+
title: Add and Delete Dependencies
3+
author: Anna Kondratova
4+
---
5+
# Add and Delete Dependencies
6+
7+
## Add Dependency
8+
9+
A dependency type specifies which edges (right or left - for preceding and succeeding tasks) serve as the start and end points for the dependency.
10+
11+
Move the mouse pointer above the preceding task's edge (marked with a circle) and drag the connector to the edge of the next task.
12+
13+
"Finish-To-Start" dependency between tasks:
14+
15+
![](~/interface-elements-for-web/images/Gantt/add-dependency.png)
16+
17+
## Delete Dependency
18+
19+
Right-click a dependency and select the "Delete Dependency" [context menu item](~/interface-elements-for-web/articles/gantt/context-menu.md).
20+
21+
![](~/interface-elements-for-web/images/Gantt/delete-dependency.png)
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
---
2+
title: Add and Delete Resources
3+
author: Anna Kondratova
4+
---
5+
# Add and Delete Resources
6+
7+
Double-click a task or use the [context menu](~/interface-elements-for-web/articles/gantt/context-menu.md) to open the 'Task Details' dialog window to manage resources.
8+
9+
## List of Available Resources
10+
11+
Click the "Resource Manager" button to modify the list of available resources.
12+
13+
![](~/interface-elements-for-web/images/Gantt/resource-manager.png)
14+
15+
Type the name of a new resource and click **Add** to add it to the list.
16+
17+
![](~/interface-elements-for-web/images/Gantt/new-resource.png)
18+
19+
Select a resource and click **Delete** to delete the resource from the list.
20+
21+
![](~/interface-elements-for-web/images/Gantt/delete-resource.png)
22+
23+
## Link Resource to Task
24+
25+
Click the "Resources" field to open a drop-down list with available resources.
26+
27+
![](~/interface-elements-for-web/images/Gantt/resource-list.png)
28+
29+
## Remove Resource from Task
30+
31+
Click the cross icon (on the right side of the resource) to remove it from the task.
32+
33+
![](~/interface-elements-for-web/images/Gantt/remove-resource.png)
Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
---
2+
title: Add, Edit and Delete Tasks
3+
author: Anna Kondratova
4+
---
5+
# Add, Edit and Delete Tasks
6+
7+
## Add a Task
8+
9+
To create a task, right-click an existing task and select the "Add" [context menu item](~/interface-elements-for-web/articles/gantt/context-menu.md), or click the "Add Task" [toolbar item](~/interface-elements-for-web/articles/gantt/toolbar.md):
10+
11+
- "New Task" - Adds a new task at the same level as the selected task.
12+
13+
![](~/interface-elements-for-web/images/Gantt/add-new-task.png)
14+
15+
- "New Subtask" - Adds a child task to the selected task.
16+
17+
![](~/interface-elements-for-web/images/Gantt/add-new-subtask.png)
18+
19+
## Edit a Task
20+
21+
Use one of the approaches described below to edit a task.
22+
23+
* Double-click a task in the task list.
24+
25+
![](~/interface-elements-for-web/images/Gantt/inline-editing.png)
26+
27+
* Right-click a task and select the "Task Details" context menu item (or double-click a task in the chart area).
28+
29+
![](~/interface-elements-for-web/images/Gantt/popup-edit-form.png)
30+
31+
* Move the mouse pointer over the task you want to modify.
32+
33+
![](~/interface-elements-for-web/images/Gantt/drag-and-drop.png)
34+
35+
**Move** - Drag the task to change its start and end times.
36+
37+
![](~/interface-elements-for-web/images/Gantt/moving.png)
38+
39+
**Resize** - Drag a resize handle (located at a task's edge) to change the task duration.
40+
41+
![](~/interface-elements-for-web/images/Gantt/resizing.png)
42+
43+
**Change progress** - Move the slider to change the task's progress.
44+
45+
![](~/interface-elements-for-web/images/Gantt/change-progress.png)
46+
47+
## Save Changes
48+
49+
The Gantt saves changes right after you edit a task in the task list or perform a drag-and-drop operation.
50+
51+
![](~/interface-elements-for-web/images/Gantt/manage-tasks.gif)
52+
53+
In the "Task Details" dialog, click OK to save changes.
54+
55+
![](~/interface-elements-for-web/images/Gantt/dialog-ok.png)
56+
57+
## Remove a Task
58+
59+
To remove a task, right-click a task and select the 'Delete Task' [context menu](~/interface-elements-for-web/articles/gantt/context-menu.md) item or [toolbar](~/interface-elements-for-web/articles/gantt/toolbar.md) item.
60+
61+
![](~/interface-elements-for-web/images/Gantt/delete-task.png)
62+
63+
## Undo/Redo Changes
64+
65+
Press Ctrl+Z or Ctrl+Y (or click "Undo" or "Redo" in the [toolbar](~/interface-elements-for-web/articles/gantt/toolbar.md)) to cancel or reverse changes.
66+
67+
![](~/interface-elements-for-web/images/Gantt/undo-redo.gif)
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
---
2+
title: Toolbar
3+
author: Anna Kondratova
4+
---
5+
6+
# Toolbar
7+
8+
![Gantt - toolbar](~/interface-elements-for-web/images/Gantt/toolbar.png)
9+
10+
The toolbar provides the following commands:
11+
12+
| Command | Description |
13+
|---|---|
14+
| Undo | Reverses the last action. |
15+
| Redo | Restores the previously undone action. |
16+
| Add Task | Adds a task. |
17+
| Delete Task | Deletes a task. |
18+
| Collapse Tasks | Collapses all tasks. |
19+
| Expand Tasks | Expands all tasks. |
20+
| Zoom In | Zooms in on the chart. |
21+
| Zoom Out | Zooms out the chart. |
22+
| Full Screen | Switches the Gantt to full screen. |

interface-elements-for-web/articles/grid.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@ author: Svetlana Nikulina
44
legacyId: 4854
55
---
66
# Grid
7-
This section describes the Grid's capabilities. It represents data in a tabular form, supports data editing, sorting, grouping, filtering, summary calculation, column resizing, data exporting and using data cell bands.
7+
8+
This section describes Grid control capabilities. A grid represents data in tabular form, and supports data editing, sorting, grouping, filtering, summary calculation, column resizing, data export and data cell bands.
89

910
![cdMasterDetail_Result](../images/img6625.png)
1011

interface-elements-for-web/articles/image-gallery.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,4 +14,4 @@ Hover an image to display the image description.
1414

1515
Click an image to display it in a [fullscreen viewer](image-gallery/fullscreen-viewer.md).
1616

17-
![ImageGallery_Full](../images/img22783.png)
17+
![ImageGallery_Full](../images/img22783.png)
8.04 KB
Loading
6.79 KB
Loading

0 commit comments

Comments
 (0)