布局按钮
<Button
android:id="@+id/btn1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="水波纹View"
/>
选择跳转MainActivity
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViewById(R.id.btn1).setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.btn1:
Intent intent = new Intent(MainActivity.this,WatorActivity.class);
startActivity(intent);
break;
}
}
自定义一个View,实现继承方法onDraw进行绘制
package com.example.appview1.veiw;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
/*
View
*自定义水波纹
* //1、moveTo
//moveTo 不会进行绘制,只用于移动移动画笔。
//2、lineTo
//lineTo 用于进行直线绘制。
* */
public class WatorView extends View {
private Callback callback;
private Paint mpaint;
private Path path;
private float mx;
public WatorView(Context context) {
super(context);
//初始化
init(context);
}
public WatorView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init(context);
}
//初始换画笔,路径
private void init(Context context) {
//创建一个画笔
mpaint = new Paint();
//设置颜色为红色
mpaint.setColor(Color.RED);
//设置画笔的粗细
mpaint.setStrokeWidth(5);
//设置抗锯齿
mpaint.setAntiAlias(true);
//接下来初始化路径
path = new Path();
//接下来进行绘制
}
//绘制
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//让路径重置
path.reset();
//记录起始位置,从左向右在从底部向上来进行波动
path.moveTo(getLeft(),getBottom());
//记录波动的位置Math函数*Pl是180度在诚意2为360度再除以getRight等于每一个宽度值所在的位置
float mpi= (float) (Math.PI*3/getRight());//每一个宽度值所站的度数
//定义一个值每次都减一个值
mx -=0.1f;
//如果要实现波动那么一定要便利以下宽度然后一点一点进行波动
for(int x=0;x<=getRight();x+=20){
//得到从左向右波动x的坐标获取xy/运用函数进行波动再通过每个宽度值所站的度数乘以加上的波动
//path.lineTo(x, (float) (10*Math.sin(mpi*x-mx)+10));
float y=(float) (10*Math.sin(mpi*x+mx)+10);
path.lineTo(x,y);
if (callback!=null){
callback.Callback(y);
}
}
//记录结束位置
path.lineTo(getRight(),getBottom());
//接下来通过canvas进行绘制路径path,绘制的颜色与粗细mpaint
canvas.drawPath(path,mpaint);
//定时刷新
postInvalidateDelayed(20);
}
public void setCallback(Callback callback){
this.callback=callback;
}
//利用接口回调将水波纹上下波动的度数回传给acyivity
public interface Callback{
void Callback( float y);
}
}
布局实现自定义view
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
>
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher_round"
/>
</RelativeLayout>
<com.example.appview1.veiw.WatorView
android:id="@+id/WatorView1"
android:layout_width="wrap_content"
android:layout_height="20dp">
</com.example.appview1.veiw.WatorView>
水波纹对应的Activity接口回调设置图片波动
package com.example.appview1.activiy;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import com.example.appview1.R;
import com.example.appview1.veiw.WatorView;
public class WatorActivity extends AppCompatActivity {
private ImageView image;
private WatorView mWatorView1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_wator);
image = findViewById(R.id.image);
mWatorView1 = findViewById(R.id.WatorView1);
mWatorView1.setCallback(new WatorView.Callback() {
@Override
public void Callback(float y) {
RelativeLayout.LayoutParams params= (RelativeLayout.LayoutParams) image.getLayoutParams();
params.setMargins(0,(int)y,0,0);
image.setLayoutParams(params);
}
});
}
}