How can I add a button that opens a pop-up?

Question

I have developed a game with a libGDX game engine. I want to create a button on the game screen and add a popup to this button. How can I do this?

My current code:

public class GameScreen extends BaseScreen implements ShowDictionaryEvent 
{
    private Preview preview;
    public GameController gameController;
    public Dial dial;
    private BoardView boardView;
    public DialAnimationContainer dialAnimationContainer;
    private LevelEndView levelEndView;

    private Rocket rocket;
    private BombDialog bombDialog;
    public AlertDialog bombBlastDialog;


    public ExtraWordsButton extraWordsButton;

    private ImageButton shuffleButton;
    private BoardOverlay boardOverlay;
    private Feedback feedback;


    private DictionaryDialog dictionaryDialog;
    private BonusWordsIncompleteDialog bonusWordsIncompleteDialog;
    private BonusWordsCompleteDialog bonusWordsCompleteDialog;
    public SideComboDisplay sideComboDisplay;

    private Smoke smoke;
    private Ufo ufo;
    public boolean offeredBoosterInThisLevel;
    public int nextBoosterType;
    private Label goldPackBubbleLabel;


    private RemoveAdsDialog removeAdsDialog;
    public Image comboLight;;
    public CameraShaker cameraShaker;

    private DelayAction comboLightDelay;
    private SequenceAction comboLightSequence;
    private RunnableAction comboLightRunnableAction;
    public int tempComboReward;



    public GameScreen(KelimeGame wordConnectGame) {
        super(wordConnectGame);
    }



    @Override
    public void show() {

        super.show();

        setTopPanel();
        topPanel.setY(stage.getHeight());

        topPanel.topComboDisplay.setGameScreen(this);

        dialAnimationContainer = new DialAnimationContainer(KelimeGame.resourceManager);
        dialAnimationContainer.setVisible(false);
        stage.addActor(dialAnimationContainer);

        cameraShaker = new CameraShaker();

        gameController = new GameController();
        gameController.setGameScreen(this);

    }
}

Answer 1

use the Stage class to render ui things

private Stage stage;

@override
public void show() {
   ...
   stage = new Stage();

   // create the button
   final ImageButton shuffleButton = new ImageButton(/*maybe need some params*/);
   shuffleButton.addListener(new ClickListener() {
        @Override
        public boolean touchDown(InputEvent event, float x, float y, int pointer, int button) {
            // BUTTON ACTION
            return true;
        }
    }

   // put button in stage
   stage.addActor(shuffleButton)
   ...

   // Enable inputs for stage
   // if you need to proccess other inputs, you will need create an InputMultiplexer
   Gdx.input.setInputProcessor(stage);
}

in the render method:

@Override
public void render(float delta) {
    Gdx.gl.glClearColor(1, 1, 1, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
    ...
    // draw stage
    stage.act(Gdx.graphics.getDeltaTime());
    stage.draw();
}

If you have a complex layout, use the Table class to make it easily