[Android]仿微信开关按钮:)扁平化简洁风

本文介绍了如何创建一个仿微信风格的开关控件,适用于Android平台。作者发现Android原生开关样式不够美观,于是决定自行设计。通过使用一张小滑块图片并调整背景颜色来实现开关效果,同时分享了实现过程中的一些思考和技巧,包括滑动时背景颜色的变化。项目源代码已上传至GitHub,可供下载和参考。
摘要由CSDN通过智能技术生成

下载地址:https://github.com/ChenSiLiang/Android.git


最近在做界面,发现Android自带的开关控件有点丑,好看的一个还需要比较高的SDK版本。


所以,打算写了一个开关控件。


发现微信的开关比较简洁大方,与Android的扁平风格相宜得章。


抛砖引玉,与君共勉。


思路:

1.使用一张图片作为小滑块,然后以小滑块的双倍长度作为描绘的底部(添加偏移量作为填补缝隙),开和关的背景颜色可以自定义。如果用图片作为底部感觉更加损耗性能,感觉不需要这样做。

2.大家注意到滑动的时候背景的颜色是会根据滑动的距离变化的。这个细节我觉得应该可以只描绘一层底部就可以了。但是因为灰色和绿色的值的转化之间与滑动距离的关系比较难找,鄙人数学基础可差可差了,可耻大一的时候高数没学好。

耍了个小聪明:),描绘了两层,底层是灰色的,第二层是绿色的(最上面是小滑块)。滑动的距离与第二层的透明度成正比关系。这样滑动的时候就可以看见灰色和绿色的转换了。如果有大神请告诉LZ如何用一层实现这个效果。


注释写得比较清楚。


有很多地方当时写的时候没注意容易吃大亏。


public class CsSwitch extends CheckBox {
	/**
	 * 是否打开
	 */
	private boolean mChecked = false;
	/**
	 * 是否正在滑动
	 */
	private boolean mIsMoving = false;
	/**
	 * 是否正在显示动画效果
	 */
	private boolean mAnimating = false;
	/**
	 * 确保开关只激活一次
	 */
	private boolean mBroadcasting = false;
	/**
	 * 底部图片高
	 */
	private int mThumbHeight = 0;
	/**
	 * 画布高度
	 */
	private int mMeasuredHeight = 0;
	/**
	 * 底部图片宽
	 */
	private int mSwtichWidth = 0;
	/**
	 * 小滑块的宽度
	 */
	private int mThumbWidth = 0;
	/**
	 * 点击范围
	 */
	private int mTouchSlop = 0;

	private static final int DEFAULT_HEIGHT = 46;
	/**
	 * 点击事件过时的时间
	 */
	private long mClickTimeout = 0;
	/**
	 * 首次按下的x轴坐标
	 */
	private float mFristDownX = 0;
	/**
	 * 首次按下的Y轴坐标
	 */
	private float mFirstDownY = 0;
	/**
	 * 小滑块的初始位置
	 */
	private float mInitPos = 0;
	/**
	 * 小滑块当前x轴位置
	 */
	private float mCurXPos = 0;
	/**
	 * 小滑块为开时的位置
	 */
	private float mOnPos = 0;
	/**
	 * 小滑块为关时候的位置
	 */
	private float mOffPos = 0;
	/**
	 * 动画的矢量速度
	 */
	private float mAnimatorVelocity = 0;
	/**
	 * 动画位置
	 */
	private float mAnimationPosition = 0;
	/**
	 * 矢量速度
	 */
	private float mVelocity 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值