ATF Timeline Editor Sample

Table of Contents Description ATF Features Demonstrated by TimelineEditor Run TimelineEditor How to Use TimelineEditor Working with Timeline Reference Documents Working with the Scrubber Working with the Tools Pan and Zoom Interval Splitting Mode Scaling Topics in this section

Description

TimelineEditor is a relatively full-featured timeline editor whose components have been used in real production tools.

To learn about the programming of this sample, see Timeline Editor Programming Discussion.

ATF Features Demonstrated by TimelineEditor

• Use of MEF (Managed Extensibility Framework) to put an application together using optional components.
• Use of the application shell framework, including CommandService, SettingsService, StatusService, and ControlHostService.
• Use of the TimelineControl, TimelineRenderer, and all the timeline manipulators - MoveManipulator, ScaleManipulator, ScrubberManipulator, SelectionManipulator, SnapManipulator, and SplitManipulator.
• A manipulator architecture that allows for new functionality to be added to or removed from a TimelineControl without having to modify the TimelineControl.
• Use of IPaletteService for showing a list of timeline object types that can be dragged from the palette into the document in order to instantiate new timeline objects.
• Use of the two property editors, PropertyEditor and GridPropertyEditor.
• An implementation of sub-document support where referenced documents appear as child documents within the tab of a main document.
• Multiple documents being opened simultaneously.
• Copy and paste within a document and between documents.

Run TimelineEditor

1. Double-click the TimelineEditor.exe in \bin\wws_atf\Release.
2. The TimelineEditor window appears.

TimelineEditor has the following panes:

• Palette: the timeline parts palette with these parts:
  • Marker: marks a global event, for example, 6 minutes into an animation, your world blows up. Markers apply globally and are owned by the timeline document: they do not belong to animation tracks or groups. Markers are drawn across all tracks.
  • Group: provides a way to organize animation tracks. Groups contain one or more tracks. You can hide a group of tracks or delete it, expand or collapse groups, and move tracks from one group to another. If a group is collapsed, you can't select anything in it. You can't nest groups.
  • Track: an animation track. Tracks are cinematic tools that ensure that animations play in the correct order. Each track contains intervals and keys. You can drag and drop tracks into a group and rename the track.
  • Interval: represents a duration of time that has a definite start and definite end.
  • Key: represents a point in time that has a definite start and a duration of 0. Keys belong to a track.
  • Reference: contains a reference to another timeline document along with a start time that offsets the referenced timeline.
• Property Editor: edit the selected element's property in a list control.
• Grid Property Editor: edit the selected element's property in a grid control.
• Output: show diagnostics; optional.
• Canvas: define, view, and edit timelines.

The toolbar contains buttons for file management: save, save as, save all, create new timeline document, open existing timeline document, print, page set-up, and print preview; for canvas viewing: panning and zooming to center a selection on the canvas; for editing: cut, copy, paste, delete, undo/redo.

The menu bar contains:

• File: create a new timeline, open an existing timeline, save, save as, and save all, close the current timeline, page setup, print preview, recently used files, and exit TimelineEditor.
• Edit: in addition to the standard editing functions (cut, copy, paste, undo/redo, select/deselect, invert selection), Edit provides:
  • Interval Splitting Mode: split the any interval with the next mouse click.
  • Keyboard Shortcuts: use the Customize Keyboard Shortcuts window to set up keyboard shortcuts.
  • Load or Save Settings: use the Load and Save Settings window to save current TimelineEditor application settings, or to load application settings from a file.
  • Preferences: set application and document preferences, such as command icon size and auto-load the last active documents.
• View: Fit in Active View: ensure that the current selection is visible on the canvas.
• Window: select and deselect panes, organize multiple document panes

How to Use TimelineEditor

TimelineEditor opens with an empty canvas. Choose File > New Timeline or click the button to create a new timeline document, or choose File > Open Timeline or click the button to open an existing timeline document. Drag elements from the Palette onto the canvas to work with them. Click the tabs for the various panes to view and edit element properties.

Working with Timeline Reference Documents

You can include other timeline documents in the current timeline by dragging a Reference object from the Palette onto the canvas. Timeline reference documents are also called timeline sub-documents. The timeline sub-document can contain additional timeline sub-documents. When you reference a timeline document, it is loaded into the current timeline document.

You cannot edit the timeline sub-document file within the current timeline document. You can expand and collapse the display of the timeline sub-document in the current timeline document, just as you expand and collapse groups. You can have the timeline sub-document and current timeline open at the same time, show them side by side on the canvas, and make changes. You can see the changes in both documents as you work with them: they're kept in sync. The timeline sub-document has a definite start point, which is like a key or interval. There is a diamond icon that indicates where the "0" time is on the timeline sub-document. When you drag a timeline reference from the Palette onto the canvas, you'll see a salmon-colored line. To set the timeline reference file:

1. Click the reference to select it. The timeline reference properties appear in the Property Editor and Grid Property Editor panes.
2. Click the FileName property, and then browse to the timeline file.

Working with the Scrubber

The scrubber is a vertical black line that is visible when you work with your timeline. The scrubber is not part of the document. There are events that are raised when you move the scrubber, and your application can take some action in response to the events. For example, if the timeline editor is attached to a game, moving the scrubber changes the time in the game. You can have the application take whatever action you want; you're basically saying, "I'm setting the current time to be something new". You could use the scrubber in conjunction with a play and pause button, for example.

Working with the Tools

Pan and Zoom

Use the Alt-left mouse and alt-right mouse buttons to pan and zoom the view of the timeline on the canvas.

Interval Splitting Mode

To use Interval Splitting Mode:

1. Select an interval.
2. Enter "S" (just plain "S"). The interval splits in half. You can split multiple intervals.

You can also choose Edit > Interval Splitting Mode

Scaling

There are two types of scaling:

• Drag the left or right border of a selected interval. If you have several intervals that represent the same event, you can drag the left or right edge of any selected intervals. The selected intervals scale by the same amount. Note that the scaling is not proportional: the selected intervals scale by the same distance along the timeline.
• Use the black scaling bar that appears on the horizontal timeline scale when you select any number of timeline objects (intervals, keys, or markers). The scaling bar scales the selected portion of the timeline. All timeline objects within the selected interval scale relative to each other; intervals that were adjacent before scaling remain adjacent with no gaps or overlaps.

Topics in this section