Android滑动图片验证码

滑动图片验证：随着seekbar滑动，view随着动就是了，主要就是图片的比例跟滑块的图片比例

number就是相应的比例

public class SlideImageView extends View {
    Bitmap bitmap;
    Bitmap verifyBitmap;
    Paint paint = new Paint();
    // 拼图的位置
    int y;
    // 移动x坐标
    int moveX;
    // x坐标最大移动长度
    int moveMax;
    private float number;//扩大倍数
    DecimalFormat df = new DecimalFormat("0.0000");

    public SlideImageView(Context context) {
        super(context);
    }

    public SlideImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public SlideImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int width = getMeasuredWidth();
        setMeasuredDimension(width,width/2);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (bitmap == null)
            return;

        moveMax = getWidth();
        int bitmapWidth = bitmap.getWidth();
        int bitmapHeight = bitmap.getHeight();
        //画背景图
        int width = getWidth();
        int height = getHeight();
        number = Float.parseFloat(df.format((float)width/bitmapWidth));
        Bitmap mBitmap = Bitmap.createScaledBitmap(bitmap, width, height, true);
        canvas.drawBitmap(mBitmap, 0, 0, paint);
        //滑块
        int verWidth = (int)(verifyBitmap.getWidth()*number);
        int verHeight = (int)(verifyBitmap.getHeight()*number);
        int verY = (int)(y*number);
        Bitmap mverifyBitmap = Bitmap.createScaledBitmap(verifyBitmap, verWidth, verHeight, true);
        canvas.drawBitmap(mverifyBitmap, moveX, verY, paint);//画验证图片

    }

    public void setImageBitmap(Bitmap bitmap, Bitmap verifyBitmap, int verifyY) {
        this.bitmap = bitmap;
        this.verifyBitmap = verifyBitmap;
        this.y = verifyY;
        invalidate();
    }

    public void setMove(double precent) {
        if (precent < 0 || precent > 1)
            return;

        moveX = (int) (moveMax * precent);
        invalidate();
    }

    public int getMoveX(){
        int x = (int)((float)moveX/number);
        return x;
    }

    public void setReDraw() {
        moveX = 0;
        invalidate();
    }
}

//seekbar动态设置，左侧空白问题

seekBar.setMax(100);
seekBar.setProgressDrawable(context.getResources().getDrawable(R.drawable.seekbar,null));
seekBar.setThumb(context.getResources().getDrawable(R.drawable.circle_jiantou,null));
seekBar.setPadding(0,0,0,0);
seekBar.setThumbOffset(0);

seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener(){

    @Override
    public void onProgressChanged(SeekBar seekBar, int progress,
                                  boolean fromUser) {
        slideImageView.setMove(progress*0.01);
    }

    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {

    }

    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
    }

});
seekBar.setOnTouchListener(new View.OnTouchListener(){

    @SuppressLint("ClickableViewAccessibility")
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch(event.getAction()){
            case MotionEvent.ACTION_DOWN:
                reInit();
                break;
            case MotionEvent.ACTION_UP:
                int moveX = slideImageView.getMoveX();
                //moveX就是滑动的距离，这里已经对屏幕分辨率进行相应的处理
                break;
        }
        return false;
    }

});

滑块箭头资源

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size
                android:width="53dp"
                android:height="53dp" />
            <solid android:color="#fff" />
            <stroke android:color="@color/common_gray" android:width="0.5dp"/>
        </shape>
    </item>
    <item
        android:width="18dp"
        android:height="3dp"
        android:gravity="center"
        android:bottom="11dp"
        >
        <rotate android:fromDegrees="45">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-180"
                    android:endColor="@color/black_666"
                    android:startColor="@color/black_666" />
            </shape>
        </rotate>
    </item>
    <item
        android:width="53dp"
        android:height="53dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:width="18dp"
        android:height="3dp"
        android:gravity="center"
        android:top="11dp"
        >
        <rotate android:fromDegrees="-45">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-90"
                    android:endColor="@color/black_666"
                    android:startColor="@color/black_666" />
            </shape>
        </rotate>
    </item>
</layer-list>

滑块对号资源

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size
                android:width="53dp"
                android:height="53dp" />
            <solid android:color="#fff" />
            <stroke android:color="@color/common_gray" android:width="0.5dp"/>
        </shape>
    </item>
    <item
        android:width="18dp"
        android:height="4dp"
        android:gravity="center"
        android:right="18dp"
        android:top="15dp">
        <rotate android:fromDegrees="40">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-180"
                    android:endColor="@color/green_stroke"
                    android:startColor="@color/green_stroke" />
            </shape>
        </rotate>
    </item>
    <item
        android:width="53dp"
        android:height="53dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:width="32dp"
        android:height="4dp"
        android:gravity="center"
        android:left="12dp"
        android:top="4dp">
        <rotate android:fromDegrees="-50">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-90"
                    android:endColor="@color/green_stroke"
                    android:startColor="@color/green_stroke" />
            </shape>
        </rotate>
    </item>
</layer-list>

滑块叉号资源

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size
                android:width="53dp"
                android:height="53dp" />
            <solid android:color="#fff" />
            <stroke android:color="@color/common_gray" android:width="0.5dp"/>
        </shape>
    </item>
    <item
        android:width="28dp"
        android:height="4dp"
        android:gravity="center"
        >
        <rotate android:fromDegrees="45"
            android:toDegrees="45"
            >
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-180"
                    android:endColor="#E44242"
                    android:startColor="#E44242" />
            </shape>
        </rotate>
    </item>
    <item
        android:width="53dp"
        android:height="53dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:width="28dp"
        android:height="4dp"
        android:gravity="center"
        >
        <rotate android:fromDegrees="-45"
            android:toDegrees="-45"
            >
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-90"
                    android:endColor="@color/red_num"
                    android:startColor="@color/red_num" />
            </shape>
        </rotate>
    </item>
</layer-list>

seekbar滑动进度条资源

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@android:id/background"
        android:height="30dp"
        >
        <shape android:shape="rectangle">
            <corners android:radius="15dp"/>
            <!--  描边颜色  -->
            <stroke android:color="@color/gray_d6"
                android:width="1dp"/>
            <solid android:color="#EDEEF7"/>
        </shape>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="15dp"/>
                <!-- 进度条滑动时填充颜色 -->
                <solid android:color="@color/green_move"/>
                <stroke android:color="@color/green_stroke" android:width="1dp"/>
            </shape>
        </clip>
    </item>


</layer-list>