My Codename One form is loading all the parts, then scrolling off the screen to the left, and showing a blank screen in the Simulator

I have added a second form to my app, and it scrolls off the screen to the left in the simulator, leaving a blank form on the screen. In the attached code my call from the splash screen menu is shown first, then my class. I do not see what is flushing my form, as Shai identified what was probably happening with my first form, and I do not know what I did to stop the first form from scrolling off. Does anyone see my error? Thanks.

// Call on Splash Screen
    public boolean openField2() throws IOException {
        Form mbd = new MoveByDrag();
        mbd.show();
       return false;
    }
// New Form
package com.kcconsulting.soccersession.ui;

import com.codename1.components.ScaleImageLabel;
import com.codename1.ui.*;
import com.codename1.ui.layouts.*;
import com.codename1.io.Log;
import java.io.IOException;
import static com.codename1.ui.CN.getCurrentForm;
import static com.codename1.ui.layouts.BoxLayout.Y_AXIS;
import com.codename1.ui.table.TableLayout;

public class MoveByDrag extends Form {
    Form playfield = new Form();
    Container controls = new Container();
    Container field = new Container();
    Image img30;
    public MoveByDrag() throws IOException {
        TableLayout t2 = new TableLayout(2, 1);
        playfield.getToolbar().addMaterialCommandToSideMenu(" Design by Coordinates",
                FontImage.MATERIAL_CHECK, 4, e -> {
                // Rebuild Menu after stopping Scroll to blank screen
                });
        playfield.setLayout(t2);
        field.getAllStyles().setBgImage(Image.createImage("/BlankField.jpg"));
        playfield.add(t2.createConstraint().heightPercentage(10).widthPercentage(100), controls);
        playfield.add(t2.createConstraint().heightPercentage(90).widthPercentage(100), field);
        playfield.show();
    }
    //Build Drag and Drop
/*
    public void drop(Component dragged, int x, int y) {
        int i = playfield.getComponentIndex(dragged);
        if(i > -1) {
            Component dest = playfield.getComponentAt(x, y);
            if(dest != dragged) {
                int destIndex = playfield.getComponentIndex(dest);
                if(destIndex > -1 && destIndex != i) {
 //                   playfield.setComponentIndex(dragged,destIndex);
                }
            }
            playfield.animateLayout(400);
        } else {
            Container oldParent = dragged.getParent();
            if(oldParent != null) {
                oldParent.removeComponent(dragged);
            }
            Component pos = playfield.getComponentAt(x, y);
            i = playfield.getComponentIndex(pos);
            if(i > -1) {
                playfield.addComponent(i, dragged);
            } else {
                playfield.addComponent(dragged);
            }
            playfield.getComponentForm().animateHierarchy(400);
        }
    }
*/

}

Solution

I just tried this variation of your code:

TableLayout t2 = new TableLayout(2, 1);
Form playfield = new Form(t2);
Container controls = new Container();
Container field = new Container();
field.getAllStyles().setBgColor(0xff);
field.getAllStyles().setBgTransparency(0xff);
playfield.add(t2.createConstraint().heightPercentage(10).widthPercentage(100), controls);
playfield.add(t2.createConstraint().heightPercentage(90).widthPercentage(100), field);
playfield.show();

It didn't scroll to the side or have any problem I could see. It should be functionally identical. Can you provide screenshots or a video illustrating what you're seeing?