zoukankan      html  css  js  c++  java
  • Android 实现在ImageView上绘图

    参考博客:https://www.cnblogs.com/hao-dotnet/p/3269149.html
    代码很简单,参考博客中有些错误已改正。

    step1:新建ViewPoint类

    该类用于存放点坐标,就是手指接触ImageView并移动时的坐标

    package com.example.handwritingimageview;
    
    public class ViewPoint {
        float x;
        float y;
    }
    
    

    step2:新建Line类

    顾名思义,该类存放点的集合,即一条线

    //表示一条线
    public class Line {
        ArrayList<ViewPoint> points = new ArrayList<>();
    }
    

    step3:编写HandWritingImageView类

    该类继承AppCompatImageView,先重写父类构造器,再重写onTouchEvent和onDraw方法,在onTouchEvent方法中多次使用了 invalidate()这个方法,这个方法是用来触发onDraw方方法进行画图。

    package com.example.handwritingimageview;
    
    import android.content.Context;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    import android.util.AttributeSet;
    import android.util.Log;
    import android.view.MotionEvent;
    import android.widget.ImageView;
    
    
    import androidx.appcompat.widget.AppCompatImageView;
    import androidx.core.widget.ImageViewCompat;
    
    import java.util.ArrayList;
    
    
    public class HandWritingImageView extends AppCompatImageView {
        private Paint paint = new Paint();
    
        //当前正在画的线
        private Line current = new Line();
    
        public HandWritingImageView(Context context) {
            super(context);
        }
    
        public HandWritingImageView(Context context, AttributeSet attrs) {
            super(context, attrs);
        }
    
        public HandWritingImageView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
        }
    
        //画过的所有线
        private ArrayList<Line> lines = new ArrayList<Line>();
    
        @Override
        public boolean onTouchEvent(MotionEvent event) {
            //获取坐标
            float clickX = event.getX();
            float clickY = event.getY();
    
            if (event.getAction() == MotionEvent.ACTION_DOWN) {
                //刷新屏幕
                invalidate();
                return true;
            }else if (event.getAction() == MotionEvent.ACTION_MOVE){
                ViewPoint point = new ViewPoint();
                point.x = clickX;
                point.y = clickY;
                Log.d("444", "clickX: "+clickX);
                Log.d("444", "clickY: "+clickY);
                //在移动时添加所有经过的点
                current.points.add(point);
                Log.d("222", "current.points.size(): "+current.points.size());
    
                invalidate();
                return true;
            }else if (event.getAction() == MotionEvent.ACTION_UP){
                //添加画过的线
                lines.add(current);
                Log.d("222", "lines.size(): "+lines.size());
                current = new Line();
                invalidate();
            }
            return super.onTouchEvent(event);
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
            //画出之前所有的线
            for (int i = 0; i < lines.size(); i++)
            {
                drawLine(canvas, lines.get(i));
            }
    
            //画出当前的线
            drawLine(canvas, current);
        }
    
        private void drawLine(Canvas canvas, Line line)
        {
            for(int i = 0; i < line.points.size()-1; i++){
                float x = line.points.get(i).x;
                float y = line.points.get(i).y;
                float nextX = line.points.get(i+1).x;
                float nextY = line.points.get(i+1).y;
                canvas.drawLine(x,y,nextX,nextY,paint);
            }
        }
    }
    

    step4:编写xml

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.example.handwritingimageview.HandWritingImageView
            android:id="@+id/im_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>
    

    效果图

    在这里插入图片描述

  • 相关阅读:
    Java自学-数字与字符串 字符串
    Java自学-数字与字符串 格式化输出
    Java自学-数字与字符串 数学方法
    Java自学-数字与字符串 字符串转换
    Java自学-数字与字符串 装箱和拆箱
    Java自学-接口与继承 UML图
    Mysql优化系列之查询优化干货1
    Mysql优化系列之查询性能优化前篇3(必须知道的几个事实)
    Mysql优化系列之查询性能优化前篇2
    第二十二篇:Spring简单定时任务
  • 原文地址:https://www.cnblogs.com/PythonFCG/p/13860122.html
Copyright © 2011-2022 走看看