2017-01-11 8 views
1

をscene2d:piano key layout正確な位置は、私は私のlibGDXアプリ、以下のようなものではオフに設定プレス可能なピアノのキーをレイアウトしたい

キーが押されたとき、私はからそれを変更する必要があります(画像ボタンを使用すると簡単です)。

私が苦労しているのは、すべてのボタンをピアノキーボードに似たものにレイアウトする方法です。白いピアノのキー画像は長方形ですが、黒いピアノキーをその上に置く必要があります。以下は、私の白いピアノのキーイメージがどのように見えるかを示しています。黒い音符を入れるデッドスペースが上隅にあります。

enter image description here

テーブルはギャップで私を残してサイド・バイ・サイドのすべてを、レイアウトとしてTableを使用すると、動作しません。私はあなたがStackを使用することができますが、それはちょうど最後の上に直接すべての子供を置くので、どちらも役に立たないようです。

Skin skin; 
Stage stage; 
SpriteBatch batch; 
private TextButton button1; 
private TextButton button2; 

@Override 
public void create() { 
    batch = new SpriteBatch(); 
    stage = new Stage(); 
    Gdx.input.setInputProcessor(stage); 

    createSkin(); 

    Table table = new Table(); 
    table.setFillParent(true); 
    stage.addActor(table); 

    // Create a button with the "default" TextButtonStyle. A 3rd parameter can be used to specify a name other than "default". 
    button1 = new TextButton("First note", skin); 
    button1.getLabel().setFontScale(5); 

    button2 = new TextButton("Second note", skin); 
    button2.getLabel().setFontScale(5); 

    table.add(button1).width(500).height(500); 
    table.add(button2).width(500).height(200); 
} 

@Override 
public void render() { 
    super.render(); 
    Gdx.gl.glClearColor(0.2f, 0.2f, 0.2f, 1); 
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT); 
    stage.act(Gdx.graphics.getDeltaTime()); 
    stage.draw(); 
} 

@Override 
public void resize (int width, int height) { 
    stage.getViewport().update(width, height, true); 
} 

@Override 
public void dispose() { 
    stage.dispose(); 
    skin.dispose(); 
} 

private void createSkin() { 
    skin = new Skin(); 

    Pixmap pixmap = new Pixmap(1, 1, Pixmap.Format.RGBA8888); 
    pixmap.setColor(Color.WHITE); 
    pixmap.fill(); 
    skin.add("white", new Texture(pixmap)); 

    skin.add("default", new BitmapFont()); 

    TextButton.TextButtonStyle textButtonStyle = new TextButton.TextButtonStyle(); 
    textButtonStyle.up = skin.newDrawable("white", Color.DARK_GRAY); 
    textButtonStyle.down = skin.newDrawable("white", Color.BLUE); 
    textButtonStyle.checked = skin.newDrawable("white", Color.DARK_GRAY); 
    textButtonStyle.over = skin.newDrawable("white", Color.DARK_GRAY); 
    textButtonStyle.font = skin.getFont("default"); 
    skin.add("default", textButtonStyle); 
} 

このレンダリング:それは助け場合

は、私のコードは次のようなものである 私はテーブルを使用して言うことができる限りの事を重ね合わせる方法はありませんenter image description here

が、私はすることができますそれを行う別の方法を見つけることはありません。これはscene2dを使って可能ですか?

答えて

0

最も簡単な解決策は、同じビューポート(段階はサイズ変更の際に同じように動作する必要があります)を2番目に作成して現在のものに配置することです。あなたは同じテーブルを作成する必要がありますが、黒い注釈だけでフルフィルします(あなたの現在のステージにはもちろん、白いものだけが含まれます)。

両方のステージからイベントを取得するには、InputMultiplexerを使用する必要があります(使用方法については、read hereを参照してください)。

0

ステージにキーを表すすべてのボタンを、テーブルに入れずに直接追加します。手動で位置を設定します。ピアノの鍵は明確なパターンを持っているので、手動で行うのはかなり簡単なはずです。白鍵を追加した後に黒鍵を追加します。黒鍵が入力を受け取るために優先されるので、白鍵が非長方形であることを心配する必要はありません。

関連する問題