1. MainActivity extends AppCompatActivity
实现图片的添加封装
image.png
image.png
详细代码
public class MainActivity extends AppCompatActivity {
// ArrayList<ImageView> dotlist;
float padding;
RelativeLayout rl;
ArrayList<ImageView> dotViews;
DrawView drawView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//创建正常的点
initNineDot(R.drawable.normal,View.VISIBLE);
//添加一层视图
DrawView();
//创建点亮的点
initNineDot(R.drawable.selected,View.INVISIBLE);
//将所有点的数组传递给DrawView
drawView.setDotViews(dotViews);
}
private void DrawView(){
drawView = new DrawView(this);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
rl.addView(drawView, params);
}
private void initNineDot(int res,int visible){
rl = findViewById(R.id.parent);
dotViews = new ArrayList<>();
//确定左右间距大小
padding = piexlFromDp(50);
//计算两个点中心点之间的间距
//得到屏幕宽度
Point p = new Point();
getWindowManager().getDefaultDisplay().getSize(p);
//获取图片
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.normal);
float space = (p.x - 2 * padding - bitmap.getWidth()) / 2;
//确定第一个点的x,y
float x = padding;
float y = p.y / 2 - space - bitmap.getHeight();
//使用for循环快速添加九个点
for (int i = 0; i < 3; i++){
for(int j = 0; j < 3; j++){
//调用函数添加图片
creatDot(res,(int) (x + space * j),(int) (y + space * i),visible);
}
}
}
//将添加图片的功能进行封装
private void creatDot(int res,int left,int top,int visible){
//创建图片视图
ImageView iv = new ImageView(this);
iv.setBackgroundResource(res);
iv.setVisibility(visible);
//创建容器
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.leftMargin = left;
params.topMargin = top;
//添加视图
rl.addView(iv,params);
//判断res对应的是否为selected
if (res == R.drawable.selected){
dotViews.add(iv);
}
}
//计算dp对应的像素值
private float piexlFromDp(int size){
//获取屏幕的密度
return size * getResources().getDisplayMetrics().density;
}
}
2. DrawView extends View
实行主要功能划线
详细代码
public class DrawView extends View {
private ArrayList<ImageView> dotViews;
private Point startPoint;
private Point endPoint;
private Paint mPaint;
private ArrayList<Path>paths;
private ArrayList<ImageView> selected;
public DrawView(Context context) {
super(context);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setColor(Color.WHITE);
mPaint.setStrokeWidth(20);
mPaint.setStyle(Paint.Style.STROKE);
paths = new ArrayList<>();
selected=new ArrayList<>();
}
public void setDotViews(ArrayList<ImageView> dotViews) {
this.dotViews = dotViews;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
ImageView dot;
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
dot = viewContainedPoint(x,y);
if (dot != null){
dot.setVisibility(VISIBLE);
//设置起始点
startPoint = new Point((int)(dot.getPivotX() + dot.getX()),
(int)(dot.getPivotY() + dot.getY()));
}
break;
case MotionEvent.ACTION_MOVE:
dot = viewContainedPoint(x,y);
if (dot == null){
//划线
endPoint = new Point((int)x,(int)y);
//刷新
invalidate();
}else {
//判断是第一个点还是其他
if(startPoint==null){
dot.setVisibility(VISIBLE);
//设置起始点
startPoint = new Point((int)(dot.getPivotX() + dot.getX()),
(int)(dot.getPivotY() + dot.getY()));
}else{
//点亮点
dot.setVisibility(VISIBLE);
//在之前和现在的点之间产生一个path
Path path=new Path();
path.moveTo(startPoint.x,startPoint.y);
path.lineTo(dot.getPivotX() + dot.getX(),
dot.getPivotY() + dot.getY());
paths.add(path);
//当前这个这个点就是起始点
//设置起始点
startPoint = new Point((int)(dot.getPivotX() + dot.getX()),
(int)(dot.getPivotY() + dot.getY()));
endPoint=startPoint;
//刷新
invalidate();
}
selected.add(dot);
}
break;
case MotionEvent.ACTION_UP:
clear();
break;
}
return true;
}
@Override
protected void onDraw(Canvas canvas) {
if (paths.size() > 0){
for (Path path: paths){
canvas.drawPath(path, mPaint);
}
}
if (startPoint != null && endPoint != null) {
canvas.drawLine(startPoint.x, startPoint.y,
endPoint.x, endPoint.y, mPaint);
}
}
private void clear(){
for (ImageView dot: selected)
{ dot.setVisibility(INVISIBLE);
} selected.clear();
paths.clear();
startPoint = null;
endPoint = null;
invalidate();
}
//判断触摸点是否在某个dot里面
private ImageView viewContainedPoint(float x,float y){
for (ImageView dot: dotViews){
int[] point = new int[2];
dot.getLocationOnScreen(point);
//获取dot的x和y坐标
//int px = point[0];
//int py = point[1];
int px = (int) dot.getX();
int py = (int) dot.getY();
if ((x >= px && x <= px + dot.getWidth())
&&(y >= py && y <= py +dot.getHeight())){
return dot;
}
}
return null;
}
}
3.xml配置
很基础
image.png
