android开发仿IOS滑动开关

请尊重他人的劳动成果,转载请注明出处:http://blog.csdn.net/sw950729/article/details/52574050
抱歉,最近一直在玩~,博客也不知道写点什么好。落下了点,后期会更上。

android与ios相比,ios好多控件都是自带的,而android需要使用自定义来实现。今天说的是ios的滑动开关,我层看到好多博客都是通过自定义ToggleButton实现的。这里我通过自定义view来实现他的效果。
首先在onsizechange里把2个半圆和一个矩形绘制出来。

        width = w;
        height = h;
        left = top = 0;
        right = width;
        bottom = height * 0.8f;
        cx = (right + left) / 2;
        cy = (bottom + top) / 2;
        RectF rectF = new RectF(left, top, bottom, bottom);
        path.arcTo(rectF, 90, 180);
        rectF.left = right - bottom;
        rectF.right = right;
        path.arcTo(rectF, 270, 180);
        path.close();
        circle_left = 0;
        circle_right = bottom;
        circle_width = circle_right - circle_left;
        float circle_height = (bottom - top) / 2;
        radius = circle_height * 0.9f;
        borderwidth = (int) (2 * (circle_height - radius));
        circle_cx = width - circle_height;

剩下的就是ondraw方法来绘制颜色,以及切换的效果。

 protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paint.setStyle(Style.FILL);
        paint.setAntiAlias(true);
        canvas.setDrawFilter(new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG));
        if (isChoose) {
            paint.setColor(onColor);
        } else {
            paint.setColor(offColor);
        }
        canvas.drawPath(path, paint);
        isAnimation = isAnimation - 0.1f > 0 ? isAnimation - 0.1f : 0;
        //缩放大小参数随isAnimation变化而变化
        final float scale = 0.98f * (isChoose ? isAnimation : 1 - isAnimation);
        //保存canvas状态
        canvas.save();
        canvas.scale(scale, scale, circle_cx, cy);
        paint.setColor(offColor);
        canvas.drawPath(path, paint);
        canvas.restore();
        paint.reset();
        float bTranslateX = width - circle_width;
        final float translate = bTranslateX * (isChoose ? 1 - isAnimation : isAnimation);
        canvas.translate(translate, 0);
        if (isAnimation > 0) {
            invalidate();
        }
        canvas.save();
        paint.setStyle(Style.FILL);
        paint.setColor(offColor);
        canvas.drawCircle(circle_width / 2, circle_width / 2, radius, paint); // 按钮白底
        paint.setStyle(Style.STROKE);
        paint.setColor(borderColor);
        paint.setStrokeWidth(borderwidth);
        canvas.drawCircle(circle_width / 2, circle_width / 2, radius, paint); // 按钮灰边
        canvas.restore();
    }

最后我们在ontouch里面去改变他的状态:


    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                return true;
            case MotionEvent.ACTION_CANCEL:
                return true;
            case MotionEvent.ACTION_UP:
                    isAnimation = 1;
                    isChoose = !isChoose;
                    listener.onStateChanged(isChoose);
                    invalidate();
                break;
        }
        return super.onTouchEvent(event);

    }

好了一个简单的ToggleButton就实现了,我的android交流群:232748032。欢迎进入。

你可能感兴趣的:(android自定义布局)