next up previous contents
Next: 3.3.1.1 Dragged Zoom Up: 3.3 Timeline Window Previous: 3.3 Timeline Window   Contents


3.3.1 Zoomable and Scrollable Canvas

When viewing a big slog2 file like the one shown in Figure [*], the whole timeline canvas is filled up with preview drawables. Though it provides a reasonable description at high level, i.e. one still gets a vague sense where the long and/or frequent drawables are. Nevertheless, it is pretty obscure to know the details. Hence, a well-designed zoomable and scrollable user interface (ZSUI) of the timeline canvas becomes an absolute necessity to facilitate the location of events of interest. The ZSUI of the timeline canvas includes many parts and operations. But the most handy ones are dragged zoom, grasp and scroll and instant zoom in and out.All these features are supported by the Zoomable and Scrollable canvas. There are 2 such canvases in the Timeline window. They are Timeline Canvas and Time Ruler Canvas. In these canvases, left mouse clicking can be alternated in 2 different modes by a pair of toggled buttons as shown in Figures [*] and [*]. They are called Zoom and Hand modes. Each canvas in the Timeline window has its own set of toggled buttons that determine its left mouse click behavior. The timeline canvas's toggled buttons are located above the canvas and sit at the end of the time display panel. The time ruler's toggled buttons are located at the bottom of row adjustment panel, i.e. sit right next to the end of the ruler. By default, the timeline canvas is in zoom mode and the time ruler canvas is in hand mode, so user can do zooming when the cursor is in the timeline canvas and can scroll easily by simply moving the cursor over the ruler canvas. Also, the scrolling can be done by simply dragging on scrollbar's knob, clicking the end buttons and in the space between the knob and scrollbar's end buttons.

Figure: Canvas's left mouse click is in zoom mode.
Image mouse_zoom_mode

Figure: Canvas's left mouse click is in hand mode.
Image mouse_hand_mode



Subsections
next up previous contents
Next: 3.3.1.1 Dragged Zoom Up: 3.3 Timeline Window Previous: 3.3 Timeline Window   Contents