android - ズームとピンチ

Question

私はアンドロイド開発に不慣れです。愚かな質問をした場合は申し訳ありませんが、助けてください。RelativeLayout でズームとピンチを実装しようとしています。フロアマップのイメージを取得し、その上にピン (ImageVIew) を描画する独自のマップビューを作成したいと考えています。試してみましたが、現在ピンをクリックできません。これらの投稿の助けを借りてコードを作成しました

RelativeLayout を拡張し、dispatchDraw() をオーバーライドしてズーム可能な ViewGroup を作成する

と

Android - スプレッド/ピンチで RelativeLayout を拡大/縮小

私のコードは

public class TempView extends RelativeLayout {
private static final int INVALID_POINTER_ID = -1;

private Drawable mIcon;
private float mPosX;
private float mPosY;
TempView temp;
private float mLastTouchX;
private float mLastTouchY;
private int mActivePointerId = INVALID_POINTER_ID;

private ScaleGestureDetector mScaleDetector;
private float mScaleFactor = 1.f;

public TempView(Context context) {
    this(context, null, 0);
    temp = this;
}

public TempView(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
    temp = this;
}

public TempView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    mIcon = context.getResources().getDrawable(R.drawable.ic_launcher);
    mIcon.setBounds(0, 0, mIcon.getIntrinsicWidth(), mIcon.getIntrinsicHeight());
    temp = this;
    mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
}

@Override
public boolean onTouchEvent(MotionEvent ev) {
    // Let the ScaleGestureDetector inspect all events.

    mScaleDetector.onTouchEvent(ev);



    final int action = ev.getAction();
    switch (action & MotionEvent.ACTION_MASK) {
    case MotionEvent.ACTION_DOWN: {
        final float x = ev.getX();
        final float y = ev.getY();

        mLastTouchX = x;
        mLastTouchY = y;
        mActivePointerId = ev.getPointerId(0);
        break;
    }

    case MotionEvent.ACTION_MOVE: {
        final int pointerIndex = ev.findPointerIndex(mActivePointerId);
        final float x = ev.getX(pointerIndex);
        final float y = ev.getY(pointerIndex);

        // Only move if the ScaleGestureDetector isn't processing a gesture.
        if (!mScaleDetector.isInProgress()) {
            final float dx = x - mLastTouchX;
            final float dy = y - mLastTouchY;

            mPosX += dx;
            mPosY += dy;

            invalidate();
        }

        mLastTouchX = x;
        mLastTouchY = y;

        break;
    }

    case MotionEvent.ACTION_UP: {
        mActivePointerId = INVALID_POINTER_ID;

        break;
    }

    case MotionEvent.ACTION_CANCEL: {
        mActivePointerId = INVALID_POINTER_ID;
        break;
    }

    case MotionEvent.ACTION_POINTER_UP: {
        final int pointerIndex = (ev.getAction() & MotionEvent.ACTION_POINTER_INDEX_MASK)
                >> MotionEvent.ACTION_POINTER_INDEX_SHIFT;
        final int pointerId = ev.getPointerId(pointerIndex);
        if (pointerId == mActivePointerId) {
            // This was our active pointer going up. Choose a new
            // active pointer and adjust accordingly.
            final int newPointerIndex = pointerIndex == 0 ? 1 : 0;
            mLastTouchX = ev.getX(newPointerIndex);
            mLastTouchY = ev.getY(newPointerIndex);
            mActivePointerId = ev.getPointerId(newPointerIndex);
        }


        break;
    }
    }
   return true;
}

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b)
{
    int count = getChildCount();
    Log.d("onLayout", ""+count);
    for(int i=0;i<count;i++){
        View child = getChildAt(i); 
        if(child.getVisibility()!=GONE ){
            RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)child.getLayoutParams();
            child.layout(
                (int)(params.leftMargin * mScaleFactor), 
                (int)(params.topMargin * mScaleFactor), 
                (int)((params.leftMargin + child.getMeasuredWidth()) * mScaleFactor), 
                (int)((params.topMargin + child.getMeasuredHeight()) * mScaleFactor) 
                );


                child.setLayoutParams(params);
        }
    }
}




@Override
public void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    canvas.save(Canvas.MATRIX_SAVE_FLAG);
    canvas.translate(mPosX, mPosY);
    canvas.scale(mScaleFactor, mScaleFactor);
    Log.d("onDraw", ""+mScaleFactor);
    int count = getChildCount();
    for(int i=0;i<count;i++){
        View child = getChildAt(i); 
        if(child.getVisibility()!=GONE){
            child.draw(canvas);
            Log.d("onDraw", ""+mScaleFactor);
        }
    }

    canvas.restore();
}
@Override
protected void dispatchDraw(Canvas canvas) {
    canvas.save(Canvas.MATRIX_SAVE_FLAG);

    canvas.translate(mPosX, mPosY);
    canvas.scale(mScaleFactor, mScaleFactor);

    super.dispatchDraw(canvas);
    canvas.restore();
}

private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
    @Override
    public boolean onScale(ScaleGestureDetector detector) {
        mScaleFactor *= detector.getScaleFactor();

        // Don't let the object get too small or too large.
        mScaleFactor = Math.max(1.0f, Math.min(mScaleFactor, 5.0f));
       // Log.d("onScale", ""+mScaleFactor);
        temp.invalidate();
        invalidate();
        return true;
    }
}
}

質問:

フロアマップ画像のみズームする方法は？
ピンをズームせずに相対的に移動しますか?
ピンをクリックしたときに正確なクリックイベントを取得する

提案と回答は非常に高く評価されます。

前もって感謝します、

カマール

score 0 · Accepted Answer

Android ビュー内の要素のような HTML マップの実装:

レイアウトでドローアブルまたはビットマップとして画像をサポート
xml でエリアタグのリストを許可します
リソース xml への HTML エリアタグのカットアンドペーストの使用を有効にします (つまり、HTML マップと画像を取得し、最小限の編集で使用できます)。
画像がデバイスの画面よりも大きい場合、パンをサポートします
ピンチズーム対応
領域がタップされたときのコールバックをサポートします。
注釈をバブルテキストとして表示し、バブルがタップされた場合にコールバックを提供します

このリンクを参照すると、ソリューションが得られますhttps://github.com/catchthecows/AndroidImageMap

android - ズームとピンチ

1 に答える 1

Related

Reference