CST238 Week 6

1. CST238 Week 6 • Questions / Concerns? • Announcements • HW#2 due next Monday (project concept/preliminary design) • Check-off Take Home lab#5 • Comment about Test#1 • New topics • Drawing & Animation • GUI Bloopers presentations (#1&#2) • Coming up: • GUI Presentation #3 & #4 next Monday • Data Binding & Data Views • Take Home Lab#6

2. Drawing • You need the Graphics class from System.Drawing namespace. • Two ways to get a Graphics object • Create a new that’s associated with the form or control • Grab the Graphics object in the Paint event’s PaintEventArgs

3. Drawing • There are 2 types of draw: • Immediate Draw • Not updated after form resize, covered or uncovered. • Redraw • Updated each time a form is updated. • This is done through Paint event. • This event can be triggered using Invalidate

4. Drawing • Two useful properties: • ResizeRedraw= true; • DoubleBuffered= true; //reduce flickering

5. Keyboard Movement • Attach key events to the form to move drawings around. • Keys.Up / Keys.Down / Keys.Left / Keys.Right are 4 common movement keys. x, y

6. Adjust (x,y) with each key movement • Re-paint the image at new (x,y) with each key movement. • Make sure that the drawing has key focus. • Try adding a button x, y

7. Adding Animation • Instead of adjusting (x,y) with key events, how about having it adjusted every timer tick? • Adding a timer. • In Timer’s Tick event, adjust (x,y) accordingly. • Re-paint the image at new (x,y) with timer tick. • Check for boundary conditions so drawing doesn’t go outside the form.

8. Start & Stop Animations • You can start or stop animation by Start or Stop the timer. • Start / Stop can be linked to a key or a button. Timer1.Start(); Timer1.Stop();

9. Image Transparency Bitmap dog = new Bitmap("dexter.bmp"); //file dexter.bmp is in debug directory. //it has blue background dog.MakeTransparent(Color.Blue);Rectangle dogRect = new Rectangle(x, y, 75, 75); g.DrawImage(dog, dogRect);

10. Animation Example

11. Animation: Moving Multiple Objects • Timer triggered animation: • Adjust as many (x, y) with each Tick event. • Make sure DoubleBuffered and ResizeRedraw are set to true; • Re-paint the entire form after each Tick event.

12. Animation: Manual Movement • Sometimes you might want to manually move an object on the screen independent of timer and Paint events. • For example: In a sorting algorithm, instead of just showing result of sort, I want to show elements being swapped.

13. Animation: Manual Movement • Instead of using timer, call System.Threading.Thread.Sleep(ms); • Manually drawing and erasing objects on the screen. • The movement animation is not permanent so it’s not done in Paint event.

14. Form Vs. Panel vs. Picturebox • Setting DoubleBuffered to true on the form will reduce the flickering. • But if drawings are made inside a panel or picturebox, the DoubleBuffered on the form doesn’t take care of it. • You need to create a custom Panel or Picturebox. • Two options: • Draw on the form and have form’s DoubleBuffered take care of it. • Create a derived control and set its DoubleBuffered.

15. Take Home Lab #6 • Draw some objects and show animation. • Allow the user to start and stop animation • Try to experiment with moving more than one object at a time. • Try to do manual animation movement as well as using timer/Paint event. • Reduce flicker when appropriate. • Enable the user to resize the form and redraw accordingly.