actually the Composer clips the shown component contents at the blue border indicating the components area (so-called Canvas Area). Also if the component is larger than the screen in the target device (configured in the attribute ScreenSize), the contents are clipped at this ScreenSize area. From your image I suppose you have resized the GUI component so that it is larger than the screen size. The contents lying outside this area are not visible.
We fully agree that this behavior is confusing the user and we have already planed to redesign and improve the Composer in the next release.
For now, you can try to implement the menu without creating such large GUI component. For this purpose:
Step 1: Create a GUI component containing the header, footer and the Outline Box. This is what you already done as I see in the image.
Step 2: Within the component (or if you plan to create several different menus within another component derived from it) add all the items you want to be displayed. Don't worry about the arrangement of the items. You can place them chaotically one item above the other.
Step 3: Configure the property Embedded of all items to the value true. This is essential to put the items below the management of the Outline Box.
Step 4: Within the Outline Box configure the property Formation to the value Core::Formation.TopToBottom.
Now when you start the Prototyper you see the Outline Box arranges the items automatically one below the other. The order in which the items appear corresponds to the Z-order of the items. Ceating a large GUI component was not necessary in this case.
Does the workaround help you further?