在Android开发中,我们的UI设计师可能会设计出一些比较比较炫酷或者个性的效果然后需要我们来实现,今天给大家分享一个使用Android自定义控件实现的水波纹效果。
废话不多说,我们直接来看一下效果图:
效果图已经看到了,这个控件主要是实现给定一个百分比的值,然后就可以自动绘制水位不断上涨直到达到给定的值。同时提供了几个方法(开始、暂停和重置)和一个接口(通过设置这个接口,在百分比的值发生变化时,可以实时获取到当前绘制的比例)。
在这里我只贴出一部分代码,所有的代码已经上传,CSDN下载 GitHub下载
首先是构造方法:
public WaveView(Context context) {
this(context, null);
}
public WaveView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public WaveView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initAttrs(context, attrs); // 获取布局文件中定义的属性
init();
}
提供了三个构造方法,可以在布局文件中声明控件,也可以在代码中创建控件;
下面的方法是获取布局文件中的属性的方法:
private void initAttrs(Context context, AttributeSet attrs) {
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.WaveView);
mWaveLenght1 = typedArray.getInteger(R.styleable.WaveView_wave1Length, WAVE_LENGTH1);
mWaveHeight1 = typedArray.getInteger(R.styleable.WaveView_wave1Height, WAVE_HEIGHT1);
mWaveColor1 = typedArray.getColor(R.styleable.WaveView_wave1Color, WAVE_COLOR1);
mOffset1 = typedArray.getInteger(R.styleable.WaveView_wave1Offset, WAVE_OFFSET1);
mWaveLenght2 = typedArray.getInteger(R.styleable.WaveView_wave2Length, WAVE_LENGTH2);
mWaveHeight2 = typedArray.getInteger(R.styleable.WaveView_wave2Height, WAVE_HEIGHT2);
mWaveColor2 = typedArray.getColor(R.styleable.WaveView_wave2Color, WAVE_COLOR2);
mOffset2 = typedArray.getInteger(R.styleable.WaveView_wave2Offset, WAVE_OFFSET2);
mBorderWidth = typedArray.getDimensionPixelSize(R.styleable.WaveView_borderWidth, BORDER_WIDTH);
mBorderColor = typedArray.getColor(R.styleable.WaveView_borderColor, BORDER_COLOR);
mTextSize = typedArray.getDimensionPixelSize(R.styleable.WaveView_textSize, DEFAULT_TEXT_SIZE);
mTextColor = ty