CS 2302, Fall 2014
Graphics Concepts
Drawing Paths
12/3/2014
2
Random Diamonds

Create a method that will draw a random
diamond




The method will get a Canvas
The class will have a static random number
generator defined
The center and width and height of the diamond
will be randomly computed
The fill and outline colors will be randomly
chosen

12/3/2014
The color value will be in a specified range
3
Random Coordinates


The width and height of the View used for
drawing can be obtained with getWidth() and
getHeight(), repsectively
The width times a random float (in the range 0
to 1) will give the x coordinate of the center

The y coordinate is similar, but uses the height

To determine the diamond's width


12/3/2014

Compute the distance of the center from the left
and right edges
Multiply the minimum by a float and then by 2
The diamond' height is similar
4
Random Colors

Using RGB to pick random colors does not give
very good colors

Using HSV to pick colors gives better results

The Value will be in the range from .25 to .75


Specified in the diamonds resource file
The Hue and saturation will be randomly
chosen over their entire range
12/3/2014
5
Many Random Diamonds


Modify the diamond view to draw many
diamonds at random
The number of diamonds is another resource
12/3/2014
6
Interactive Diamonds View




This is the same as the basic diamond view
except that every time the view is clicked, the
number of diamonds is reduced by 1
The view will contain a listener registered to
'this'
Once the number of diamonds has been
reduced, the view must be redrawn
Note that, right now, clicking the view causes no
visible change
Write a message to the log file (visible in the
7
logcat view) to show that the listener is actually

12/3/2014
Interactive Diamonds View


This is the same as the basic diamond view
except that every time the view is clicked, the
number of diamonds is reduced by 1
Copy the diamond view class and use the new
class as a component

Define an onClick listener

Register the listener to 'this'

The Listener will reduce the number of
diamonds
Note that, right now, clicking the view causes no8
12/3/2014

Forcing Redrawing



There is an internal change but not a visible
change
The onDraw method must be executed
somehow
However, we don't have a Canvas, necessary
to call onDraw

There's no good way to create a useful one either

The system must call onDraw

So, we ask the system to call onDraw for us
12/3/2014

This is what the method 'invalidate' does
9
Redrawing Restarts



Notice that the collection of diamonds displayed
changes each time the number is reduced
To keep the same set of diamonds, the
diamonds have to be stored so that they can be
redrawn as they were
This requires

Keeping a list of diamonds

Representing diamonds
12/3/2014
10
Representing Diamonds

Create a class that holds the essential values

Colors: fill and outline

Coordinates: left, top, right, bottom

This will be a private class inside the View so

The instance variables will be final and public

A constructor will set the instance variables
12/3/2014
11
List of Diamonds

Create a list of Diamond objects in the View


The list will be initially null
Create a method to initialize the list to a random
list of diamonds

12/3/2014
Scavenge the code used to draw random diamonds
12
When to Initialize

Setting up the list is tricky



The constructor for the View is too soon since the
dimensions of the View are not known then
The onDraw method can initialize the list, but
should only do it once
OnDraw checks if the list is null and initializes
the list if it is null
12/3/2014
13
Drawing a Diamond


Modify the drawDiamond method to take a
Diamond object instead of the separate
parameters
Change the references in the body
12/3/2014
14
OnDraw Changes

Change onDraw to


12/3/2014
Check if the list of Diamond objects should be
initialzied
Draw the list
15
Change Listener

The listener will remove a Diamond from the list

Check if the list is empty before doing that!
12/3/2014
16