Table not showing Image

Question

Oh well... after almost one day trying to figure it out, couldn't find it so... here it is. I'm using scene2d.

My problem is this one, I have a class named "Tile" that extends the Image class (that extends widget) and has a texture in it of size 128x128, but when I try to add it into a table (Widget Group), my Tile disappears.

Edit: I just made a size check on the table and verified that after adding a Tile, which is 128x128 in size, inside the table, the table is showing itself with a size of 0x0... something wrong here maybe?

I already tried:

• Using addActor() instead of add(), and the Tile shows perfectly, but can't use the table the way i need...
• Adding other actors with add(), and they show up.
• Adding the Tile in the middle of other actors, and what happens is that the Tile doesn't appear at all, not even as an empty space (that would happen if you add a null object to a table).
• Seeing if there is something wrong with the Preferred size of the Tile, which is all right and happily being 128x128.

OBS: One thing that i strangely observed is that when i try to use setDrawable() in my Tile constructor (making the appropriate conversions of Texture->TextureRegion->TextureRegionDrawable), i can't have it drawn by any means, i just can make it get my texture by calling super(Texture) at the constructor, and observing the Image(Drawable) constructor, i happen to notice it does some other things when setting the drawable for the first time, BUT JUST FOR THE FIRST TIME... AND... even using super(Texture), it doesn't show when adding to a cell into a table... Maybe the problem is here? I don't know...

My questions are:

• What is the problem?
• If understanding the problem isn't enough to solve it, what can i do?

Edit2: As requested, here is the relevant code:

public class Tile extends Image{

// Tiles
private Texture unselected;
private Texture selected;

// InputListener for detecting mouse over
private class MouseOver extends InputListener{

    public void enter(InputEvent event, float x, float y, int pointer, Actor fromActor) {
        setDrawable(new TextureRegionDrawable(new TextureRegion(selected)));
    }
}
private class MouseOut extends InputListener{

    public void exit(InputEvent event, float x, float y, int pointer, Actor fromActor) {
        setDrawable(new TextureRegionDrawable(new TextureRegion(unselected)));
    }
}

public Tile(){
    super(TextureFactory.unselectedTile());
    unselected = TextureFactory.unselectedTile();
    selected = TextureFactory.selectedTile();
    this.addListener(new MouseOver());
    this.addListener(new MouseOut());
}
}

The Tile has a listener that when i mouse it over it changes its texture. I removed those listeners for testing and the error was still occurring, so... not them.

The Screen that implements the Tile (Some things are commented because i was expecting to use it like that...)

public class CombatScreen extends AbstractScreen{

private Table board;

public CombatScreen(SpaceGameMain game, int boardSize) {
    // Passing game to super class and getting class name for tracking
    super(game);
    this.className = this.getClass().getSimpleName();

    // Creating tile board
    board = new Table();
    /*
    for(int i = 0; i < boardSize; i++)
    {
        for(int j = 0; j < boardSize; j++){
            board.add(new Tile());
        }
        board.row();
    }
    */
}

@Override
public void show(){
    super.show();
    board.add(new Tile());
    mainStage.addActor(board);
}

public void resize(int width, int height){
    super.resize(width, height);

    board.setPosition((Gdx.graphics.getWidth() - Tile.width)/2, (Gdx.graphics.getHeight() - Tile.height)/2);
}
}

The Table is set to the middle of the screen for testing.

Answer 1

Found the solution with the help of Tanmay and NateS from badlogic's forum, they guided me to see further about TableLayout.

What happens is that the original size of the children, in this case, doesn't affect the "board" layout. What you need to do is to use TableLayout to set the SIZE (not the prefSize) of the children, so the working code goes like this:

board.add(new Tile()).size(128, 128);

Just that, some simple misunderstanding on how to use Tables.

Thank you all.

Answer 2

The Table class when used add method, calls getPrefWidth() and getPrefHeight() when laying out children.

Their default value is 0.

Solution 1) Override getPrefWidth() and getPrefHeight() in Tile class and make them return whatever you want.

Solution 2) Chain table add method with prefSize. e.g.

table.add(actor).prefSize(200,200);

Answer 3

In addition to that, if the above answers didn't work for others (like me), calling image.setScaling(Scaling.none) or image.setScaling(Scaling.fit) might be the fix as well.