Coding Challenge #4: Purple Rain in Processing


Hello and welcome to today’s coding
challenge Today I’m going to make a purple rain in
Processing in honour of Prince So the only thing I’ve done to prepare so far
is pick 2 colours which were suggested by the Internet; Thank you very much A purple colour for the rain, and some
other colour for the background I am using the Processing programming
environment You can find out what Processing is if you
check the description to download
Processing The code will be written with the Java programming language I’m also going to make a JavaScript
version using something called “p5.js” So if you want to run this example in
the browser or on the web, you can find that version of the code as
well, in the description of this video Ok, let’s get started;
So the first thing that I need to do is just to write a “setup” function, and
write a “draw” function And then I’m going to add the “size”
function My glasses are falling down on my face I’m going to take this wonderful colour
suggested and use this as my background I’ve got an extra parentheses here and
I need a semi-colon I’m going to run this; And look at that,
there we go! So this is the start; This is the scene;
This is where I want my purple rain To make rain, I think a good way to do
that would be to create a single object which is a rain drop; and then from that
object, make an array with many of them I’ll go ahead and make a new tab;
I’m going to call it drop Then I’m going to say “class” drop;
Class being a template for making objects in the Java programming language;
In the JavaScript version this will look like a constructor function;
You’ll see that; This drop is going to have an “x”;
This drop will also have a “y” I need a function for the raindrop to fall And a function for the raindrop to be
rendered on the screen What do I want my drop to look like? Let’s have the drop be a line;
That might look like rain A line; at “x” and “y” To “x” and what? How about “y” plus something right? Something like like “y” plus 10 And then I want that line to be what?
Purple! I’m going to get the purple colour
right here Come back, come back Then in “fall”, I’m going to say “y”
equals to “y” plus “yspeed” ok “yspeed” doesn’t exist, so I’m going to
create that as a variable Now that I’ve made this object, this is
the core idea of the drop object It has an “x” and a “y”, and a “yspeed”
for falling “y” equals “y” plus “yspeed”
for it to fall And then a line to draw it Now the drop needs initial values for
these variables I’m going to have, by default right now a
drop that starts in the middle And have a drop that starts at the top of
the screen Whilst having the speed be equal to 1 Just to make sure things are working Here I’m going to create a variable “drop”
“d” equals new “drop” Then in “draw” I’m going to say
“d” dot “fall” And then “d” dot “show” I think that’s enough code to write
that I should test now I have a “drop” class; All the code for
the “drop” I have the “drop” object;
Let’s run this And let’s see our individual purple
drop There it is! Purple rain there’s the
purple rain! Falling! It’s only 1 drop, clearly what I need to
do is have many drops In order to get many drops I want to have
an array The way I’m going to do that; Is by
changing this to be an array Now look at this; The array syntax is the
kind of thing a drop with the brackets equals a new drop, and I’m going to have
an array with 100 elements of it Instead of making 1 single drop, I loop I think this is maybe the 1 millionth time
I’ve typed that loop in my life I’m going to loop through the entire
length of the array I’m going to say “drops” index “i” is a
new “drop” I’m going to make 100 new drops in that
array And then there should be more dancing!
I’m not going to be good enough to dance But there should be more dancing involved
for this particular example while I’m programming this; I’m going to then go
down to “draw”, and I’m going to say “drops” index “i” dot show; There should
be music playing at least; “drops” index “i” dot “fall”; Doesn’t
really matter what order these are in but I’m going to put “fall” first and now
I’m going to run this There should be 100 drops in the window But there’s still only 1 The reason there’s only 1 is because all
of the drops are in the same exact spot, moving at the
same exact speed I need to randomize them a little; So one thing I can do is give them all a random location Then we can see what happens there Now, look how all my rain is falling down exactly together Another thing I could do then would be to give them some random Y location So why don’t we actually have them starting outside the screen So their random location should be between -200 and -100, so they’re kind of way off the screen And now we can run that and will see this should be a little bit better And now we see that the rain in Spain falls mainly on the plain Now that things are spread out a little more. Subtitles by the Amara.org community

Leave a Reply

Your email address will not be published. Required fields are marked *