先上效果图: PS:gif可能看起来有点卡,这是通病,哈哈哈。。。 该篇博客将的是下面绿色的效果,废话不多说,直接上代码!
public class ScanView extends View { private Paint mPaint; private int scanTop;//开始扫描点 private int scanSpeed;//扫描的速度 private boolean isStart;
public ScanView(Context context) { this(context, null); } public ScanView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ScanView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { mPaint = new Paint(); mPaint.setAntiAlias(true); mPaint.setColor(Color.BLUE); scanTop = 0; scanSpeed = 2; } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.drawColor(Color.GREEN); canvas.drawRect(0,scanTop, getRight(), scanTop + 10, mPaint); if(isStart){ scanTop += scanSpeed; if(scanTop >= getHeight()){ scanTop = 0; } invalidate(); } } public void startScan(){ isStart = true; invalidate(); }}
原理:其实很简单——就是简单下移,通过不断修改top的值来进行扫描的,所以这篇文章叫《简单直线扫描效果》,我这里是画的Rect来当做直线使用进行扫描的,个人感觉这样方便点,也可以用bitmap来做扫描线的(用过zxing的都知道)。
写这篇博客的原因是做个记录,以方便实现图中上面的效果,后面会写上面的自定义View实现的过程。
如有问题,请指出,万分感谢!