1. 1 CMT2300 ----Fundamentals of Computer Graphics Revision Dr. Xiaohong Gao BG---Room 2C23 www.cs.mdx.ac.uk/staffpages/xiaohong/cmt2300 Week 11

2. 2 Course work --- Project : Animation Between 1 to 4 minutes To be submitted by May 2, week12. Please include a self-addressed-envelope to get feed back. To achieve distinction some extra features apart from lectures should be included, such as Visual C++ features: buttons, menus, etc.. Animation techniques: 3D, Double Buffering, etc..

3. 3 Exam 3 questions chosen from 5 questions. Each question carries 25 marks. Total marks are 75. Review lecture notes. Review Seminar exercises. www.cs.mdx.ac.uk/staffpages/xiaohong/cmt2300.html

4. 4 1. Review of Previous lectures (1/3) Output primitives Geometric Transformations - points - lines - curves - translation - scaling - rotation

5. 5 1. Review of Previous lectures (2/3) Matrix representation of transformations Animation Techniques - translation - scaling - rotation - reflection - Timer - Event - Tweening - Morphing - Double buffering

6. 6 1. Review of Previous lectures (3/3) Viewing Pipeline - 2D view pipeline - 3D viewing pipeline Useful Visual C++ Methods and Functions - OnDraw - MoveTo - LineTo - SetTimer - pDC->Ellipse(*) - pDC->Rectangle(*)

7. 7 2. Output primitives the basic building blocks for pictures are referred as output primitives. Routines for generating output primitives provide the basic tools for constructing pictures. E.g., character strings, “a”, “Welcome to CMT2300”. Geometric entities --- points, straight lines, curved lines, filled areas (polygons, circles, etc.).

8. 8 Example 1: Mathematical representation of lines and circles Lines: y = a x + b Cicles:x 2 + y 2 = r 2 //r is the radius

9. 9 3. Geometric Transformation (0) Geometric Transformation refers to changes of objects in orientation, size, and shape. These changes alter the co-ordinate description of objects. It is very useful in computer animation in altering or manipulating displays.

10. 10 3. Transformation ---- Scaling scaling: – alter the size of an object – objects are scaled according to scaling factors s x, s y original Change of s x Change of s y

11. 11 3. Transformation --- translation (2) A translation is applied to an object by re-positioning it along a straight-line path from one co-ordinate to another. To translate a two-dimensional point by adding translation distances, t x, t y, to the original co-ordinate. Translation is a rigid-body transformation that moves objects without deformation. (0,0)

12. 12 3. Transformation --- Rotation (3) Rotation is a 2D transformation. Rotation is to reposition an object along a circular path in the a xy plane. Objects rotated according to angle of rotation theta (  ). Rotation is by a given angle (  ) - if  >0, rotation is anticlockwise - if  <0, rotation is clockwise

13. 13 3. Transformation ---- Reflection (4) A reflection is a transformation that produces a mirror image of an object with reference to a specific line. This line can be thought as a mirror. The points are transformed by being moved to their corresponding positions on the other side of the mirror. This line can be a standard line, such as x-axis, or y-axis. This line can also be an arbitrarily defined line.

14. 14 4. Matrix Representation of Transformations (1) T(t x, t y ) = S(s x, s y ) = R(  ) =

15. 15 4. Matrix Representation of Transformations (2) Reflection about the line y = 0, the x axis, the matrix is Reflection about, the y axis, flips x coordinate, the matrix is

16. 16 4. Matrix Representation of Transformations (3) Reflection about, the origin and passes origin, the matrix is

17. 17 Example 2: For each of the following transformations, sketch the final position of the house after 2 transformations: 1). Translate (50, 0) then rotate (0,0, 90) 2). Rotate(0, 0, 90) then translate(50, 0)

18. 18 -25 -50 257550 25 50 -25 -50 1 2 1). Translate (50, 0) then rotate (0,0, 90)

19. 19 -25 -50 257550 25 50 -25 -50 1 2 1). Rotate(0, 0, 90) then translate(50, 0)

20. 20 5. Animation techniques (1) ---- Timer Example 3: Explain the usage of CTimer object in Visual C++ using the following line. SetTimer(1, 10, NULL); CTimer object is used to control events It is very useful for computer animation. SetTimer(1,10,NULL) means timer fires every 10 milliseconds. The above line should be created on OnCreate() method or others. Also, a windows message handler has to be added to CxxView class. Invalidate(TRUE) is to be added to CxxView “OnTimer()” method. Or Invalidate( TRUE) has to be added to “OnDraw()” method.

21. 21 5. Animation techniques (2) ---- Storyboard Example 4: Explanation of animation “ storyboard ” in terms of key frames and the usefulness of the key frames in designing sequences. Storyboard in computer animation is an outline of the action. It defines motion sequence as a set of events that are to take place. Depending on the type of animation to be produced, the storyboard could consist of a set of rough sketches or key frames. A key frame is a detailed drawing of the scene at a certain time in the animation sequence.

22. 22 5. Animation techniques (3) ---- Morphing Transformation of objects shapes from one form to another. Morphing method can be applied to any motion or transition involving a change to shape.

23. 23 5. Animation techniques (4) ---- Double buffering Viewer never sees blank screen (unless desired as part of the animation) Viewer does not see construction of scene regardless of complexity of scene. Most graphics systems provide fast methods to swap buffers, so better animation achieved without having to reduce number of frames (i.e. avoids problems of introduction of pause). The technique can be scaled up with multiple buffers for pre- construction of scenes when complex scenes would slow down animation if attempted in real time. Example 5: Explain how double buffering can overcome some of the problems of the draw-clear-redraw methods of animation.

24. 24 6. The 2D & 3D viewing-transformation pipeline Construct World- Coordinate Scene Using Modeling- Coordinate Transformations Convert World- Coordinates to Viewing Coordinates MapViewing Coordinates to Normalized Viewing Coordinates using Window- Viewport Specifications Map Normalized Viewport to Device Coordinates MC DC NVC VC WC

25. 25 7. Visual C++ Methods (1) Example 6: draw a line y = x pDC->MoveTo (10,10); pDC->LineTo(50,50);

26. 26 8. Visual C++ Methods (2) Example 6: Briefly describe each of the following Visual C++ graphics functions from device contents, including the parameters they accept and sketching an example for the application of each function in a program:  MoveTo  Rectangle  Ellipse

27. 27 MoveTo is to move device context to the point, such as pDC->MoveTo (0,0) Rectangle is to draw a rectangle: e.g., pDC->Rectangle(0,0,100,100) Ellipse is to draw a ellipse confined by a rectangle, e.g. CRect tt(0,0,100,100); pDC->Ellipse(tt);

28. 28