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)• Coming up:
– GUI Presentation #3 & #4 next Monday– Data Binding & Data Views
• Take Home Lab#6
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
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
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
• 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
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.
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();
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);
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.
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.
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.
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.
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.