Attaching listeners to some part of view in android

Question

I have a view in which there is a rectangle and few lines coming out from the edge of rectangle. I have set onClickListener for the entire view but is there any way in which I can set onClickListener for the individual parts(line) of a view?

My question is whether we can set listeners to a part of view in android?

My view class (DrawView.java)

    public class DrawView extends View {
    Paint paint = new Paint();
    Rect r =new Rect(0, 0, 300, 40);



    public DrawView(Context context) {
        this(context, null);            
    }

    public DrawView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public DrawView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);


    }

    @Override
    public void onDraw(Canvas canvas) {

        paint.setColor(Color.GREEN);
        canvas.save();
        canvas.scale(mScaleFactor, 1);
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.BLUE); 
        canvas.drawRect(r, paint);
        makeLinesinRange(0,40,300,40,300, 10, canvas,100);  // this will make 10 lines from edge of rectangle in downward side 
        requestLayout();
       }






    private void makeLinesinRange(int x1, int y1, int x2, int y2, int size, int total_events, Canvas canvas,int width)
    {
        paint.setStrokeWidth(6);
        paint.setColor(Color.GRAY);

        if(total_events<1)
        {
            return;
        }
        if(total_events==1)
        {
            canvas.drawLine(((x1+x2)/2), y1, (x1+x2)/2, y2+size, paint);

        }
        else if(total_events==2)
        {
            canvas.drawLine(((x1+x2)/3), y1, (x1+x2)/3, y2+size, paint);
            canvas.drawLine((2*(x1+x2)/3), y1, 2*(x1+x2)/3, y2+size, paint);


        }
        else
        {
        paint.setStrokeWidth(6);
        paint.setColor(Color.GRAY);
        float kk=(x2-x1)/(total_events-1);
        for(int i=0;i<total_events;i++)
        {
            canvas.drawLine(x1+i*kk, y1, x1+i*kk, y2+size, paint);
        }
        }
    }


}

My activity that contains the drawview

    public class MainActivity extends Activity {
    DrawView drawView;


    public class DrawView extends View {
        Paint paint = new Paint();
        Rect r = new Rect(0, 0, 300, 40);
        float mScaleFactor = 1.0f;

        int width = 5;
        int height = 300;

        List<HashMap<String, RectF>> lines = new ArrayList<HashMap<String, RectF>>();

        public DrawView(Context context) {
            this(context, null);
        }

        public DrawView(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }

        public DrawView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);

        }

        @Override
        public void onDraw(Canvas canvas) {

            paint.setColor(Color.GREEN);
            canvas.save();
            canvas.scale(mScaleFactor, 1);
            paint.setStyle(Paint.Style.FILL);
            paint.setColor(Color.BLUE);
            canvas.drawRect(r, paint);
            makeLinesinRange(10, canvas); // this will
                                            // make 10 lines
                                            // from edge of
                                            // rectangle in
                                            // downward side
            requestLayout();
        }

        private void makeLinesinRange(int total_events, Canvas canvas) {
            paint.setStrokeWidth(6);
            paint.setColor(Color.GRAY);

            int x = 0;
            int y = 40;
            int range = r.width()/total_events;
            range= range + ((range*10)/100);

            for (int i = 0; i < total_events; i++) {
                RectF r = new RectF();
                r.set(x, y, x + width, y + height);
                Paint mPaint = new Paint();
                mPaint.setPathEffect(null);
                canvas.drawRect(r, paint);
                HashMap<String, RectF> item = new HashMap<String, RectF>();
                item.put("" + i, r);
                lines.add(item);
                x+=range;
            }
        }

        @Override
        public boolean onTouchEvent(MotionEvent event) {

            if (event.getAction() == MotionEvent.ACTION_UP) {

                for (int i = 0; i < lines.size(); i++) {
                    RectF r = lines.get(i).get("" + i);

                    if (r.contains(event.getX(), event.getY())) {
                        Toast.makeText(getContext(), "" + (i+1) + " line clicked", Toast.LENGTH_SHORT).show();
                        System.out.println((i+1) + " line clicked");
                        break;
                    }
                }
                return false;
            }
            return true;
        }

    }

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

        drawView = new DrawView(this);
        drawView.setBackgroundColor(Color.WHITE);
        setContentView(drawView);




    }
} 

Now my new code onDraw method is
Rect r =new Rect(0, 0, 700, 40);

    public void onDraw(Canvas canvas) {


        width=sf*700;

        canvas.save();

        makeLinesinRangetwo(10, canvas); // this will


         paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.BLUE); 
        canvas.drawRect(r, paint);
        canvas.scale(sf,1,100,200);
        requestLayout();
        canvas.restore();
        }

In this only lines are expanding on scaling but rectangle is not.

Answer 1

Try this Hope help you.

I have implement click event on your lines. Try this code.

public class DrawView extends View {
    Paint paint = new Paint();
    Rect r = new Rect(0, 0, 300, 40);
    float mScaleFactor = 1.0f;

    int width = 5;
    int height = 300;

    List<HashMap<String, RectF>> lines = new ArrayList<HashMap<String, RectF>>();

    public DrawView(Context context) {
        this(context, null);
    }

    public DrawView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public DrawView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

    }

    @Override
    public void onDraw(Canvas canvas) {

        paint.setColor(Color.GREEN);
        canvas.save();
        canvas.scale(mScaleFactor, 1);
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.BLUE);
        canvas.drawRect(r, paint);
        makeLinesinRange(10, canvas); // this will
                                        // make 10 lines
                                        // from edge of
                                        // rectangle in
                                        // downward side
        requestLayout();
    }

    private void makeLinesinRange(int total_events, Canvas canvas) {
        paint.setStrokeWidth(6);
        paint.setColor(Color.GRAY);

        int x = 0;
        int y = 40;
        int range = r.width()/total_events;
        range= range + ((range*10)/100);

        for (int i = 0; i < total_events; i++) {
            RectF r = new RectF();
            r.set(x, y, x + width, y + height);
            Paint mPaint = new Paint();
            mPaint.setPathEffect(null);
            canvas.drawRect(r, paint);
            HashMap<String, RectF> item = new HashMap<String, RectF>();
            item.put("" + i, r);
            lines.add(item);
            x+=range;
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {

        if (event.getAction() == MotionEvent.ACTION_UP) {

            for (int i = 0; i < lines.size(); i++) {
                RectF r = lines.get(i).get("" + i);

                if (r.contains(event.getX(), event.getY())) {
                    Toast.makeText(getContext(), "" + (i+1) + " line clicked", Toast.LENGTH_SHORT).show();
                    System.out.println((i+1) + " line clicked");
                    break;
                }
            }
            return false;
        }
        return true;
    }

}