2013年5月27日月曜日

自作ライブラリ-SurfaceViewで表示するボタン

SurfaceViewでボタンを使いたくなった場合、FrameLayoutあたりを使ってButtonを重ね表示して、onClickイベントで処理するということもできますが、自前でSurfaceViewに描画するButtonクラスを作っておくと、いろいろと柔軟に対応できて捗ります。
まず対応する状態に応じた画像を準備します。

Buttonクラスはこんな感じで、状態とそれに応じたImageを持っていて描画メソッドでは状態に応じて画像を描画します。
public class CvsButton {
  public Paint paint = new Paint();
  public boolean enabled = true;
  public boolean pressed = false;
  public boolean visible = true;
  public Bitmap defaultImage;
  public Bitmap pressedImage;
  public Bitmap disenableImage;
  public Rect rect;

  public CvsButton() {}

  public CvsButton(Resources resouce, int defaultId, int pressedId, int disenableId, Rect size) {
    defaultImage = BitmapFactory.decodeResource(resouce, defaultId);
    pressedImage = BitmapFactory.decodeResource(resouce, pressedId);
    disenableImage = BitmapFactory.decodeResource(resouce, disenableId);
    rect = size;
  }

  public void draw(Canvas canvas) {
    if (enabled) {
      if (pressed) {
        canvas.drawBitmap(pressedImage, rect, rect, paint);
      } else {
        canvas.drawBitmap(defaultImage, rect, rect, paint);
      }
    } else {
      canvas.drawBitmap(disenableImage, rect, rect, paint);
    }
  }
}
このクラスをSparseArrayかHashMapあたりに突っ込んで、SurfaceViewのonTouchEventで座標をisPressに流してボタンのイベント処理、描画スレッドでdrawメソッドを呼んでボタンの描画処理を行います。

  public static final int BUTTON_A = 1;
  public static final int BUTTON_B = 2;

  private SparseArray<CvsButton> items = new SparseArray<CvsButton>();

  public void init() {
    items.put(BUTTON_A, new CvsButton());
    items.put(BUTTON_B, new CvsButton());
  }

  public int isPress(int x, int y) {
    int ret = -1;
    for (int i = 0; i < items.size(); i++) {
      if (items.valueAt(i).rect.contains(x, y) && items.valueAt(i).visible && items.valueAt(i).enabled) {
        items.valueAt(i).pressed = true;
        ret = items.keyAt(i);
        break;
      }
    }
    return ret;
  }

  public void draw(Canvas canvas) {
    for (int i = 0; i < items.size(); i++) {
      if (items.valueAt(i).visible) { items.valueAt(i).draw(canvas);}
    }
  }

一度作っておけば、使いやすいよう改変したりしていろんなところで使えるので大変お勧めです。

0 件のコメント:

コメントを投稿