Allow multi-line wrapping of bubbles, at least when editing a block

Current situation

When blocks’ input bubbles go off-screen, because they are on a single line, you can see only part of the block at any one time.

E.g. this is all in one block:

This means that you usually have to keep the rest of your line in your memory whenever editing the bubbles.

Mock Design

If a block’s bubbles could wrap across more than one line, then you could view the whole thing at once. I made a rough mock-up here:

(The bubble would span the whole width of the block — I just did a rough example to make it aligned.)

This would make it a lot easier to work on maths expressions and understand others’ projects.

T(here are cases where the bubble might end on one line, start on the next line but not be long enough to touch itself on the previous line. I’m not sure how to handle how that case would look, yet, but I’ll post a design if I think there would be a clear way to present that.)

When wrapping would occur

I was thinking about the advantage of everything being more condensed, if you have blocks remain single-lined (and scrollable off-screen to the right), while browsing through a project.
So while I’m unsure about the decision around having the multi-line wrapping as a default, or a toggle, an option could be to have multi-line wrapping at least whenever you’re editing that block. And when you’re not editing that particular block (I.e. you don’t have it selected), it would revert to the single line.

Functionally, the bubbles would all work the same i.e. you can cut, copy & paste, and you can add more math bubbles by tapping a new bubble on the keyboard.


Long time noo see!
This would be soo good as I’ve ran into this problem hundreds of time but could be real tricky too add :sweat_smile:

Also how have you been! ( Please Respond in Y-Taco if you have time in order too avoid cluttering)


+1! This would be great to see on iPhone too, as this would be a much more convenient format to read and adjust than by scrolling through math.


Yeah, iPhone coding in general tends to be cluttered and hard to read (for example, nested If’s).

Great idea @t1_hopscotch !


Honestly i think if it were to be added, it should be off by default. i’m way too used to the current UI of hopscotch and if it changed like this, it should be off by default, in order not to confuse hopscotchers who have used this current UI for years


Good! I would like to see this added! I have so much trouble trying to figure out where did I put my bubbles lol


Nice to see you - and yes, please, wee really needs this haha


This is a good idea, but wouldn’t it just make your code longer? Say you had to scroll a while to get to a block of code, wouldn’t this take longer? Since now, 1 block takes up more space than before.


yea please!!! as someone that has to code regularly on a relatively small phone, it’s absolutely impossible to fully see what im doing, even if thats just a set position block (any original object variable takes up atleast 3/4 of the screen so scrolling is inevitable), and i cant tell you how many times ive accidentally deleted said thing in that process with no way to undo it.

id like to see this become a priority bug fix (auto-enable depending on device size???) after the current features are pushed out


it would but thatd be vertical scrolling as opposed to the “help!! i cant see what im tryna work on ;-;” horizontal scroll.
thisd also be for when you’re editing your project and not scrolling through someone else’s code. also would likely be a toggle-able option


It also will become easier to code when they make local variables, so we can split up long expressions across multiple lines anyway.

But this is a really good idea


Yes, we need this!
It’d make editing much easier and much faster.
I honestly don’t know why this hasn’t been suggested before.


Nice suggestion, @t1_hopscotch!

I haven’t seen you on hopscotch for a while and welcome back!


Yeah I was thinking about that, so I thought of this option:

And when you’re not editing that particular block (I.e. you don’t have it selected), it would revert to the single line (I’ll add that in to make it clear)


Makes much more sense lol and welcome back :]


VERY USEFULL lol I’ve never seen you actually active on the forum


Considering all the amazingly complex math expressions that show up in some HS projects, I think making them more legible this way would be a big win. I don’t think that forcing HSers to basically peer though a tiny hole while scanning over a large expression, and thereby have to build up a complete mental representation of the expression in order to do anything with it, is useful preparation for any other kind of coding (same goes for coding without a working undo button!). In any other language you can add line breaks to make long lines more legible.


Great idea!