溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本文實例為大家分享了Android自定義View的實現水波紋，供大家參考，具體內容如下
一、實現效果
MainActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<jt.com.animatorcirecle.myview.DiffuseView
android:id="@+id/diffuseView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
app:diffuse_color="@color/colorAccent"
app:diffuse_coreColor="@color/colorPrimaryDark"
app:diffuse_coreImage="@android:drawable/ic_menu_search"
app:diffuse_coreRadius="100"
app:diffuse_maxWidth="300"
app:diffuse_speed="5"
app:diffuse_width="4"/>
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="開始擴散"/>
<Button
android:id="@+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="停止擴散"/>
</LinearLayout>
MainActivity中的點擊事件
public class MainActivity extends AppCompatActivity {
private Button button;
private Button button2;
private DiffuseView diffuseView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button = findViewById(R.id.button);
button2 = findViewById(R.id.button2);
diffuseView = findViewById(R.id.diffuseView);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
diffuseView.start();
}
});
button2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
diffuseView.stop();
}
});
}
}
自定義view類
public class DiffuseView extends View {
/** 擴散圓圈顏色 */
private int mColor = getResources().getColor(R.color.colorAccent);
/** 圓圈中心顏色 */
private int mCoreColor = getResources().getColor(R.color.colorPrimary);
/** 中心圓半徑 */
private float mCoreRadius = 150;
/** 擴散圓寬度 */
private int mDiffuseWidth = 3;
/** 最大寬度 */
private Integer mMaxWidth = 255;
/** 擴散速度 */
private int mDiffuseSpeed = 5;
/** 是否正在擴散中 */
private boolean mIsDiffuse = false;
// 透明度集合
private List<Integer> mAlphas = new ArrayList<>();
// 擴散圓半徑集合
private List<Integer> mWidths = new ArrayList<>();
private Paint mPaint;
public DiffuseView(Context context) {
this(context, null);
}
public DiffuseView(Context context, AttributeSet attrs) {
this(context, attrs, -1);
}
public DiffuseView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.DiffuseView, defStyleAttr, 0);
mColor = a.getColor(R.styleable.DiffuseView_diffuse_color, mColor);
mCoreColor = a.getColor(R.styleable.DiffuseView_diffuse_coreColor, mCoreColor);
mCoreRadius = a.getFloat(R.styleable.DiffuseView_diffuse_coreRadius, mCoreRadius);
mDiffuseWidth = a.getInt(R.styleable.DiffuseView_diffuse_width, mDiffuseWidth);
mMaxWidth = a.getInt(R.styleable.DiffuseView_diffuse_maxWidth, mMaxWidth);
mDiffuseSpeed = a.getInt(R.styleable.DiffuseView_diffuse_speed, mDiffuseSpeed);
a.recycle();
}
private void init() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mAlphas.add(255);
mWidths.add(0);
}
@Override
public void invalidate() {
if(hasWindowFocus()){
super.invalidate();
}
}
@Override
public void onWindowFocusChanged(boolean hasWindowFocus) {
super.onWindowFocusChanged(hasWindowFocus);
if(hasWindowFocus){
invalidate();
}
}
@Override
public void onDraw(Canvas canvas) {
// 繪制擴散圓
mPaint.setColor(mColor);
for (int i = 0; i < mAlphas.size(); i ++) {
// 設置透明度
Integer alpha = mAlphas.get(i);
mPaint.setAlpha(alpha);
// 繪制擴散圓
Integer width = mWidths.get(i);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, mCoreRadius + width, mPaint);
if(alpha > 0 && width < mMaxWidth){
mAlphas.set(i, alpha - mDiffuseSpeed > 0 ? alpha - mDiffuseSpeed : 1);
mWidths.set(i, width + mDiffuseSpeed);
}
}
// 判斷當擴散圓擴散到指定寬度時添加新擴散圓
if (mWidths.get(mWidths.size() - 1) >= mMaxWidth / mDiffuseWidth) {
mAlphas.add(255);
mWidths.add(0);
}
// 超過10個擴散圓，刪除最外層
if(mWidths.size() >= 10){
mWidths.remove(0);
mAlphas.remove(0);
}
// 繪制中心圓
mPaint.setAlpha(255);
mPaint.setColor(mCoreColor);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, mCoreRadius, mPaint);
if(mIsDiffuse){
invalidate();
}
}
/**
* 開始擴散
*/
public void start() {
mIsDiffuse = true;
invalidate();
}
/**
* 停止擴散
*/
public void stop() {
mIsDiffuse = false;
mWidths.clear();
mAlphas.clear();
mAlphas.add(255);
mWidths.add(0);
invalidate();
}
/**
* 是否擴散中
*/
public boolean isDiffuse(){
return mIsDiffuse;
}
/**
* 設置擴散圓顏色
*/
public void setColor(int colorId){
mColor = colorId;
}
/**
* 設置中心圓顏色
*/
public void setCoreColor(int colorId){
mCoreColor = colorId;
}
/**
* 設置中心圓半徑
*/
public void setCoreRadius(int radius){
mCoreRadius = radius;
}
/**
* 設置擴散圓寬度(值越小寬度越大)
*/
public void setDiffuseWidth(int width){
mDiffuseWidth = width;
}
/**
* 設置最大寬度
*/
public void setMaxWidth(int maxWidth){
mMaxWidth = maxWidth;
}
/**
* 設置擴散速度，值越大速度越快
*/
public void setDiffuseSpeed(int speed){
mDiffuseSpeed = speed;
}
}
自己添加的attrs.xml(創建在Values包底下,切勿倒錯)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--擴散圓顏色-->
<attr name="diffuse_color" format="color"/>
<!--中心圓顏色-->
<attr name="diffuse_coreColor" format="color"/>
<!--中心圓圖片-->
<attr name="diffuse_coreImage" format="reference"/>
<!--中心圓半徑-->
<attr name="diffuse_coreRadius" format="float"/>
<!--擴散圓寬度,值越小越寬-->
<attr name="diffuse_width" format="integer"/>
<!--最大擴散寬度-->
<attr name="diffuse_maxWidth" format="integer"/>
<!--擴散速度，值越大越快-->
<attr name="diffuse_speed" format="integer"/>
<declare-styleable name="DiffuseView">
<attr name="diffuse_color"/>
<attr name="diffuse_coreColor"/>
<attr name="diffuse_coreImage"/>
<attr name="diffuse_coreRadius"/>
<attr name="diffuse_width"/>
<attr name="diffuse_maxWidth"/>
<attr name="diffuse_speed"/>
</declare-styleable>
</resources>
這樣就搞定了。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
