如何使用手指绘制到ImageView位图并获取坐标并保存绘制的图像

时间:2013-10-20 08:23:38

标签: android canvas bitmap imageview

基本上我有一个网格(存储为图像),如下所示:

A Grid

我需要做的是用手指画出这个网格(多个笔画)并显示并保存这个新的位图。

此外,在绘制时我需要获取笔划的坐标,以便我可以从中计算一些数据(整个网格被划分为区域)。

坐标部分很简单,我使用Rect(),getX()和getY()对应。

int getZoneLocation(int x, int y)
    {

        Rect rectangle = new Rect();

        amslerView.getGlobalVisibleRect(rectangle);

        String coords = "Left:%d Top:%d Right:%d Bottom:%d ActionBarHeight:%d StatusBarHeight:%d";

        // Zone 1 Rectangle

        Log.i("Rectangle Coordinates",
                String.format(coords, rectangle.left, rectangle.top, rectangle.right, rectangle.bottom, getActionBarHeight(), getStatusBarSize()));

        Rect outerMostRect = new Rect(rectangle);

        int xOffset = rectangle.width() / 10;
        int yOffset = rectangle.height() / 10;

        Log.i("Rectangle Attribs", "Width: " + xOffset + "Height: " + yOffset);

        // Zone 2 Rectangle

        Rect zone2Rectangle = new Rect(outerMostRect.left + xOffset, outerMostRect.top + yOffset, outerMostRect.right - xOffset, outerMostRect.bottom
                - yOffset);

        Log.i("Zone 2 Coordinates", "" + zone2Rectangle.left + " " + zone2Rectangle.top + " " + zone2Rectangle.right + " " + zone2Rectangle.bottom);

        // Zone 3 Rectangle

        Rect zone3Rectangle = new Rect(zone2Rectangle.left + xOffset, zone2Rectangle.top + yOffset, zone2Rectangle.right - xOffset,
                zone2Rectangle.bottom - yOffset);

        // Zone 4 Rectangle

        Rect zone4Rectangle = new Rect(zone3Rectangle.left + xOffset, zone3Rectangle.top + yOffset, zone3Rectangle.right - xOffset,
                zone3Rectangle.bottom - yOffset);

        // Zone 5 Rectangle
        Rect zone5Rectangle = new Rect(zone4Rectangle.left + xOffset, zone4Rectangle.top + yOffset, zone4Rectangle.right - xOffset,
                zone4Rectangle.bottom - yOffset);

        // Check from inside out for point existence
        if (zone5Rectangle.contains(x, y))
        {
            return 5;
        } else if (zone4Rectangle.contains(x, y))
        {
            return 4;
        } else if (zone3Rectangle.contains(x, y))
        {
            return 3;
        } else if (zone2Rectangle.contains(x, y))
        {
            return 2;
        } else if (outerMostRect.contains(x, y))
        {
            return 1;
        }
        return -1;
    }

基本上我所做的是从显示此网格的ImageView获取localVisibleRect,然后简单地调用此方法以获取onTouchListener内部所需的数据。

现在我真正面临的困境是如何实现手指绘图以及实现这一目的的确切方法。

到目前为止,我已经看过SurfaceView,Canvas甚至是GestureOverlayView(我知道这很愚蠢)。

我还看了一下api示例中的FingerPaint演示,但是它引入了一个空视图,我真的不知道如何用ImageView实现它。

任何建议都是非常宝贵的。

1 个答案:

答案 0 :(得分:1)

你可以使用这个类:

import android.view.View.OnTouchListener;

public class XCanvas extends ImageView implements OnTouchListener
{               
    private Activity context = null;
    private Paint paint = null;        

    public XCanvas(Activity context)
    {
        super(context); 
        this.context = context;

        this.paint = new Paint();       

        setFocusable(true);
        setFocusableInTouchMode(true);

        this.setOnTouchListener(this);     

        paint.setAntiAlias(true);       
    }   

    @Override
    protected void onDraw(Canvas g) 
    {                               
        super.onDraw(g);    

        //Set background        
        this.paint.setColor(Color.rgb(0xff, 0xff, 0xff));       
        g.drawRect(0, 0, this.getWidth(), this.getHeight(), this.paint);

        //Paint everything here!
    }             

    @Override
    public boolean onTouch(View v, MotionEvent event) 
    {
        int action = event.getAction() & MotionEvent.ACTION_MASK;

        switch (action) 
        {
            case MotionEvent.ACTION_DOWN:
            {
                this.pointerPressed(event);
                break;
            }
            case MotionEvent.ACTION_MOVE:
            {
                this.pointerDragged(event);         
                break;  
            }
            case MotionEvent.ACTION_UP:
            {
                this.pointerReleased();
                break;
            }                   
        }

        return true;
    }        

    protected void pointerPressed(MotionEvent event)
    {
        //you can save touch point here!
    }

    protected void pointerDragged(MotionEvent event)
    {
        //for get x ==>  eveevent.getX()
        //for get y ==>  eveevent.getY()        

        this.repaint();
    }

    protected void pointerReleased()
    {

    }    

    public void repaint() 
    {       
        this.invalidate();
    }           
}

并且use class将此代码粘贴到主要活动中:

    private XCanvas xCanvas = null;

@Override
public void onCreate(Bundle savedInstanceState) 
{       
    super.onCreate(savedInstanceState);                                                     

    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
                                       WindowManager.LayoutParams.FLAG_FULLSCREEN);
    requestWindowFeature(Window.FEATURE_NO_TITLE);      

    //getWindow().setBackgroundDrawableResource(R.color.MapBackground);

    this.xCanvas = new XCanvas(this);                               
    this.xCanvas.repaint();

    setContentView(this.xCanvas);
    this.xCanvas.requestFocus();
}