android - 如何创建类似 TorchLight 的 UI。例如。手电筒 Zaphrox

Question

我正在从事相机闪光灯应用方面的工作。

我能够启动和停止摄像头 LED。我在手电筒的 GUI 设计方面遇到了问题。

我想创建类似 FlashLight Zaphrox 的 GUI ..

我猜是:

您可以看到，当点击手电筒按钮时，图像会发生变化。仅当点击手电筒按钮时 View 才会发生变化。

到目前为止我尝试的是:

        Display display = getWindowManager().getDefaultDisplay(); 
        width = display.getWidth();
        height = display.getHeight();

        imageView=(ImageView)findViewById(R.id.imageId);

        imageView.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View view, MotionEvent me) {

                Toast.makeText(ImageClicker.this,me.getRawX()+" "+me.getRawY(), Toast.LENGTH_SHORT).show();

                Log.i("View--Width & Height",view.getWidth()+" "+view.getHeight());
                Log.i("View -- Measured Width & Height",view.getMeasuredWidth()+" "+view.getMeasuredHeight());
                Log.i("Simple X Y Coordiantes",me.getX()+" "+me.getY());
                Log.i("Raw Coordinates",me.getRawX()+" "+me.getRawY());
                Log.i("Display Matrix",width+" "+height);
                return false;
            }
        });

& 我为两个不同大小的模拟器得到的结果是:

对于 320x480

09-07 16:32:28.439: INFO/View--Width & Height(2305): 320 43
09-07 16:32:28.439: INFO/View -- Measured Width & Height(2305): 320 43
09-07 16:32:28.449: INFO/Simple X Y Coordiantes(2305): 160.0 21.0
09-07 16:32:28.449: INFO/Raw Coordinates(2305): 160.0 264.0
09-07 16:32:28.449: INFO/Display Matrix(2305): 320 480

对于 480x800

09-07 16:33:22.454: INFO/View--Width & Height(410): 480 64
09-07 16:33:22.464: INFO/View -- Measured Width & Height(410): 480 64
09-07 16:33:22.474: INFO/Simple X Y Coordiantes(410): 240.0 31.0
09-07 16:33:22.474: INFO/Raw Coordinates(410): 240.0 437.0
09-07 16:33:22.505: INFO/Display Matrix(410): 480 800

已编辑

按照incrediApp的回答试了:Code .但还没有结果。

我不知道如何处理这样的点击事件。

我想拥有与 Flashlight Zaphrox 相同的用户界面.

我想在我的应用程序中创建相同的效果。我怎样才能做到这一点 ？如果能举例说明就更好了。

Answer 1

创建一个在特定区域(称为标志)捕获触摸事件的 Canvas ，例如 -

public class CustomView extends View{

    private int mFlagX = -1;
    private int mFlagY = -1;
    private Bitmap mBitmap = null;
    private Paint mPaint = null;
    private boolean isFlagHidden = false;
    private int mBoundX = -1;
    private int mBoundY = -1;

    //play with these values to listen the click more closer to flag
    public final int CLOSER = 50;
    public final int CLOSE = 100;

    public CustomView(Context context, AttributeSet aSet) 
    { 
        super(context, aSet); 
        //load our bitmap (flag image)
        mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.transperent);
        //create a paint brush
        mPaint = new Paint();
        mPaint.setColor(Color.TRANSPARENT);
    }

    @Override
    public void onDraw(Canvas canvas)
    {
        //initialize
        if ((mFlagX < 1) || (mFlagY < 1)) {

                   //adjust these values for listening area
                    mFlagX = (int) (getWidth() / 2) - mBitmap.getWidth()/ 2 ;
            mFlagY = (int)getHeight() / 2) - mBitmap.getHeight() / 2 ;
            mBoundX = (int)getWidth() - mBitmap.getWidth();
            mBoundY = (int)getHeight() - mBitmap.getHeight();
        }
        //draw background
        canvas.drawRect(0, 0, getWidth(), getHeight(), mPaint);
        //draw the flag
        if (!isFlagHidden) {
            canvas.drawBitmap(mBitmap, mFlagX, mFlagY, null);
        }
    }

    public void hideTheFlag()
    {           
        isFlagHidden = true;
        //force redraw
        invalidate();   
    }

    public void giveUp(){
        isFlagHidden = false;
        //force redraw
        invalidate();
    }   

    public int takeAGuess(float x, float y)
    {   

        //this is our "pretty closer" area
        Rect prettyClose = new Rect(mFlagX - CLOSE, mFlagY - CLOSE, mFlagX+mBitmap.getWidth() + CLOSE, mFlagY+mBitmap.getHeight() + CLOSE);
        //normalize
        if (prettyClose.left < 0) prettyClose.left = 0;
        if (prettyClose.top < 0) prettyClose.top = 0;
        if (prettyClose.right > mBoundX) prettyClose.right = mBoundX;
        if (prettyClose.bottom > mBoundY) prettyClose.bottom = mBoundY;

        //this is our "really closer" area
        Rect reallyClose = new Rect(mFlagX - CLOSER, mFlagY - CLOSER, mFlagX+mBitmap.getWidth() + CLOSER, mFlagY+mBitmap.getHeight() + CLOSER);
        //normalize
        if (reallyClose.left < 0) reallyClose.left = 0;
        if (reallyClose.top < 0) reallyClose.top = 0;
        if (reallyClose.right > mBoundX) reallyClose.right = mBoundX;
        if (reallyClose.bottom > mBoundY) reallyClose.bottom = mBoundY;

        //this is the area that contains our flag
        Rect bullsEye = new Rect(mFlagX , mFlagY , mFlagX+mBitmap.getWidth(), mFlagY+mBitmap.getHeight());

        //check to see where on the board the user pressed
        if (bullsEye.contains((int) x, (int)y)) {
            //found it
            isFlagHidden = false;
            invalidate();
            return 1;
        } else if (reallyClose.contains((int) x, (int)y)) {
            //really closer
            return 2;
        } else if (prettyClose.contains((int)x, (int)y)) {
            //pretty closer
            return 3;
        } else {
            //far away
            return 4;
        }
    }
}

现在在您的 Activity 中，覆盖 onTouch() 以听取标志上的触摸 -

 @Override
public boolean onTouch(View v, MotionEvent event)
{
    if (v.getId() == R.id.the_canvas)
    {
        if (event.getAction() == MotionEvent.ACTION_DOWN)
        {
            if (isFlagHidden) 
            {
                switch (mCustomView.takeAGuess(event.getX(), event.getY()))
                {
                   case 1:
                         mCustomView.giveUp();  

                          /*
                             YOUR CODE GOES HERE
                          */
                         Toast.makeText(getApplicationContext(), "bull's eye", Toast.LENGTH_SHORT).show();                  

                         break;
                    case 2:
                        Toast.makeText(getApplicationContext(), "really closer", Toast.LENGTH_SHORT).show();
                        break;
                    case 3:                 
                        Toast.makeText(getApplicationContext(), "pretty closer", Toast.LENGTH_SHORT).show();
                        break;
                    case 4:
                        Toast.makeText(getApplicationContext(), "far away", Toast.LENGTH_SHORT).show();
                        break;
                }
            }
        }
        return true;
    }
    return false;
}   

引用:Capture the flag: A tutorial on Android’s Canvas class and Touch event handler