LibGdx Die Ansichtsfenster verstehen und mit einem Scene2D assoziieren

Question

Immer wenn ich versuche, mein Ansichtsfenster auf eine Bühne zu stellen, sind die Schauspieler, die ich in die Szene stelle, verwaschen und sehr groß. Ich möchte meine Spielweltgröße als ein Rechteck von 50x100 Einheiten einstellen und dann alles (Sprites, Schauspieler, Labels, Fonts) nach diesen Einheiten skalieren. Jeder Staat inharitate eine Klasse Staat bilden, die Funktion liefert machen usw.

public abstract class State { 
    public static final float GAME_SIZE_WIDTH = 50 ; 
    public static final float GAME_SIZE_HEIGHT = 100 ; 
    protected OrthographicCamera camera; 

    protected GameStateManager gsm; 
    protected Viewport viewport; 

    public State(GameStateManager gsm) { 
     this.gsm = gsm; 
     camera = new OrthographicCamera(); 
     viewport = new ExtendViewport(GAME_SIZE_WIDTH, GAME_SIZE_HEIGHT, camera); 
     viewport.apply(); 
     camera.position.set(GAME_SIZE_WIDTH/2, GAME_SIZE_HEIGHT/2, 0); 
    } 

    public abstract void handleInput(); 
    public abstract void update(float dt); 
    public abstract void render (SpriteBatch sb); 
    public abstract void dispose(); 
    public abstract void resize(int width, int height) ; 
    } 

In jedem State ich die Stage hinzufügen möchten, und die viewPort für meine State-Klasse nach passieren die GAME_SIZE_WIDTH /GAME_SIZE_HEIGHT Dimension zu halten, aber Ive erhielt unangepasste Hintergründe (selbst wenn das volle HD-Bild der weiße Rand links ist) und die Buttons mit unjustiertem Text darauf geblured sind.

public class MenuState extends State implements InputProcessor { 

private Skin skin; 
private Stage stage; 

private Sprite background; 
private Table table; 
private TextButton startButton,quitButton; 
private Sprite flappyButton; 
private Sprite chodzenieButton; 
private Sprite memoryButton; 
private Sprite rememberSquare; 
private static final String TAG = "kamil"; 
private Vector3 touchPoint; 

public MenuState(GameStateManager gsm) { 
    super(gsm); 

    skin = new Skin(Gdx.files.internal("button/uiskin.json")); 
    stage = new Stage(viewport); 
    table = new Table(); 
    table.setWidth(stage.getWidth()); 
    table.align(Align.center | Align.top); 

    table.setPosition(0,GAME_SIZE_HEIGHT); 
    startButton = new TextButton("New Game",skin); 
    quitButton = new TextButton("Quit Game",skin); 
    startButton.addListener(new ClickListener() { 
     @Override 
     public void clicked(InputEvent event, float x, float y) { 
      Gdx.app.log("Clicked button","Yep, you did"); 
      event.stop(); 
     } 
    }); 

    table.padTop(5); 
    table.add(startButton).padBottom(5).size(20,10); 
    table.row(); 
    table.add(quitButton).size(20,10); 

    stage.addActor(table); 

    background =new Sprite(new Texture(Gdx.files.internal("backgrounds/bg.jpg"))); 
    background.setSize(GAME_SIZE_WIDTH,GAME_SIZE_HEIGHT); 
    background.setPosition(0,0); 
    touchPoint= new Vector3(); 

    InputMultiplexer im = new InputMultiplexer(stage,this); 
    Gdx.input.setInputProcessor(im); 
    flappyButton=new Sprite(new Texture("menuButton/floopyBirdButtonTexture.png")); 
    chodzenieButton =new Sprite(new Texture("menuButton/swipeMovementsButtonTexture.png")); 
    memoryButton =new Sprite(new Texture("menuButton/memory.png")); 
    rememberSquare = new Sprite(new Texture("menuButton/rememberSquare.png")); 
    rememberSquare.setSize(20,10); 
    flappyButton.setSize(20,10); 
    chodzenieButton.setSize(20,10); 
    memoryButton.setSize(20,10); 
    flappyButton.setPosition(GAME_SIZE_WIDTH/2-flappyButton.getWidth()/2,GAME_SIZE_HEIGHT/2-flappyButton.getHeight()/2); 
    chodzenieButton.setPosition(GAME_SIZE_WIDTH/2-flappyButton.getWidth()/2,flappyButton.getY()- chodzenieButton.getHeight() -2); 
    memoryButton.setPosition(chodzenieButton.getX(),chodzenieButton.getY()- flappyButton.getHeight() -2); 
    rememberSquare.setPosition(flappyButton.getX(),flappyButton.getY()+flappyButton.getHeight()+2); 
} 



@Override 
public void render(SpriteBatch sb) { 
    sb.setProjectionMatrix(camera.combined); 
    sb.begin(); 
    background.draw(sb); 
    flappyButton.draw(sb); 
    chodzenieButton.draw(sb); 
    memoryButton.draw(sb); 
    rememberSquare.draw(sb); 
    sb.end(); 
    stage.act(Gdx.graphics.getDeltaTime()); 
    stage.draw(); 
} 

@Override 
public void dispose() { 
    flappyButton.getTexture().dispose(); 
    chodzenieButton.getTexture().dispose(); 
    background.getTexture().dispose(); 
} 

@Override 
public void resize(int width, int height) { 
    Gdx.app.log("kamil","Resize"); 

    viewport.update(width,height); 
} 
@Override 
public void handleInput() { 
    if(Gdx.input.justTouched()) 
    { 
     // 

    viewport.unproject(touchPoint.set(Gdx.input.getX(),Gdx.input.getY(),0)); 
    if(flappyButton.getBoundingRectangle().contains(touchPoint.x,touchPoint.y)) { 
     gsm.set(new FlopyBirdState(gsm)); 
    } 
     else if (chodzenieButton.getBoundingRectangle().contains(touchPoint.x,touchPoint.y)){ 
     gsm.set(new ChodzenieState(gsm)); 
    } 
    else if (memoryButton.getBoundingRectangle().contains(touchPoint.x,touchPoint.y)){ 
     gsm.set(new MemoryState(gsm)); 
    } 
    else if (rememberSquare.getBoundingRectangle().contains(touchPoint.x,touchPoint.y)){ 
     gsm.set(new FoodEaterState(gsm)); 
    }} 
} 

Answer 1

verwischten und sehr große: Dies ist aufgrund Schriftgröße Sie verwenden.

Blured, wenn einige Schriftart in geeigneter Weise skaliert ist, spielt keine Rolle, ob es von Ihnen oder von Ansichtsfenster ist.

Sie verwenden 50 und 100 als Weltbreite und -höhe des Ansichtsfensters, und Sie verwenden BitmapFont von Skin, die eine größere Größe als 50 und 100 haben. Wenn Sie das Ansichtsfenster also nach Bildschirmbreite und Höhe aktualisieren, wird auch BitmapFont verwendet Vergrößern Sie so, dass Sie sehr groß und verschwommen aussehen.

Lösung:

1. Verwenden Sie einige größere Welt Breite und Höhe des Ansichtsfenster von Ihrem BitmapFont vergleichen, die Sie verwenden.

2. Verwenden Sie kleine Größe Ihres BitmapFont oder Sie können verkleinern, so dass nicht zu viel skaliert und hässlich aussehen.

   skin.get("font-name",BitmapFont.class).getData().setScale(.25f); 
   

Sie verwenden Table so müssen Sie unter Umständen Ihre Schauspieler überprüfen, wo in der Zelle/Tabelle ist. Sie können das Debuggen von diesem Flag stage.setDebugAll(true);

EDIT

Sie verwenden ExtendViewport von wiki

ermöglichen Die ExtendViewport der Welt, Seitenverhältnis hält ohne schwarze Balken durch die Welt in eine Richtung erstrecken . Die Welt wird zuerst so skaliert, dass sie in das Ansichtsfenster passt, dann wird die kürzere Dimension verlängert, um das Ansichtsfenster zu füllen.

Nehmen wir an, Sie sind Gerät Breite und Höhe ist 400 und 640, dann was passiert, wenn Sie Ansichtsfenster um 400 und 640 aktualisieren. Zuerst Ihr Sprite skaliert Höhe und Höhe 640 (weil Ansichtsfenster Welthöhe ist gleich Hintergrundhöhe) gemacht, jetzt ist es Zeit für die Breite des Hintergrunds Sprite, weil Sie die Breite der Hälfte der Höhe so skaliert und setzen Sie die Größe 640/2 = 320. getan

Ihr Problem an, meine Gerätebreite ist 400, aber mein Hintergrund sprite Größe ist nur 320 Rest (40 * 2 Einheit ist von beiden Seiten weiß).

Verwenden 48 * 80 (die meisten Geräte in diesem Verhältnis ist) anstelle von 50 * 100