CODEWITHSUNDEEP
layoutlibgdx
Alex K
Alex K

Reputation: 5212

How can I add button to top right corner of a Dialog In libgdx?

I want to add close button to top right corner of a dialog box.

I tried using setbounds with addactor and just add and setposition with setsize and addactor, but nothing works. I know that dialog works with table layout, it has a table for content and for buttons. I don't want to use this layout and put the button outside this layout like on the border of the dialog.

How can I do it?

This is how it should be:

enter image description here

Upvotes: 3

Views: 2302

Answers (4)

Tony Immanuvel
Tony Immanuvel

Reputation: 36

Can you prepare the dialogbox background with extra spaces with alpha 0 so that, the top corner is actually the centre point of your exit button..

Upvotes: 0

Dávid Tóth
Dávid Tóth

Reputation: 3235

I had a similar problem. After a bit of searching this thread helped me.

Basically to tell the alignment of the actors inside a table, and to tell the alignment of the table itself are two separate things. Setting the alignment of the table top top-left would produce the desired behavior. 

        table = new Table();
        table.setFillParent(true);
        table.setSkin(usedSkin);
        table.setDebug(true);
        table.top().left();

        stage.addActor(table);
        table.add(exitBtn);

Upvotes: 0

Retron
Retron

Reputation: 129

Do this:

private Stage stage;
private Window window; 
private Table table; 
@Override 
public void show() { 
      table = new Table(); 
      table.setSize(Gdx.graphics.getWidth() / 2 
      , Gdx.graphics.getHeight() / 5); 
      window = new Window("", skin); 
      window.setSize(table.getWidth(), table.getHeight()); 

      Button btnWindow = new Button(skin, "close"); 
      btnWindow.addListener(new ClickListener() { 
      @Override 
      public void clicked(InputEvent event, float x, float y) { 
             window.setVisible(false); 
         } 
      }); 
      window.addActor(btnWindow); 
      btnWindow.setSize(50, 50); 
      btnWindow.setPosition(window.getWidth() - btnWindow.getWidth() 
      , window.getHeight() - btnWindow.getHeight()); 

      table.addActor(window); 

      window.setModal(true); 
      table.setPosition(Gdx.graphics.getWidth() / 2 - window.getWidth() / 2 
                    , Gdx.graphics.getHeight() / 2 - window.getHeight() / 2 + 
     100); 
            window.addAction(Actions.sequence(Actions.alpha(0) 
                    , Actions.fadeIn(.1f) 
                    , Actions.moveTo(+50, +50, 1))); 
     stage.addActor(table); 
     }

Upvotes: 0

noone
noone

Reputation: 19776

The easiest solution I could come up with now, is to use negative padding for your button to move it "outside" of it's cell.

Button closeButton = new TextButton("X", skin, "default");
getTitleTable().add(closeButton).size(60, 40).padRight(-30).padTop(-20);

With this padding hack you have the problem, that the button will be outside of your Dialog, and by default, Window checks the bounds of your window when it performs Actor.hit(...) evaluation.

We need to disable clipping for that reason, but the rendering of the window depends on it. That's why we use another hack to enable it, just for the rendering:

@Override
public void draw(Batch batch, float parentAlpha) {
    setClip(true);
    super.draw(batch, parentAlpha);
    setClip(false);
}

Upvotes: 3

Related Questions