title: How to draw line between two points, no where else in a layout
body: <p>We want to create a layout similar to a Match the Following.</p>
  
  <p>As of now, we are able to draw a line on the Canvas, but its is getting drawn on the complete layout.</p>
  
  <p>We want to create a line between two points where both are ImageViews. Also, I want that the line shouldn't be drawn anywhere else expect the two points, meaning it should be drawn between only those points. If matched with the correct answer then it should turn green else red...</p>
  
  <p>Following is the code for the same:</p>
  
  <pre><code>        import android.app.Activity;
          import android.content.Context;
          import android.graphics.Bitmap;
          import android.graphics.BitmapFactory;
          import android.graphics.Canvas;
          import android.graphics.Color;
          import android.graphics.Paint;
          import android.graphics.Path;
          import android.graphics.Point;
          import android.graphics.PorterDuff;
          import android.graphics.drawable.Drawable;
          import android.os.Bundle;
          import android.util.DisplayMetrics;
          import android.util.Log;
          import android.view.LayoutInflater;
          import android.view.MotionEvent;
          import android.view.View;
          import android.view.ViewStub;
          import android.widget.Button;
          import android.widget.FrameLayout;
          import android.widget.ImageView;
          import android.widget.ProgressBar;
          import android.widget.TextView;
          import android.widget.Toast;
  
          public class new_sept_1 extends Activity {
  
              TextView tv_name8, tv_activity8, tv_time8, tv_class8;
              Button bt_submit8;
              ProgressBar pb_que8;
              ImageView line_1, line_2, line_3, line_4, drop_1, drop_2,cdrag,cdrop;
              FrameLayout FL;
              // TheSurface sp;
              //DrawView dp;
              DrawPaint dp;
              private Paint mPaint;
  
              @Override
              protected void onCreate(Bundle savedInstanceState) {
                  super.onCreate(savedInstanceState);
                  setContentView(R.layout.layout_8_sept_1);
  
                  //ViewStub Stub = (ViewStub) findViewById(R.id.stub);
                  FL = (FrameLayout) findViewById(R.id.fl_main);
  
                  // LayoutInflater inflater = getLayoutInflater();
                  //View layer1 = inflater.inflate(R.layout.layer_1, null);
  
                  dp = new DrawPaint(this);
                  FL.addView(dp);
                  //  FL.addView(dp);
  
                  mPaint = new Paint();
                  mPaint.setAntiAlias(true);
                  mPaint.setDither(true);
                  mPaint.setColor(Color.BLACK);
                  mPaint.setStyle(Paint.Style.STROKE);
                  //mPaint.setStrokeJoin(Paint.Join.ROUND);
                  //mPaint.setStrokeCap(Paint.Cap.ROUND);
                  mPaint.setStrokeWidth(6);
  
  
                  tv_activity8 = (TextView) findViewById(R.id.tv_activity_8);
                  tv_class8 = (TextView) findViewById(R.id.tv_class8);
                  tv_name8 = (TextView) findViewById(R.id.tv_sept_name8);
                  tv_time8 = (TextView) findViewById(R.id.tv_time_8);
             /*     line_1 = (ImageView) findViewById(R.id.iv_tyre);
                  drop_1 = (ImageView) findViewById(R.id.iv_dropT);
                  line_2 = (ImageView) findViewById(R.id.iv_sugar);
                  drop_2 = (ImageView) findViewById(R.id.iv_drop_2);
                  cdrag = (ImageView)findViewById(R.id.iv_c_tyre);
                  cdrop = (ImageView)findViewById(R.id.iv_cdropT);*/
  
  
                  bt_submit8 = (Button) findViewById(R.id.bt_submit_8_sept_1);
                  pb_que8 = (ProgressBar) findViewById(R.id.pb_que8);
  
  
                  DisplayMetrics displaymetrics = new DisplayMetrics();
                  getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
                  int height = displaymetrics.heightPixels;
                  int width = displaymetrics.widthPixels;
                  Toast.makeText(getApplicationContext(), "height " + height + " width " + width, Toast.LENGTH_SHORT).show();
  
  
  
  
  
  
  
                 /*line_1.setOnClickListener(new View.OnClickListener() {
                      @Override
                      public void onClick(View v) {
                          int[] values = new int[2];
                          v.getLocationOnScreen(values);
                          Log.d("X &amp; Y",values[0]+" "+values[1]);
  
                          //Toast.makeText(getApplicationContext(),"x"+values,Toast.LENGTH_SHORT).show();
  
                          Toast.makeText(getApplicationContext(),"DRAG",Toast.LENGTH_SHORT).show();
                      }
                  });
  
                  drop_1.setOnClickListener(new View.OnClickListener() {
                      @Override
                      public void onClick(View v) {
                          FL.removeView(dp);
  
                          Toast.makeText(getApplicationContext(),"Drop",Toast.LENGTH_SHORT).show();
                      }
                  });*/
                  // FL.removeView(dp);
  
  
              }
  
              public class DrawPaint extends View {
  
                  public int width;
                  public int height;
                  private Bitmap mBitmap;
                  private Canvas mCanvas;
                  private Path mPath;
                  private Paint mBitmapPaint;
                  Context context;
                  private Paint circlePaint;
                  private Path circlePath;
  
                  public DrawPaint(Context c) {
  
  
                      super(c);
                      context = c;
                      mPath = new Path();
                      mBitmapPaint = new Paint(Paint.DITHER_FLAG);
                      circlePaint = new Paint();
                      circlePath = new Path();
                      circlePaint.setAntiAlias(true);
                      circlePaint.setColor(Color.BLACK);
                      circlePaint.setStyle(Paint.Style.STROKE);
                      circlePaint.setStrokeJoin(Paint.Join.MITER);
                      circlePaint.setStrokeWidth(4f);
                  }
  
                  @Override
                  protected void onSizeChanged(int w, int h, int oldw, int oldh) {
                      super.onSizeChanged(w, h, oldw, oldh);
                      mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
                      mCanvas = new Canvas(mBitmap);
                      // Toast.makeText(getApplicationContext(),"new "+w +h +"old"+oldh+oldw,Toast.LENGTH_SHORT).show();
  
  
                  }
  
                  @Override
                  protected void onDraw(Canvas canvas) {
                      super.onDraw(canvas);
  
                      canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
                      canvas.drawPath(mPath, mPaint);
                      canvas.drawPath(circlePath, circlePaint);
  
                      // Toast.makeText(getApplicationContext(),"x y ",Toast.LENGTH_SHORT).show();
                  }
  
                  private float mX, mY;
                  private static final float TOUCH_TOLERANCE = 4;
  
                  private void touch_start(float x, float y) {
                      mPath.reset();
                      mPath.moveTo(x, y);
                      mX = x;
                      mY = y;
  
                  }
  
                  private void touch_move(float x, float y) {
                      float dx = Math.abs(x - mX);
                      float dy = Math.abs(y - mY);
  
                      if (dx &gt;= TOUCH_TOLERANCE || dy &gt;= TOUCH_TOLERANCE) {
                          // mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
  
                          mX = x;
                          mY = y;
  
                          //circlePath.reset();
                          circlePath.addCircle(mX, mY, 1, Path.Direction.CCW);
  
  
                      } else {
                          circlePath.reset();
                      }
                  }
  
                  private void touch_up() {
  
                      // mPath.lineTo(200,310);
  
                      mPath.lineTo(mX, mY);
                      circlePath.reset();
                      mCanvas.drawPath(mPath, mPaint);
                      mCanvas.drawPath(mPath, mPaint);
  
  
                      // mPath = new Path();
                      // Paint.add(mPath);
  
                      // mPath.reset();
                  }
  
                  @Override
                  public boolean onTouchEvent(MotionEvent event) {
                      //int action = event.getAction();
                      // View parentRow = (View) v.getParent();
                      //float x = line_1.getX();
                      //float y = line_1.getY();
  
                      float x = event.getX();
                      float y = event.getY();
  
                      switch (event.getAction()) {
                          case MotionEvent.ACTION_DOWN:
                              touch_start(x, y);
                              invalidate();
                              break;
                          case MotionEvent.ACTION_MOVE:
                              touch_move(x, y);
                              invalidate();
                              break;
                          case MotionEvent.ACTION_UP:
                             /* float x1 = line_1.getX();
                             float y1 = drop_1.getY();*/
                              touch_up();
  
                              invalidate();
                              mPath.reset();
                              circlePath.reset();
                              invalidate();
  
                              //  mPath.moveTo(x1, y1);
                              //mPath.lineTo(20,10);
                              //   mCanvas.drawColor(0, PorterDuff.Mode.CLEAR);
  
                              invalidate();
                              break;
                          case MotionEvent.ACTION_CANCEL:
                              invalidate();
                              break;
                      }
                      return true;
  
  
                  }
  
  
              }
          }
  </code></pre>
  
  <p>Layout XML file</p>
  
  <pre><code>    &lt;?xml version="1.0" encoding="utf-8"?&gt;
                  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                      android:orientation="vertical" android:layout_width="match_parent"
                      android:layout_height="match_parent"&gt;
                      &lt;FrameLayout
                          android:layout_width="match_parent"
                          android:layout_height="wrap_content"
                          android:id="@+id/fm_header8"&gt;
  
                          &lt;ImageView
                              android:layout_width="126dp"
                              android:layout_height="wrap_content"
                              android:id="@+id/imageView8"
                              android:src="@mipmap/ic_launcher"
                              android:layout_gravity="left|center_vertical" /&gt;
  
                          &lt;ImageView
                              android:layout_width="50dp"
                              android:layout_height="36dp"
                              android:id="@+id/iv_student_img8"
                              android:layout_marginRight="70dp"
                              android:src="@mipmap/ic_launcher"
                              android:layout_gravity="right|center_vertical" /&gt;
  
                          &lt;TextView
                              android:layout_width="146dp"
                              android:layout_height="wrap_content"
                              android:text="Name"
                              android:id="@+id/tv_sept_name8"
                              android:layout_marginRight="120dp"
                              android:layout_gravity="right|top"
                              android:textIsSelectable="false"
                              android:textSize="13dp"
                              android:typeface="serif"
                              android:textColor="@color/abc_primary_text_material_light" /&gt;
  
                          &lt;TextView
                              android:layout_width="146dp"
                              android:layout_height="wrap_content"
                              android:text="Class"
                              android:id="@+id/tv_class8"
                              android:layout_marginRight="120dp"
                              android:layout_gravity="right|center_vertical"
                              android:textSize="13dp"
                              android:typeface="serif"
                              android:textColor="@color/abc_primary_text_material_light" /&gt;
  
                          &lt;ProgressBar
                              style="?android:attr/progressBarStyleHorizontal"
                              android:layout_width="161dp"
                              android:layout_height="wrap_content"
                              android:layout_marginRight="70dp"
                              android:id="@+id/pb_que8"
                              android:layout_gravity="center" /&gt;
  
                          &lt;ImageView
                              android:layout_width="47dp"
                              android:layout_height="47dp"
                              android:id="@+id/iv_audio8"
                              android:layout_gravity="right|center_vertical"
                              android:src="@drawable/audio"/&gt;
  
                          &lt;TextView
                              android:layout_width="120dp"
                              android:layout_height="wrap_content"
                              android:text="Activity "
                              android:layout_marginStart="220dp"
                              android:id="@+id/tv_activity_8"
                              android:layout_gravity="center_horizontal|bottom"
                              android:textColor="@color/abc_primary_text_disable_only_material_light"
                              android:textSize="13dp"
                              android:typeface="serif"
                              android:layout_marginRight="120dp" /&gt;
  
                          &lt;TextView
                              android:layout_width="138dp"
                              android:layout_height="wrap_content"
                              android:text="Time"
                              android:layout_marginStart="150dp"
                              android:id="@+id/tv_time_8"
                              android:layout_gravity="left|bottom"
                              android:textColor="@color/abc_primary_text_material_light"
                              android:textSize="13dp"
                              android:typeface="serif" /&gt;
  
                      &lt;/FrameLayout&gt;
  
                      &lt;FrameLayout
                          android:layout_width="match_parent"
                          android:layout_height="match_parent"
                          android:background="@drawable/new_bg"
                          android:id="@+id/ll_main"&gt;
  
                          &lt;TextView
                              android:layout_width="wrap_content"
                              android:layout_height="wrap_content"
                              android:text="Match the product with the plants from which they are obtained"
                              android:id="@+id/tv_que_8"
                              android:layout_gravity="center_horizontal|top"
                              android:layout_marginTop="20dp"
                              android:fontFamily="serif"
                              android:textSize="15dp"
                              android:textColor="@color/abc_primary_text_material_light"
                              android:background="@color/background_material_light" /&gt;
  
                          &lt;Button
  
                              android:layout_width="50dp"
                              android:layout_height="50dp"
                              android:text="submit"
                              android:background="@drawable/gradient_button"
                              android:id="@+id/bt_submit_8_sept_1"
                              android:layout_gravity="right|bottom"
                              android:textColor="@color/abc_primary_text_disable_only_material_light"
                              android:textSize="10dp"
                              android:paddingLeft="0dp"
                              android:paddingEnd="0dp"
                              android:layout_marginRight="2dp"
                              android:layout_marginBottom="2dp" /&gt;
  
  
                          &lt;FrameLayout
                              android:layout_width="match_parent"
                              android:layout_height="match_parent"
                              android:id="@+id/fl_main"&gt;
  
                          &lt;/FrameLayout&gt;
                      &lt;/FrameLayout&gt;
  
                  &lt;/LinearLayout&gt;   
  </code></pre>
  
  <p>Following is the link of what needs to be achieved:</p>
  
  <p><a href="https://i.stack.imgur.com/cNWNs.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cNWNs.jpg" alt="Result"></a></p>