Graphic and animation design and programming Modes

I,
Layered graphics graphic layering

Scenario

Graphics programs often need to overlay images. Graphical Data may come from different data sources or be presented using different algorithms. You may also need to switch between different types of visual image data.

However, a single class that manages and presents different combinations of visual graphic data will make it difficult to maintain the class.

Solution

Concrete into a graphic layer

Each layer obtains the graphic data required for this layer type and presents it to the display unit. The display unit is only responsible for drawing layers according to the order of the graphic layer and their visibility. The layer also requests the display unit to be re-drawn when their data changes or when the user switches their visibility.

If the user must interact with the data at the graphic layer, additional support must be provided for each layer programming, such as checking whether the user clicks on the elements displayed at a certain layer. You can select an activity layer that receives all input (this method is used by Photoshop and gimp ).

Known applications: Photoshop and, gimp, Visio, and many other applications.

2. Structured graphics structured graphics

Scenario

Programming for graphic display is complex. A program must manage what to draw on display, how to draw and when to draw.

Programmers are only interested in what to draw, but not in how to draw and when to draw.

Solution

Users can define what to draw through the aggregation of objects, and provide reusable mechanisms to control how and when to draw those objects to the display unit.

Each graphic object is encapsulated into a display element (an image, circle, rectangle, and a piece of text ). Provides reusable code to draw graphical objects to display units when necessary (for example, as responses to events or changes to graphical objects.

Then the programmer can easily define what code to draw and how to reuse and when to draw the code.

It is also easy to define the graphic objects of a combination in the combination mode. The combination of multiple graphic objects is no different from that of independent graphic objects. If you need a complex combination of images, the graphic objects can be structured into a scenegraph.

If the programmer needs to define new operations acting on the graphic object, the visitorpattern mode can be used.

The rendering algorithm can use deferredupdates to draw to a doublebuffer. When multiple graphic objects need to be updated each time, buffergraphiccommands can be used.
To optimize display updates.

Known applications include hotdraw, interviews, unidrawframework, scenebeans,
Visio, Microsoft PowerPoint, and a large number of other graphics tools and applications.

III,
Scene Graph scenario

Scenario

Most graph APIs are stateful. The Program sets the painting status in the Display Manager to define the painting color, Font, conversion operation, fill texture, and so on. This reduces the amount of data that needs to be drawn across kernel boundaries or networks.

But how do you combine structured images?

If you use structuredgraphics to write a graph program, you may want to define a combination shape and then draw it in different sizes, rotations, or colors at different positions on the display.

Solution

Each structuredgraphics object should encapsulate modifications to the drawing status in the Display Manager, suchSingletransform. The combination of graphic objects allows sub-objects to inherit the drawing state created by the container tree.

Use oneDirectedacyclicgraph defines a visual object (leaf represents the basic shape, and the intermediate node either encapsulates a small, State-reversible subgraph, or combines multiple subgraphs ).

Perform the following draw operations on various types of nodes through the depth priority algorithm.

Intermediate node: changes the status to the Display Manager, draws a subgraph, and restores the previous state.

Composite nodes: draw each of their subgraphs in sequence. Advanced systems can achieve other composite operations, such as constructing a region (or cube) shape (CAG or CSG ).

Page node: Draw the basic shape. Each shape drawing will be affected by the status after all changes applied to the Display Manager.

Once a shape is defined and connected to different parts of the graph, it can be drawn multiple times using different conversions and other operations. Different conversions can be used each time a graph is accessed.

Compared with a simple structuredgraphics framework, it is difficult to map the scene map leaf nodes to the display area, because any conversion can affect the leaf shape of the image. These calculations require the smallest refresh rectangle refreshrectangles or interaction. Such a ing must be implemented by traversing the entire graph, and the conversion tracing can be maintained by performing matrix multiplication on each traversal object. Even if it requires more computing than the simple structuredgraphics framework algorithm, it can still greatly reduce the drawing time when calculating the smallest refresh rectangle.

Scenario diagrams are often used as advanced interfaces for assembling compiledgraphiccommands.

Rendergraph is the optimization of the scene graph mode.

The scene chart mode is often used in the 3D graphic toolkit. In particular, openinventor, openscenegraph, and
Java3D uses the scenario diagram to structure the scenario. But it is rarely used in 2D graphics. Examples include the morphicinterface framework in selflanguage and squeaksmalltalk, scenebeans and
Jazz toolkits for Java, gnomecanvas display widget, and SVG graphics file format.

4. paper pen and person Mode

Intention

Separating the rendering mechanism from the painting Behavior

Motivation

When building an object-oriented graphics system, you must connect to an existing host window system. The host Window System APIs usually contain operations (line, rectangle, arc, etc.) that draw graphical elements in a window ). Ing these APIs to a group of objects usually relies on the basic method of drawing.

Participants

Pen

Execute the drawing command of the graphic primitive (line, rectangle, arc, etc ).

Maintain an internal status (color, line width, etc)

Paper

Indicates the operating system surface to be drawn (bitmap, screen, window)

Often responsible for creating pens

Person

Draw meaningful shapes and graphics with a pen.

Collaboration

People know how to draw a specific visual image (a bar chart or a simple line of text ). The painting is completed by sending the drawing command to the pen. People are isolated from specific types of paper, allowing the same graphics to be painted on bitmap, screen, or printer.

Draw commands are separated from how to draw.

Implementation

Pens often encapsulate necessary API calls to draw graphical elements. Most window systems need a window handle to send these calls, so it gets it through paper. Paper is often divided into quilts to display different types of graphic media (bitmap, screen, and printer ). Also, the quilt category represents each specific type of visual object.

Known applications

Smalltalk/V and visualworks use this pattern in their graphics systems. In
Smalltalk/V, pen is represented by pen class, paper is represented by graphicsmedium and its subclass. People are represented by subpane's subclass. In visualworks
Pen is the graphicscontext class. Paper is the displaysurface class and its subclass. Person is represented at the visualcomponent level.
IBM Smalltalk has similar concepts, but it does not fully map like Smalltalk/V and visualworks.

5. discrete Cartesian geometry primitives discrete Cartesian ry

VI,
Continuous Cartesian geometry primitives continuous Cartesian ry

VII,
Fixed Point Cartesian geometry primitives fixed point Cartesian ry

8. Window per task each task has a window

Create a specific window for the tasks that each user must execute. All the information required to complete the task should be available in the fewpanes window.

9. A small number of fewpanes pane

10. Standard panes

Problem

People must learn to operate on each type of pane provided on each window fewpanes.

Solution

Format each pane into several standard pane.

XI,
Short menus shortcut menu

Scenario

Elements of the pop-up menu must be searched visually from time to time.

Solution: Make the pop-up menu short, fixed, and single level.

12,
Avoid drawing avoid painting

Scenario

The graphic API uses several function calls to move a large amount of data. Such as bit block transfer, filling, or drawing a large number of lines to present a 3D polygon with textures. All operations are performed to render a single frame by increasing the time used. Large display, higher color depth, anti-sawtooth, alpha channel (transparent) and other things that are proud of our users aggravate performance problems.

Solution

Avoid plotting as much as possible.

Estimate as much as possible to reduce the number of screen updates. For example, calculate the minimum refresh rectangle that contains any paint changes on the display and the minimum refresh rectangle painting area of the cut display. As a general rule of thumb, doing more computing to reduce the number of blitting operations will benefit from this, especially if you draw a doublebuffer and then blit to the display.

Use deferredupdates and estimate as much as possible to avoid drawing points of the same frame multiple times. Executable pre-calculations include removing hidden painting surfaces from 3D images or cutting in 2D images.

In addition, the advantages of the graphic driver are used. Use aggregated graphical commandsAggregategraphiccommandsTo avoid multiple primitive graphics commands, which can reduce the communication overload between your program and the driver. For example, most display Management provides basic operations for explicit and multi-line segments. The latter is also directly to the Renderer, so a multi-line segment request is faster than multiple single-line requests.

3D graphics applications can use the viewfrustumculling algorithm to avoid drawing polygon that are not in the view area. backfaceculling is used to avoid drawing the surface of the object to the observer (because it is blocked by other faces ). More sophisticated algorithms include the use of quadtree or binaryspacepartitiontree to pre-calculate the spatial relationships that determine visibility.

Most space environments are divided into zones in an application-specific manner, and objects in the same area are drawn only for the visible person, for example, areas between rooms with closed doors.

XIII,
Deferred update delayed update

Deferred update is used to minimize display overload and flicker. Similar to the concept of an older graphics list display engine, a display processor receives and processes display requests to eliminate the need for applications to write the screen itself.

The display processor knows the Geometric Properties of physical display, computes the intersection of requests, and maintains a list of display areas to be updated. Requests that draw multiple times in the same region can be scheduled and optimized without actual access to the display. The display processor then redraws the display part (or whole) as a response to a request from a window system or hardware ).

This method is particularly helpful in scheduling display requests from multiple processes or threads.

14th,
Logical Alpha logic transparency

Used with deferredupdate and avoiddrawing.

Standard, Alpha channels calculate a pixel and a pixel when each graphic element is drawn. If the hardware supports acceleration, there is no high performance loss. If you have to do this through software for whatever reason, the speed will be slow like a snail bait.

As mentioned above, if you make some calculations before the actual painting, you can avoid redundant operations and usually accelerate the painting.

Keep a record of each drawing operation that has been executed, and then check each new operation with the previous operation. If there is an intersection, separate the new operations into a sequence of operations to express the intersection with various previous operations. Calculate the appropriate color of the screen for each operation and record it as a separate operation.

15th,
Idle updates idle update mode

Scenario

You are using deferemedipdates to write a graphics program to optimize display refresh. Your program uses event-driven display management, such as the X Window System or Win32
API.

How do you control when deferemedipdates is drawn?

Updates are usually generated in user input. The user input speed is slow compared with the computer speed. If the image update delay is 100 ms, the user will not notice it.

Solution

When no more user input events are to be processed, execute each deferredupdate.

This is easy to detect by querying whether the event queue is empty.

16th,
Double Buffer double buffer Mode

17,
Triple buffer triple Buffer

18. Refresh rectangles refresh the rectangle or dirty rectangle

19. Avoid Multiple Primitive Graphic commands avoids multiple basic graphics commands.

20. Graphic commands of aggregate graphic commands set

21,
Buffer graphic Commands Buffer graphics command

22. Graphic commands compiled by compiled graphic commands

Twenty-three, single transform single conversion

24,
Abstract session pattern abstract session Mode

Maintain multiple painting contexts on the same display surface.