使用 Android 个图形在 Paint 中绘制图形
Drawing a graph in Paint with Android graphics
我正在尝试使用 canvas 在视图上绘制图表。到目前为止,它绘制正确,如下图所示:
Desired Output
一旦您点击屏幕,预期的结果应该会清除屏幕并绘制一个新图形,而是在它上面绘制,从而导致:
Actual Output
private List<Float> xPosList, yPosList;
private List<Path> pathList;
private Path path;
private Paint paint;
private final Paint clearPaint = new Paint();
public Plotter(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
this.xPosList = new ArrayList<>();
this.yPosList = new ArrayList<>();
this.pathList = new ArrayList<>();
this.paint = new Paint();
this.paint.setStrokeWidth(20);
this.paint.setColor(Color.GREEN);
this.clearPaint.setColor(Color.BLACK);
generateData();
}
private void generateData() {
int min = 5;
int max = 100;
double random = 0;
float xPos = 0;
float yPos = 0;
for (int i = 1; i <= 20; i++) {
random = min + Math.random() * (max - min);
xPos = 50 * i; //50 pixels
yPos = (float)random;
this.xPosList.add(xPos);
this.yPosList.add(yPos);
path = new Path(); //Create path
path.moveTo(xPos, yPos); //Add values to path
this.pathList.add(path); //Add path to pathList
}
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
generateData();
break;
case MotionEvent.ACTION_UP:
//invalidate();
break;
}
//invalidate(); //Refresh canvas
return true; //Activate event
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint p = new Paint();
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
p.setColor(Color.GREEN);
p.setStrokeWidth(10);
p.setStyle(Paint.Style.FILL);
/***
* Better use 50 by 50 pixels
*/
float startX = 0;
float startY = canvas.getHeight(); //Start at the bottom (max height)
float nextX = 0;
float nextY = 0;
for (int i = 0; i < this.xPosList.size(); i++){
nextX = this.xPosList.get(i);
nextY = canvas.getHeight() - (this.yPosList.get(i) * 10); //Add 50 offset
canvas.drawLine(startX, startY, nextX, nextY, p);
startX = nextX;
startY = nextY;
}
}
}
如何正确清除屏幕?
我试过了
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
从其他问题上看到的,但是不行。
实际上它与您的清除颜色没有任何关系 - 屏幕被正确清除。问题是 xPosList
和 yPosList
ArrayList.
只要用户点击屏幕,就会调用 generateData()
函数,该函数会不断向两个 ArrayList 添加元素。但是:你永远不会清除那些!因此,只要您点击屏幕两次,ArrayList 就会包含来自第一次和第二次点击的随机数据。
您需要在 for-loop:
之前清除那些
this.xPosList.clear();
this.yPosList.clear();
for (int i = 1; i <= 20; i++) {
random = min + Math.random() * (max - min);
xPos = 50 * i; //50 pixels
yPos = (float)random;
this.xPosList.add(xPos);
this.yPosList.add(yPos);
path = new Path(); //Create path
path.moveTo(xPos, yPos); //Add values to path
this.pathList.add(path); //Add path to pathList
}
我正在尝试使用 canvas 在视图上绘制图表。到目前为止,它绘制正确,如下图所示:
Desired Output
一旦您点击屏幕,预期的结果应该会清除屏幕并绘制一个新图形,而是在它上面绘制,从而导致:
Actual Output
private List<Float> xPosList, yPosList;
private List<Path> pathList;
private Path path;
private Paint paint;
private final Paint clearPaint = new Paint();
public Plotter(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
this.xPosList = new ArrayList<>();
this.yPosList = new ArrayList<>();
this.pathList = new ArrayList<>();
this.paint = new Paint();
this.paint.setStrokeWidth(20);
this.paint.setColor(Color.GREEN);
this.clearPaint.setColor(Color.BLACK);
generateData();
}
private void generateData() {
int min = 5;
int max = 100;
double random = 0;
float xPos = 0;
float yPos = 0;
for (int i = 1; i <= 20; i++) {
random = min + Math.random() * (max - min);
xPos = 50 * i; //50 pixels
yPos = (float)random;
this.xPosList.add(xPos);
this.yPosList.add(yPos);
path = new Path(); //Create path
path.moveTo(xPos, yPos); //Add values to path
this.pathList.add(path); //Add path to pathList
}
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
generateData();
break;
case MotionEvent.ACTION_UP:
//invalidate();
break;
}
//invalidate(); //Refresh canvas
return true; //Activate event
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint p = new Paint();
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
p.setColor(Color.GREEN);
p.setStrokeWidth(10);
p.setStyle(Paint.Style.FILL);
/***
* Better use 50 by 50 pixels
*/
float startX = 0;
float startY = canvas.getHeight(); //Start at the bottom (max height)
float nextX = 0;
float nextY = 0;
for (int i = 0; i < this.xPosList.size(); i++){
nextX = this.xPosList.get(i);
nextY = canvas.getHeight() - (this.yPosList.get(i) * 10); //Add 50 offset
canvas.drawLine(startX, startY, nextX, nextY, p);
startX = nextX;
startY = nextY;
}
}
}
如何正确清除屏幕?
我试过了
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
从其他问题上看到的,但是不行。
实际上它与您的清除颜色没有任何关系 - 屏幕被正确清除。问题是 xPosList
和 yPosList
ArrayList.
只要用户点击屏幕,就会调用 generateData()
函数,该函数会不断向两个 ArrayList 添加元素。但是:你永远不会清除那些!因此,只要您点击屏幕两次,ArrayList 就会包含来自第一次和第二次点击的随机数据。
您需要在 for-loop:
之前清除那些this.xPosList.clear();
this.yPosList.clear();
for (int i = 1; i <= 20; i++) {
random = min + Math.random() * (max - min);
xPos = 50 * i; //50 pixels
yPos = (float)random;
this.xPosList.add(xPos);
this.yPosList.add(yPos);
path = new Path(); //Create path
path.moveTo(xPos, yPos); //Add values to path
this.pathList.add(path); //Add path to pathList
}