Introduction to Diagrams
-
Description
The diagram is a very useful tool for coding. You can use diagrams for charting, drawing, brainstorming, or making other types of documents.
Adding a Diagram
You can add one diagram to each sprite. If you need multiple diagrams in a project, you can simply use multiple sprites.
As shown, when you switch to the “Diagram” tab the first time, you will see a button that says “Initialize Diagram”. Clicking that button will get you an empty diagram in a few seconds.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/5c378271-0846-466f-bf3c-59d15a56d3ae.gif" width="800" style="border-radius: 5px; border: 1px solid #29622d;">
After this step, it will be very easy to switch between the code and the diagram.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/c47f6abd-33f9-42f3-8291-43427f96a721.gif" width="800" style="border-radius: 5px; border: 1px solid #29622d;">
Auto-Saving
Every change you make on the board will be automatically saved. You do not need to do anything. When you reload the page, the latest content will be loaded:
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/0901b795-6df6-47f6-91ba-690f316f9b41.gif" width="800" style="border-radius: 5px; border: 1px solid #29622d;">
Sharing the Diagram
When your project is private, then others can not see the diagrams inside it.
When a project is shared, the diagrams in it will be visible by others. However, they will not be able to change it in any way. For example, in this demo, the owner user is on the left, and a guest user is on the right.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/99357225-b311-45c2-8bb5-5cc6d4ead8f0.gif" width="1000" style="border-radius: 5px; border: 1px solid #29622d;">
If you toggle the status button from “closed” to “open”, then others can make changes the same way as the project owner. This way, multiple users can work together on one board. Note that the guest users would need to reload the project to get the updated permission.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/c80902ac-f6eb-49f8-bfe7-288ffddeba3c.gif" width="1000" style="border-radius: 5px; border: 1px solid #29622d;">
Templates
When you click the template button
on the left toolbar, a library window of templates will pop out. You can quickly browser different types of diagrams, and click any of the templates to get started.https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/49c3b27a-27d7-49bc-b184-8a63b242a100.gif" width="900" style="border-radius: 5px; border: 1px solid #29622d;">
Zooming In/Out
You can easily zoom in or out using the scroll wheel on your mouse. If you do not have a scroll wheel, you can also click the “-” and “+” buttons on the bottom right.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/7a6cf2f6-fc70-4d07-bc66-f0f9f3dd3281.gif" width="900" style="border-radius: 5px; border: 1px solid #29622d;">
Selecting Objects
You can select an object by clicking on it using the left mouse button. You can drag the selected object to a different position. If you click on that selected object again, you will be able to type into it.
You can also click on the empty space, then drag the left mouse button to select many objects in a rectangle region. Click on the empty space again to deselect them.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/f6e26e34-24b9-48dc-83a0-1c0efd154115.gif" width="900" style="border-radius: 5px; border: 1px solid #29622d;">
You can also press down the CTRL key and then the A key, which will select all objects on the board.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/5785946c-0c79-4525-b6c0-a822a5c8430d.gif" width="900" style="border-radius: 5px; border: 1px solid #29622d;">
Deleting Objects
When one or multiple objects are selected, you can press the “DELETE” key on your keyboard to delete them. Alternatively, you can right click on that object, then select “delete” on the menu.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/b08b17e5-727c-4a83-840f-0f7fd9bdaaf5.gif" width="800" style="border-radius: 5px; border: 1px solid #29622d;">
Shifting the Entire Board
To view different parts of the diagram, you can drag the board using the right mouse button. If no object is selected, you can also use the 4 arrow keys on the keyboard to shift the board.
https://cdncreaticodecom.b-cdn.net/scratch-gui-projects/forum/4c8e3ede-96e4-4407-844e-003339ca601a.gif" width="800" style="border-radius: 5px; border: 1px solid #29622d;">
-
I CreatiCode pinned this topic on
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login