Navigation

    CreatiCode Scratch Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • CreatiCode

    2D Physics - Water Simulator (Difficulty: 3)

    Tutorials
    1
    1
    1437
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • info-creaticode
      CreatiCode last edited by admin

      Introduction

      In this tutorial, you will use the 2D physics engine to build an interesting animation: simulating water in a bucket.

      bu5.gif

       
       

      Step 1 - Initialize the 2D Physics World

      Please create a new project on the CreatiCode platform, and delete the dog sprite. In the empty sprite, add the following blocks to initialize a 2D physics world.

      03204fc3-b334-4ad1-a7d2-c4e2cca7326d-image.png

       
      The physics world is not visible to us, and it is managed by the 2D physics engine. We can not use any other blocks in the “2D Physics” category without this step.

      In this program, we are setting a gravity in the Y direction for -100. Since the number is negative, it means objects will be pulled down along the Y direction.

       
       

      Step 2 - Add a Ball Costume

      We will use small balls to represent water drops. Please switch to the costume tab and add the “Ball-b” costume:

      ebd799f5-284c-4665-ace0-8dbd8a319901-image.png

       
      Please also make the sprite smaller by setting its size to 30%:

      88dd569e-db3b-47e0-a623-026825e0b974-image.png

       
       

      Step 3 - Make the Ball Follow the Mouse

      Next, let’s make the ball move to right above our mouse pointer’s position whenever we press down the mouse. We can use a forever loop that checks if the mouse button is down repeatedly, and whenever that’s true, we move the ball sprite to the mouse’s X position and 10 plus the mouse’s Y position. We are adding 10 to the Y position to make sure the ball does not go right under the mouse pointer, which would switch it to the “dragging” mode.

      6051943d-a046-4689-ac92-d623945b8f8a-image.png

       
      The ball should follow your mouse whenever you press down and drag the mouse button:

      d1.gif

       
       

      Step 4 - Create Clones

      We will use many clones of the ball sprite to represent small water drops. We can keep creating new clones after moving the ball:

      da5017b1-7caf-49f2-92e6-610ea5ae0e16-image.png

       
      Now we are “drawing” a trail with the clones of the ball:

      d3.gif

       
       

      Step 5 - Add Physics Bodies to Each Clone

      Now we are going to hand over these clones to the physics engine, which will help us make the balls behave like real balls. Whenever a new clone is created, we will use the “behave as” block to convert the clone to a circle-shape object:

      060e0c3a-866e-4141-9672-4a93e986d4ef-image.png

       
      Now our clones become “alive”: the physics engine will make them fall due to gravity, and also collide with each other.

      d4.gif

       
       

      Step 6 - Hide the Original Sprite

      Since we only use clones of this ball sprite to represent water drops, the original sprite is left on the stage at a fixed position:

      a42708ad-a12f-4f80-b18a-55c267746d69-image.png

      We can hide the original sprite using the “hide” block, and then “show” the clones after they are created:

      a73edb8d-22a4-4372-99bd-0ea376c2d1d6-image.png

       
       

      Step 7 - Draw the Bucket Sprite

      Next, let’s create a bucket to hold these “water drops”. Create a new empty sprite named “Bucket”, and draw a bucket using 3 boxes like this:

      bu.gif

       
      Note that at the end you need to select all boxes, and shift their center to the center of the canvas.

       
       

      Step 8 - Send a Message to Create the Bucket

      To start the program in the bucket sprite, we should send a message from the “Empty1” sprite. This makes sure we create the bucket AFTER the physics world has been initialized.

      In the “Empty1” sprite, broadcast the “add bucket” message:

      aa8b319b-f017-435a-9db6-3a661caf211e-image.png

       
      Then in the “Bucket” sprite, receive the message:

      29a9e4b5-ae3b-44cf-b809-c2fc32ff6552-image.png

       
       

      Step 9 - Move the Bucket to the Center

      In the Bucket sprite, let’s first reset the position and direction of this sprite:

      d7e25616-57c1-4909-a327-d462db4959e1-image.png

       
       

      Step 10 - Add a Physics Body to the Bucket

      Next, we’ll tell the physics engine how we want the bucket to behave in the physics simulation. The bucket is a “concave” shape, since its top edge curves into itself. Therefore, we need to use a compound shape to represent it:

      badf62db-ca34-4147-8bbe-65a03952e4fc-image.png

       
      We will set the bucket to be a “movable” object. This is because we don’t need the bucket to fall due to gravity, so it does not need to be “dynamic”. But we do want to rotate it ourselves, so it should not be “fixed” either.

      Since we set the “debug” parameter to “Yes”, we can see the actual shape created by the physics engine, which is composed of 3 red boxes. This is exactly what we need, so we can set the “debug” parameter back to “No” to hide these red boxes.

      8c500417-5c98-4a49-8aa7-c97586c5bad9-image.png

       
      At this point, our bucket should be able to hold some “water” now:

      bu1.gif

       
       

      Step 12 - Make the Bucket Rotate

      Lastly, to make the animation more interesting, let’s make the bucket rotate around itself.

      33bcac4a-781a-4595-ab6f-1866d1843dab-image.png

       
      Here is the final result:

      bu5.gif

       
       

      Creative Ideas

      Please try to create some new animations based on what you learned in this tutorial. Here are some ideas for you to try out:

      • Colored Balls: You can add multiple ball costumes with different colors, and switch the ball’s costume before creating new clones.

      • Different Bucket Shapes: You can draw some different shapes for the bucket.

      • Make the Bucket Sway Left and Right: Currently the bucket only rotates one way. You can try to make it “sway” side to side, so it does not lose the water drops.

      • Update Physics Properties: Try to change the gravity in the physics world and the friction/restitution of the objects. Observe and explain the differences they make.

      1 Reply Last reply Reply Quote 0
      • Pinned by  info-creaticode info-creaticode 
      • First post
        Last post