Draw line continuously using Canvas in Android
I am using canvas for continuous line drawing. I will draw a line in a relative layout. For a static line, I did. In a real case, I will receive data from the sensor. So I don't know how to draw the line continuously like below. Could you please suggest me an algorithm for this. Thank you so much. This is my code
//XML file
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<RelativeLayout
android:id="@+id/canvas"
android:layout_width="match_parent"
android:layout_height="140dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_weight="1"
android:background="#d3d3d3" >
</RelativeLayout>
</RelativeLayout>
This is my code for a static string
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.View;
import android.widget.RelativeLayout;
public class MainActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//setContentView(new HeartGraphView (this));
setContentView(R.layout.activity_main);
RelativeLayout relativeLayout=(RelativeLayout)findViewById(R.id.canvas);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,RelativeLayout.LayoutParams.FILL_PARENT);
HeartGraphView v = new HeartGraphView(this);
v.setLayoutParams(lp);
relativeLayout.addView(v);
}
public class HeartGraphView extends View {
public HeartGraphView (Context context) {
super(context);
// TODO Auto-generated constructor stub
}
int[] dataX=new int[30];
int[] dataY=new int[30];
public int generatRandomPositiveNegitiveValue(int max , int min) {
Random r = new Random();
int ii = r.nextInt(max - min + 1) + min;
return (ii-140);
}
int[] dataX=new int[30];
int[] dataY=new int[30];
public int generatRandomPositiveNegitiveValue(int max , int min) {
Random r = new Random();
int ii = r.nextInt(max - min + 1) + min;
return (ii-140);
}
@Override
public void onDraw (Canvas canvas) {
int w;
int h;
h=280;
w=600;
//Generate random
int min = 0;
int max = 280;
Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setStrokeWidth(6);
dataX[0]=0;
for (int i = 0; i < w/20 - 1; i++) {
dataX[i+1]=(i+1)*w/20;
dataY[w/20 - 1]=generatRandomPositiveNegitiveValue(max ,min);
dataY[i]=dataY[i+1];
}
for (int i = 0; i < w/20 -1; i++) {
// apply some transformation on data in order to map it correctly
// in the coordinates of the canvas
canvas.drawLine(dataX[i], h/2-dataY[i], dataX[i+1], h/2-dataY[i+1],paint);
canvas.drawColor(Color.TRANSPARENT, Mode.MULTIPLY);
try {
Thread.sleep(10);
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
invalidate();
}
}
}
} This is my result
EDIT> As suggested by Frank N. Stay. I change something: + First, the initial all elements of the X-axis with fixed values [0,30,60,90 ....] and the Y-axis are zero
int w=600;
for (int i = 0; i < w/20 - 1; i++) {
dataX[i]=i*w/20;
dataY[i]=0;
}
+ Secondly, with the new value coming Y, we put it at the end of the dataY array and remove the first position:
for (int i = 0; i < w/20 - 1; i++) {
dataY[i]=dataY[i+1];
}
dataY[w/20 - 1]=newValue;
+ Third, redraw dataX and dataY Is this correct?
source to share
No one has answered this question yet
Check out similar questions: