[LibGDX] Scene 2d Buttons click detection offcentered.

         I have created some buttons in LibGDX and drew them on the screen, but the detection for the mouse clicks is off-centered on them. The mouse click seems to register halfway above the the button, and another half past it. Here's a diagram of what I believe is happening.

So how would I go about fixing this?

*Edit
Oops, forgot to put code.

package com.sael.logic;

import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureAtlas;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.scenes.scene2d.ui.TextButton;
import com.badlogic.gdx.scenes.scene2d.ui.TextButton.TextButtonStyle;

public class MenuScreen implements Screen {

		private Texture MainMenuTexture;
		private SpriteBatch batch;
		private Stage stage;
		private TextButton buttonPlay, buttonStore;
		private TextureAtlas buttonAtlas;
		private BitmapFont font;
		private Skin skin;
		private TextButtonStyle style;
		
	@Override
	public void render(float delta) {
		batch.begin();
		batch.draw(MainMenuTexture, 0, 0);
		batch.end();
	
			stage.act();
			stage.draw();
		
	}

	@Override
	public void resize(int width, int height) {
		
		
	}

	@Override
	public void show() {
		MainMenuTexture = new Texture(Gdx.files.internal("data/Graphics/MainMenuBack.png"));
		batch = new SpriteBatch();
		stage = new Stage(480, 800, true);
		font = new BitmapFont();
		skin = new Skin();
		buttonAtlas = new TextureAtlas(Gdx.files.internal("data/Graphics/Buttons.atlas"));
		Gdx.input.setInputProcessor(stage);
		
		
		skin.addRegions(buttonAtlas);
		style = new TextButtonStyle();
		style.font = font;
		style.up = skin.getDrawable("Button_Up");
		style.down = skin.getDrawable("Button_Down");
		
		buttonPlay = new TextButton("PLAY", style);
		buttonPlay.setPosition(480 /2 - 200 /2, 400);
		buttonPlay.setWidth(200);
		buttonPlay.setHeight(60);
		
		buttonStore = new TextButton("STORE", style);
		buttonStore.setPosition(480  / 2 - 200/2, 300);
		buttonStore.setWidth(200);
		buttonStore.setHeight(60);
		
		stage.addActor(buttonPlay);
		stage.addActor(buttonStore);
	}

Hi MrPork,

The problem might be that the ui components do not actually set their own size or position, these are set by the parent container that they are added to (in your case by the stage). To see if that is the problem, try removing the set position (and maybe the set size too) which you are doing directly on the buttons and see if the click detection works correctly.

If that fixes the problem, then you should try using Tables to layout your ui components instead of adding them directly to the stage. Here is a great tutorial from the LibGDX wiki that goes into great detail on how to do this:

One more thing you may also need to do is set the viewport when resizing the window as this can also mess up the click detection. I recently had this problem and I found a thread on stackoverflow which helped me get it working:

    Thank you very much! Having tables is just what I needed to make it work!  ;D ;D ;D