我的带有libgdx的游戏屏幕在android上缩小

Question

I'm learning libgdx (java) game programming and I just finished my first game : a simple Brick Destroyer.

I made a desktop and android project. After some hours of "hard" work, my game finally works fine on desktop. I'm not using scene2D or box2D or anything else for this game (I just implemented the interface "screen" on my classes : GameScreen, MainMenuScreen etc...).

Here is the problem : When I export my game as an .APK file and then install it on my android phone (Sony Xperia Z1 compact), the screen is absolutely different. The ball still reacts well with all other elements (bricks and sides of the screen) but it seems not to be the same zoom. I've tried so much things, I don't know what to do anymore, please help me :).

I'm using a FitViewport and an Orthographic Camera.

See below the screenshots : 1 - The constructor of GameScreen class. 2 - Desktop programm. 3 - Android app.

Thank you all for your answers and sorry for my english if I made mistakes(I'm not an english native speaker).

final Bricks game;

Texture ball_img, plate_img, brique_img_rouge, brique_img_orange, brique_img_vert;  
Vector2 posb, posp;
Vector2 vitb, vitp;
OrthographicCamera camera;
Rectangle ball, plate;
Array<Brique> briques;
FitViewport viewport;
final int plate_width = 60, plate_height = 10;
final int brique_width = 35, brique_height = 15;
final int ball_width = 15, ball_height = 14;
boolean left_p, right_p, up_p;    


public GameScreen(final Bricks gam) {

    this.game = gam;


    ball_img = new Texture("ball_bl.PNG");
    plate_img = new Texture("plate_bl.PNG");
    brique_img_rouge = new Texture("brique_bl_rouge.PNG");
    brique_img_orange = new Texture("brique_bl_orange.PNG");
    brique_img_vert = new Texture("brique_bl_vert.PNG");

    camera = new OrthographicCamera();
    viewport = new FitViewport(Gdx.graphics.getWidth(), Gdx.graphics.getHeight(), camera);
    viewport.apply();               

    ball = new Rectangle();
    plate = new Rectangle();

    briques = new Array<Brique>();
    briques.add(new Brique(2));
    briques.first().x = 50;
    briques.first().y = Gdx.graphics.getHeight()-60;
    briques.first().width = brique_width;
    briques.first().height = brique_height;

    posb = new Vector2(Gdx.graphics.getWidth()/2, Gdx.graphics.getHeight()/4);
    vitb =  new Vector2(0, 400*Gdx.graphics.getDeltaTime());

    posp = new Vector2(Gdx.graphics.getWidth()/2 - plate_width/2, 20);
    vitp =  new Vector2(400*Gdx.graphics.getDeltaTime(), 0);

    for (int i = 1; i < 65; i++) {

        if( i % 13 == 0) {
            briques.add(new Brique(1));
            briques.get(i).x = briques.first().x;
            briques.get(i).y = briques.get(i-1).y - 35;
            briques.get(i).width = brique_width;
            briques.get(i).height = brique_height;

        } else {
            briques.add(new Brique(1));
            briques.get(i).x = briques.get(i-1).x + briques.get(i-1).width + 20;
            briques.get(i).y = briques.get(i-1).y;
            briques.get(i).width = brique_width;
            briques.get(i).height = brique_height;
        }

        if(i > 51 || i == 19 || i == 32) {
            briques.get(i).setType(3);
        }
        if((i < 13 || i %13 == 0 || i == 25 || i >= 38) && i < 52) {
            briques.get(i).setType(2);
        }
    }

    ball.x = posb.x;
    ball.y = posb.y;
    ball.width = ball_width;
    ball.height = ball_height;

    plate.x = posp.x;
    plate.y = posp.y;
    plate.width = plate_width;
    plate.height = plate_height;

I think the problem comes from here, but it works on desktop.

camera = new OrthographicCamera();
    viewport = new FitViewport(Gdx.graphics.getWidth(), Gdx.graphics.getHeight(), camera);
    viewport.apply();       

Desktop : Desktop programm

Android : android app from .APK file

Answer 1

This happens, since you use a FitViweport with a virtual screen size of the actual screen size. Since your desktop app and android phone have a different resolution, you get different viewports.

So for your desktop app the camera code might actually "look" like this:

camera = new OrthographicCamera();
viewport = new FitViewport(800, 600, camera);
viewport.apply();

And for you android it might actually "look" like this:

camera = new OrthographicCamera();
viewport = new FitViewport(400, 700, camera);
viewport.apply();

To solve that define an inner virtual world size, so that for both the world size is for example VIRTUAL_WIDTH x VIRTUAL_HEIGHT . This size must not be in pixels:

// Global static field in your game class
public static int VIRTUAL_WIDTH = XXX;
public static int VIRTUAL_HEIGHT = XXX;

// ...

camera = new OrthographicCamera();
viewport = new FitViewport(VIRTUAL_WIDTH, VIRTUAL_HEIGHT, camera);
viewport.apply();

This means that instead of using Gdx.graphics.getWidth() or Gdx.graphics.getHeight() you use these values, respectively, since you now work in your virtual screen size.

For example here in your code:

posb = new Vector2(VIRTUAL_WIDTH / 2f, VIRTUAL_HEIGHT / 4f);

For your out of screen problem:

Check how you draw your blocks, do you use Gdx.graphics.getXXX() or values that exceed your new size limit?