Storybook in App Lab with student drawing background

CS Principles Coding and Debugging Help
1

I have student that wants to do a storybook in App Lab. In her book, she’s going to make a function that draws the background/scene of each page using the Turtle commands (similar from Unit 3). She wants to incorporate a Mad Lib style into this storybook but when she creates a new screen “page” and calls her function that draws her background of her book, the turtle won’t draw anything. She’s doing this in an “On Event” function, where on the event she clicks the Next Page button, she’ll set the screen to screen 2 (page 2) and then calls the function she made that draws the scene. In the function that draws the scene, she added a variable to add 1 every time it’s ran and send it to the console.log to see if it’s actually running. The function is in fact running, but nothing is being drawn. If it is being drawn, it’s hidden.

Any ideas?

2

Please share a link to the code, so someone can look at it. Sometimes the speed scroll bar (at the bottom) is too much on the turtle side and the program runs very slowly, making us feel that the program is not running. Did she move the speed scroll bar to the right (towards the hare)?

3

Hi, I’ve uploaded screenshots of the code and what the user sees. I would think that calling the function “drawSquare” would run if called after the screen is set to another screen inside an On Event. The screenshots show what the code looks like when the RUN button is clicked, then when the user clicks the NEXT button, and lastly when the user clicks the LAST button.

Thanks!

50%20AM
50%20AM489×668 43.6 KB

17%20PM
17%20PM336×611 7.54 KB
31%20PM
31%20PM326×609 6.75 KB
37%20PM
37%20PM332×610 8.65 KB

4

Hello,

I totally get what you’re trying to do, unfortunately its a little more complicated than it looks on the surface. While students don’t know it (yet) when working on Unit 3, the turtle is an object within Screen 1 rather than something that works in parallel to the screens. When students are using the turtle, they’re actually drawing with a turtle on a canvas that takes up the whole screen. Its sort of like having a text box that you write to on your first screen. When you move to the second screen there isn’t anything stopping you from using setText(<text_output_id>) on that element, but you won’t be able to see the result until you return to the page that contains the output.

Off the top of my head the easiest solution I can think of is to make it look like you’re switching between screens by having a ‘next’ button which:

  1. Hides the ‘next’ button
  2. Whites out the previous drawing, and draws a new one
  3. Shows the ‘back’ button in the same place

I’ll reach out to the staff and see if they have any other ideas as well.
Madeline