Lemur grid layout

Hello monkeys!

I am trying to make a menu with a grid of icons (for a ship building menu).

The above picture is me trying to make a 4 column x 3 line grid, but it only adds lines and two of my 9 items are not showing.

The icons are supposed to be 80x80 pixels but they take the size of the tabbed panel.

Here is my code, what can I do to add columns and choose my icon size?

 public static void Init(){
    
    window = new Container();  
    Jme.guiNode().attachChild(window);
    window.setLocalTranslation(0,(int)(Jme.getScreenHeight()/2),0);     
    //window.setPreferredSize(new Vector3f(Jme.getScreenWidth()/4, Jme.getScreenHeight()/2, 0));
    CursorEventControl.addListenersToSpatial(window, new DragHandler());
    window.addChild(new Label("Construction panel"));
    TabbedPanel tabs = window.addChild(new TabbedPanel("glass"));
    
    Container c = new Container();        
    tabs.addTab(ConstShipPart.PartTypes.cockpit, c); 
    addBuildItem(c, ConstShipPart.PartTypes.cockpit, ConstShipPart.Cockpits.SmallCockpit.name);
    
    c = new Container();
    tabs.addTab(ConstShipPart.PartTypes.ceilFloor, c);    
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.Block.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.Corner.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    addBuildItem(c, ConstShipPart.PartTypes.ceilFloor, ConstShipPart.CeilFloors.HalfBlock.name);
    
    c = new Container();
    tabs.addTab(ConstShipPart.PartTypes.structural, c);
    addBuildItem(c, ConstShipPart.PartTypes.structural, ConstShipPart.Structurals.Wall.name);
    addBuildItem(c, ConstShipPart.PartTypes.structural, ConstShipPart.Structurals.HalfWall.name);
    
    c = new Container();
    tabs.addTab(ConstShipPart.PartTypes.engine, c);
    addBuildItem(c, ConstShipPart.PartTypes.engine, ConstShipPart.Engines.SmallEngineShielded.name);
    
    c = new Container();
    tabs.addTab(ConstShipPart.PartTypes.armor, c);
   
    
}  

public static void addBuildItem(Container c, String partType, String partName){        
    int nbElements = 0;
    Object o = c.getUserData("nbe");
    if(o != null)
        nbElements = (int)o;
    System.out.println("Nb elements = "+String.valueOf(nbElements));
    int lin = nbElements/maxCol;
    int col = nbElements%maxCol;
    System.out.println(partName+"  Col: "+String.valueOf(col)+" Line: "+String.valueOf(lin));
    Container frame;
    
    frame = c.addChild(new Container(), lin, col);        
             
    Texture t = Jme.assetManager().loadTexture(ConstShipPart.icon(partType, partName));                
    TbtQuadBackgroundComponent tbt = new TbtQuadBackgroundComponent(new TbtQuad(80, 80), t);
    frame.setBackground(tbt);                
    frame.setPreferredSize(new Vector3f(80,80,0));
    c.addChild(frame);
    c.setName(partName);
    addClickListener(frame, partType, partName);
    nbElements+=1;
    c.setUserData("nbe", nbElements);
}

p.s. I had to add user data to count the number of child containers because the included functions are dividing the real size by 2 (if I add 2 child containers I only get a size of 1 when doing a getChildren().size())

That’s not true. It is true that you are adding the same item twice to the container for every call to addBuildItem()… so maybe that’s messing you up?

So, this line will be fine and will put the container where you want, presuming lin and col are correct.

Then this line completely undoes it, removes the old child and adds it again to the last row.

1 Like

Awh thanks man I’m ashamed I missed that last one. Have a good one!

Glad you got it working. :slight_smile: