View on click should redraw on it's canvas

Question

I'm currently drawing a map that contains hexagons as it's nodes I made a NodeView class to have the image drawn on a Canvas when called. (you can see this image to see the hexagon layout) Every node has it's own NodeView (since each of them have other properties)

What I want to do is when a hexagon is touched (on ActionUp) it will redraw it's image to be a different hexagon image

so far this is what I have

public boolean onTouchEvent(MotionEvent event) {
    int eventaction = event.getAction();

    switch (eventaction) {
        case MotionEvent.ACTION_DOWN: 
            // finger touches the screen
            break;

        case MotionEvent.ACTION_MOVE:
            // finger moves on the screen
            break;

        case MotionEvent.ACTION_UP:   
            // finger leaves the screen
            Toast toast = Toast.makeText(getContext(), "Button is pressed", 1);
            toast.show();
            //should change the image drawn on this view ONLY
            break;                


    }
    return true;
}

How should I go about to have on ACTION_UP make the touched hexagon to change it's image only?

Currently when the NodeView is used it uses the onDraw() method to draw the hexagon depending on which one was supposed to be drawn (I have several for different terrains).

score 0 · Answer 1 · answered Feb 05 '13 at 10:32

You'd have to calculate users finger location on the DOWN event:

case MotionEvent.ACTION_DOWN:
  mInitialPosY = event.getX();
  mInitialPosY = event.getY();
  break;

Then you need to have Rects of your Hexagons or Nodes which you can iterate through on down/up to see if the user is touching it.

private final int isUserTouchingNode(int x, int y)
{
    //Loop through rects of nodes
    int nodeBeingTouched;
    Rect node; //Rect of you node
    for (int i = 0; i < nodes.length; i++)
    {
        node = nodes[i];
        if (node.contains(x, y))
        {
            return i;
        }
    }
}

Then in your on draw method you can see which one is being touched and draw it differently, when the user presses the screen, the view the user is currently touching is automatically invalidated.

You can also do things with the MOVE and UP, so see if the user started/moved off the view.

An example is something like:

@Override
public boolean onTouchEvent(final MotionEvent event)
{
    final int action = event.getAction();
    mCurrentPosX = event.getX();
    mCurrentPosY = event.getY();
    switch (action)
    {
        case MotionEvent.ACTION_DOWN:
            mInitialPosY = event.getX();
            mInitialPosY = event.getY();
            mStartingNode = isUserTouchingNode(mInitialPosX, mInitialPosY);
            break;
        case MotionEvent.ACTION_MOVE:

            break;
        case MotionEvent.ACTION_UP:
            mEndingNode = isUserTouchingNode(mCurrentPosX, mCurrentPosY);
            if(mStartingNode == mEndingNode){
                doNodePressed(mEndingNode);//etc...
            }
            break;

    }
    return super.onTouchEvent(event);
}

This is by no means a complete working sample just an idea to get you started.

View on click should redraw on it's canvas

1 Answers1