2013-08-30 9 views
8

Ho letto su libgdx scene2d features, compresi gli elementi dell'interfaccia utente, ma non riesco a farli funzionare. Sembrano tutti utilizzare un oggetto pelle, come posso crearne uno?Uso di scene2d.ui con libgdx: da dove viene la pelle?

Ho passato il nice tutorial che crea un semplice gioco libgdx che cattura le gocce di pioggia in un secchio e ho creato una semplice app per giochi da tavolo caricando le immagini con un texture atlas. Tuttavia, scene2d suona come un modo migliore per controllare i pezzi in movimento in un'app di gioco da tavolo, così come tutti i pulsanti e menu.

risposta

19

Per caricare uno skin, è possibile iniziare con i file skin di esempio utilizzati nel progetto di test libgdx.

  1. Atlaspack File
  2. Json File
  3. Atlaspack Image
  4. Font File

C'è un po 'più in dettaglio nella this question, e ho scoperto che ho dovuto spostare i file in una sottodirectory di attività al fine di evitare un bug nella versione HTML. (Se lascio i file nella cartella delle risorse, viene visualizzato un messaggio di errore come "GwtApplication: exception: Error reading file data/uiskin.json.")

Ho postato un complete example che visualizza un singolo pulsante e l'interessante il codice è tutto nel game class. L'esempio è così semplice che hai solo bisogno di due variabili membro per contenere la scena e il pulsante.

private Stage stage; 
private TextButton button; 

Per creare la skin, è sufficiente caricare il file di dati.

Skin skin = new Skin(Gdx.files.internal("data/uiskin.json")); 

Collegare il pulsante al palco.

stage = new Stage(); 
button = new TextButton("Click Me!", skin); 
stage.addActor(button); 

Collegare un listener al pulsante e registrare il livello per ricevere gli eventi.

button.addListener(new ClickListener() { 
    @Override 
    public void clicked(InputEvent event, float x, float y) { 
     button.setText("Clicked!"); 
    } 
}); 
Gdx.input.setInputProcessor(stage); 

Procedimento render() è fondamentalmente una chiamata a stage.draw().

Gdx.gl.glClearColor(1, 1, 1, 1); 
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT); 

stage.act(Math.min(Gdx.graphics.getDeltaTime(), 1/30f)); 
stage.draw(); 

Quindi è sufficiente disporre lo schermo quando si ridimensiona.

button.setPosition(
     (width-button.getWidth())/2, 
     (height-button.getHeight())/2); 

Se lo schermo è più complicata, è consigliabile utilizzare un Table.

Se si desidera utilizzare un carattere diverso, è possibile generare il file del font e il file di immagine utilizzando Hiero. Dopo averlo fatto, dovrai prendere la nuova immagine del font e usare lo TexturePacker per reimballarlo con l'altro skin assets.