扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
Android开发仿IOS滑动开关实现代码
成都创新互联公司专注于企业营销型网站、网站重做改版、丽水网站定制设计、自适应品牌网站建设、H5技术、商城网站建设、集团公司官网建设、外贸营销网站建设、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为丽水等各大城市提供网站开发制作服务。
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);
}
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网