画像でボタンを作る
画像でボタンを作るには、g.Sprite と onPointDown 等のトリガーを利用し実現します。
凡例
javascript
// g.Sprite を利用したボタン
const spriteButton = new g.Sprite({
scene: scene,
src: scene.asset.getImage("/assets/button.png"),
touchable: true
});
// ポイントダウン時に横幅を拡大する
spriteButton.onPointDown.add((ev) => {
spriteButton.scaleX = 1.2;
spriteButton.modified();
});
// ポイントアップ時に横幅を戻す
spriteButton.onPointUp.add((ev) => {
spriteButton.scaleX = 1.2;
spriteButton.modified();
});
scene.append(spriteButton);利用例
次のコンテンツは、g.Sprite, onPointDown, onPointUp を利用したボタンを配置しています。クリック時に画像の縦・横が拡大されます。
詳細
g.Sprite と onPointDown 等のトリガーを組み合わせてボタンを実現しています。 ボタンとなる g.Sprite に onPointDown でクリック時の動作、onPointUp でクリックが離れた時の動作を追加しています。