Mixing Colors

1
Mixing Colors

• Arif Zaman
• CS 101

2
Mixing Operation

• A number line can be likened to a road.
• City A is located at mile 7
• City B is at mile 34
• A car travels from A to B
• Where is the car when it is half-way? (734)/2.
• Where is it when it is 1/4th of the way to B?
• The answer is not (734)/4.

• Correct answer is7 (1/4) (34 7)which can
  better be written as(3/4) 7 (1/4) 34
• In general when the car is proportion p of the
  way from A to B, its location is(1 p) A p B
• This is a mixture of A and B, with proportions
  p and (1 p).

3
We did line programs before

• We have written programs like
• Private Sub Form_Load()
• For x 0 To 10000 Step 1000
• Line (0, x)-(10000 - x, 0)
• Next x
• End Sub

4
Extend to Angled lines

• Two lines, AB and CD.
• Connect A to C.
• Connect B to D.
• Also connect intermediate points as shown on
  right.
• We can compute intermediate points using the
  mixing ideas.

A
D
B
C
5
Bottom up program

• Private Function Mix(a, b, p)
• Mix (1 - p) a p b
• End Function
• Note that p must be between 0 and 1.
• Note that (1-p) comes first, see first slide.

• This is a FUNCTION because it computes a number
  as an answer.
• Mix(a,b,p) is a number between a and b (if p is
  between 0 and 1).
• When p0 the answer is a, when p1 the answer is
  b, and in between the answer is in between.

6
Web Subroutine

• Private Sub Web(n, _
• xa, ya, xb, yb, _
• xc, yc, xd, yd)
• For p 0 To n
• X1 Mix(xa, xb, p / n)
• Y1 Mix(ya, yb, p / n)
• X2 Mix(xc, xd, p / n)
• Y2 Mix(yc, yd, p / n)
• Line (X1, Y1)-(X2, Y2)
• Next p
• End Sub

• (xa,ya) and (xb,yb) are coordinates of A and B
• Note that (X1,Y1) is a point between A and B that
  is p/n of the way toward B.
• Similarly (X2,Y2) is between C and D.
• These points need to be connected by a line.
• There will be a total of n1 lines drawn.

7
With Web and Mix defined

• Private Sub Form_Load()
• Web 10, _
• 2000, 8000, 1000, 1000, _
• 6000, 4000, 3000, 8000
• End Sub
• This will draw the picture that we were trying
  for.
• Note the advantage of the sub is that it is easy
  to draw many more if we like.
• Similarly easy to change the number of lines
  drawn, so that.

8
100 lines is smoother

• Private Sub Form_Load()
• Web 100, _
• 2000, 8000, 1000, 1000, _
• 6000, 4000, 3000, 8000
• End Sub
• Now let us continue the same idea of mixing by
  mixing colors as well. Start of with a red line,
  but end with a blue line. In the middle mix red
  slowly into blue.

9
Mixing Colors

• In visual basic we know about colors such as
  vbRed, vbBlue, but we can create our own colors.
• RGB(255,255,255) is white
• RGB(0,0,0) is black
• RGB(255,0,0) is red
• RGB(0,255,0) is green
• RGB(0,0,255) is blue
• RGB(100,100,100) is gray
• and you can make your own mixtures as you please

• Given two colorsRGB(r1,g1,b1) andRGB(r2,g2,b2)
  we can make a mixture of the two, by mixing each
  of the colors
• RGB(Mix(r1, r2, p), _ Mix(g1, g2, p), _ Mix(b1,
  b2, p) )
• If p0 it will be the first color.
• if p1 it will be the 2nd color.
• With values of p between 0 and 1, it will create
  intermediate colors

10
New Web Sub

• Private Sub Web(n, _
• r1, g1, b1, r2, g2, b2, _
• xa, ya, xb, yb, xc, yc, xd, yd)
• For p 0 To n
• X1 Mix(xa, xb, p / n)
• Y1 Mix(ya, yb, p / n)
• X2 Mix(xc, xd, p / n)
• Y2 Mix(yc, yd, p / n)
• r Mix(r1, r2, p / n)
• g Mix(g1, g2, p / n)
• b Mix(b1, b2, p / n)
• Line (X1, Y1)-(X2, Y2), _
• RGB(r, g, b)
• Next p
• End Sub

• Now the sub needs the color of the first line and
  the color of the last line drawn as arguments, so
  the form load has to be changed as well to
• Private Sub Form_Load()
• Web 100, _
• 255, 0, 0, 0, 0, 255, _
• 2000, 8000, 1000, 1000, _
• 6000, 4000, 3000, 8000
• End Sub

11
The result of this is

• Note that it is nice looking but it has 100
  lines, and yet still doesnt look continuous
  and has Moire patterns.

12
A Smooth picture

• We can cut out the Moire patterns and make the
  picture look nicer by adding lots of lines, but
  it is easier to simply increase the line
  thickness. SettingForm1.drawwidth10is more
  than enough to get the following picture

13
Making Random Webs

• The Web subroutine is very flexible, allowing for
  any number of lines, and starting and ending
  color, and any four points.
• But it is a pain to set all these, so we can
  randomly fill them

• Private Sub Form_Load()
• RandomWeb
• End Sub
• Private Sub RandomWeb
• r1 Rnd 255 r2 Rnd 255
• g1 Rnd 255 g2 Rnd 255
• b1 Rnd 255 b2 Rnd 255
• xa Rnd 10000 ya Rnd 10000
• xb Rnd 10000 yb Rnd 10000
• xc Rnd 10000 yc Rnd 10000
• xd Rnd 10000 yd Rnd 10000
• Web 50, _
• r1, g1, b1, r2, g2, b2, _
• xa, ya, xb, yb, xc, yc, xd, yd
• End Sub

14
A Random Web result.

• Running the previous code results in the
  following figure.

15
Many Random Webs

• Simply by putting a loop in the form load, we can
  get many more of them
• Private Sub Form_Load()
• For k 1 To 1000
• RandomWeb
• Next k
• End Sub

16
Timer

• You could draw random webs with a timer delay,
  and do many more creative things with these webs.
• Note that there is really just one basic idea of
  Mixing that we have used over and over again in
  all this.
• Note how Subs and Functions make our job a lot
  easier, and our program a lot more readable.

17
A student program

• This is a 314 line program, which could have been
  a lot smaller by using subs that we now have
  learnt.