Blocks Editing Tip: Arranging and collapsing blocks in the editor
As you develop your App Inventor program using the Blocks editor, do you find your blocks overlapping and crashing in to one another on the screen? You know, like this:
You can drag the blocks on the screen so they no longer overlap, but dragging each block is tedious (time consuming). But there is an easy way to automatically re-arrange the blocks.
- Move the mouse pointer to any part of the white space outside the blocks
- On Windows, right-click the mouse button
- On Mac OS X, press Ctrl and click the mouse button
A pop up menu appears with several options to automatically arrange the blocks:
The first option “collapses” each block into a single line:
You can right-click again and choose Expand Blocks – or you can right click on individual collapsed blocks to display a pop up menu and an option to expand only the selected block. (You can also right click on a block and collapse individual blocks of code.)
To arrange the blocks into a vertical order, select the Arrange Blocks Vertically option. The block are then arranged into a vertical column up to the maximum number that fit on the screen in your browser window. If there are more blocks (and there always are more blocks!), the additional blocks will appear in vertical columns to the right. You may have to use the scroll bars to see where the blocks were relocated!
Arrange Blocks Horizontally places the block groups across the screen:
This tip may make your programming more productive – now, whenever your blocks get too crowded on the screen, let App Inventor’s Blocks editor automatically re-arrange the blocks for you.
(The example code is meaningless – do not try to use this code. This code is an old experiment on Bluetooth – a new and expanded version of this will be published here soon.)
You can use the “zoom” feature of your browser to zoom in and out of the viewing area in the Blocks editor – this feature enables you to view more blocks on the screen at the same time!
On Chrome, (shown here from Mac OS X), select Zoom out to display more blocks on the screen.
Firefox (on Mac OS X) – use the View menu and then the Zoom option: