Ready Maker Stopwatch
Tutorial
Beginner
45 Mins
Tutorial
Ready Maker Stopwatch
1.
Add a second hand object, name it & make it non-solid

Steps
  1. Add it from ARTWORK tab in the Library
  2. Name it and make it non-solid in the APPEARANCE tab in the INSPECTOR.
  • This will be the object that marks the seconds on your stopwatch.

2.
Add a Sec-Pivot object, name it & make it non-solid

Steps
  1. Add it from the ARTWORK tab in the Library.
  2. Name it and make it non-solid in the APPEARANCE tab in the INSPECTOR.
  • This will be the anchor point in the center that will rotate your second hand.

3.
Give the Sec-Pivot "JOIN" & "ROTATE" Behaviors

Steps
  1. Drag the 2 Behaviors to the objets from the BEHAVIOR tab in the INSPECTOR.
  • These will make the anchor point connect to and rotate the second hand.

4.
Create the "PIVOT CLASS" & Add Your Sec-Pivot Object

Steps
  1. Do this by selecting it, then taping CREATE NEW CLASS in the Bucket icon at the bottom of the INSPECTOR.
  • By making this a class, we can add objects tot his class and they will inherit the same behaviors and appearances. All objects in this class will act and look the same way.

5.
Copy the Sec-Pivot Object & Name it "Mil-Pivot"

Steps
  1. Copy it by taping the copy icon on the object's tooltip.
  2. Name it in the APPEARANCE tab in the INSPECTOR.
  • We will use this one to rotate our millisecond hand.

6.
Add a millisecond hand object, name it & make non-solid

Steps
  1. Add it from the ARTWORK tab in the LIBRARY.
  2. Name it and make it non-solid in the APPEARANCE tab in the INSPECTOR.
  • This will be the object that marks the milliseconds on your stopwatch.

7.
Connect the Sec-Pivot to the second hand object & set rotation

Steps
  1. Select SEC-PIVOT and join it to SECOND HAND from the Behavior tab in the Inspector under JOIN.
  2. Also set the rotation to 1rpm and toggle active to OFF from the Behavior tab in the Inspector.
  3. Change the Direction to CLOCKWISE.
  • Connect the anchor point to the second hand and give the correct rotation.

8.
Connect your MIL-PIVOT to your MILLISECOND hand object

Steps
  1. Select it and join it to MILLISECOND from Behavior tab in INSPECTOR.
  2. Also set the rotation to 60rpm and non active on start from Behavior tab in the Inspector.
  3. Change the Direction to CLOCKWISE.
  • Connect the anchor point to the millisecond hand and give the correct rotation.

9.
Add a Start "TEXT BOX" & Name it START

Steps
  1. Drag it to your canvas from the Interface & Text tab in your Library.
  2. Name it in the Appearance tab in the Inspector.
  • You will use this to start the rotation of your pivot class.

10.
Add a Stop "TEXT BOX" & Name it STOP

Steps
  1. Drag it to your canvas from the Interface & Text tab in your Library.
  2. Name it in the Appearance tab int he Inspector.
  • You will use this to stop the rotation of your pivot class.

11.
Add a Restart "TEXT BOX" & Name it RESTART

Steps
  1. Drag it to your canvas fro the Interface & Tex tab in your Library.
  2. Name it in the Appearance tab in the Inspector.
  • You will use this to restart your stopwatch.

12.
EVENT #1: Start the clock when "START" is touched

Steps
  1. Open the EVENT MANAGER and create NEW EVENT.
  2. Do this by saying " When start is touched rotate the picot class."
  • This starts the rotation of the clock whenever the text "START" is tapped.

13.
EVENT #2: Stop the clock when " STOP" is Touched

Steps
  1. Open EVENT MANAGER and create NEW EVENT.
  2. Do this by saying " When stop is touched, stop the rotation of the pivot class".
  • This stops the rotation of the clock whenever the text "STOP" is tapped.

14.
EVENT #3: Reset the clock when "RESET" is Touched

Steps
  1. Open the EVENT MANAGER and create NEW EVENT.
  2. Do this by saying " When reset is touched, the system should reset."
  • This resets the clock whenever the text "RESTART is tapped"

15.
Set up the watch with a Project Background

Steps
  1. Add a background from the BACKGROUND tab in the Library.
  2. Add a round watch face from the ARTWORK tab in the Library and place it in the Background Layer from the Appearance tab in the inspector.
  3. Position your anchor points in the middle of the watch face, and place your hands so that they are pointing straight up in the center of the anchor points.
  • Create the look of a stopwatch and add your personal style to it.

16.
Add the 12 - 3 - 6 -9 Numbers & position them

Steps
  1. Drag it to your canvas from the Interface & Text tab in your Library.
  2. Lay them out in the correct positions.
  • Numbers serve as guides fro time. Decorate your project with any other ideas that come to mind.