如何绘制到一个位图ImageView的手指,并获得坐标,并保存绘制的图像 [英] How to draw onto an ImageView Bitmap with finger and obtain coordinates and save the drawn image

查看:260
本文介绍了如何绘制到一个位图ImageView的手指,并获得坐标,并保存绘制的图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

基本上我有一个网格(存储为一个图像),像这样:

Basically i have a grid(stored as an image) like so:

我需要做的是汲取此网格用手指(多杆)和显示,并保存新的位图什么。

What I need to do is draw on this grid with my finger(multiple strokes) and display and save this new bitmap.

此外,同时提请我需要获得笔划的坐标,这样我可以从它(整个网格划分为区域)。

Additionally, while drawing I need to obtain the coordinates of the stroke so I can calculate some data from it(The whole grid is divided into zones ).

坐标部分很简单,我没有使用矩形()的getX()和的getY()即

The coordinate part was simple, which I did using Rect(), getX() and getY() viz.

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;
    }

基本上我所做的是从显示这个网格,然后简单地调用此方法来获取数据,我需要里面的onTouchListener获得的ImageView的localVisibleRect。

Basically what I did was obtain the localVisibleRect from the ImageView that displays this grid and then simply call this method to obtain the data I need inside to onTouchListener.

现在对我来说,真正的难题是如何实现手指与此一起绘画,到底该怎么用它来实现这一点。

Now the real dilemma for me is how to implement the finger drawing along with this, and what exactly to use to implement this.

到目前为止,我已经看了SurfaceView,帆布,甚至GestureOverlayView(这是愚蠢的,我知道)。

So far I've looked at SurfaceView, Canvas and even GestureOverlayView(which is stupid I know).

我也采取了看一看该API的例子演示FingerPaint,但是,吸引到一个空的观点,我真的对如何与ImageView的实现这个不知道。

I've also taken a look at the FingerPaint demo from the api examples, but that draws onto an empty view and I honestly have no idea on how to implement this with an ImageView.

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

Any suggestions would be invaluable.

推荐答案

您可以使用这个类:

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();
    }           
}

和使用类粘贴此code的主要活动:

and for use class paste this code in main activity:

    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();
}

这篇关于如何绘制到一个位图ImageView的手指,并获得坐标,并保存绘制的图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆