'How to not resize but move widgets when screen resized?

I have added buttons to my code, but when I go to "resize", they get bigger or wider and it looks very bad. How can I resize the window and keep the button aspect ratio?

This is my code:

1)Main:

`package com.mygdx.game;

import com.badlogic.gdx.Game;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;

import com.mygdx.game.screen.MainMenuScreen;

public class gamename extends Game {

    public static final int WIDTH = 760;
    public static final int HEIGHT = 520;
    
    public SpriteBatch batch;

    @Override
    public void create() {  
        batch = new SpriteBatch();
        this.setScreen(new MainMenuScreen(this)); 
    }
    
    @Override
    public void render(){  
        super.render();
    }
}`

2)And this is the menu, here i use the image to view the buttons. MainMenu:

package com.mygdx.game.screen;

import com.badlogic.gdx.Gdx;

import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.Texture;

import com.mygdx.game.gamename;

public class MainMenuScreen implements Screen{
    
    private static final int PLAY_BUTTON_WIDTH = 150;
    private static final int PLAY_BUTTON_HEIGHT = 80;
    private static final int OPTIONS_BUTTON_WIDTH = 150;
    private static final int OPTIONS_BUTTON_HEIGHT = 80;
    
    gamename game;
    
    Texture playButtonActive;
    Texture playButtonInactive;
    Texture optionsButtonActive;
    Texture optionsButtonInactive;
    
    public MainMenuScreen (gamename game){
        this.game = game;
        playButtonActive = new Texture("play1.png");
        playButtonInactive = new Texture("play2.png");
        optionsButtonActive = new Texture("options1.png");
        optionsButtonInactive = new Texture("options2.png");
    }

    @Override
    public void show() {
    }

    @Override
    public void render(float f) {  //Colore e carica bottoni
        Gdx.gl.glClearColor(1, 1, 1, 1);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
        game.batch.begin();
        
        game.batch.draw(playButtonActive, 240, 150, PLAY_BUTTON_WIDTH, PLAY_BUTTON_HEIGHT);
        
        
        game.batch.end();
    }

    @Override
    public void resize(int i, int i1) {
    }

    @Override
    public void pause() {
    }

    @Override
    public void resume() {
    }

    @Override
    public void hide() {
    }

    @Override
    public void dispose() {
    }
}

I would like the button to be the same even if I manually increase the page size. Some say they use viewport but I have never used it and I don't know how to do it. Can someone help me?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source