1.效果圖

GIF.gif

2.具體實(shí)現(xiàn)代碼

繪制這個(gè)扇形和弧線，首先需要去創(chuàng)建一個(gè)自定義的view重寫(xiě)它的onDraw()方法，在繪制之前可以在view創(chuàng)建的時(shí)候先將畫(huà)筆初始化出來(lái)。

具體的難點(diǎn)在于第二步如何動(dòng)態(tài)去繪制，可以定義一個(gè)具體的數(shù)值比如 shouldExistSignalSize 來(lái)控制每次繪制的時(shí)候繪制哪個(gè)信號(hào)，從最開(kāi)始的時(shí)候只繪制第一個(gè)信號(hào)（也就是扇形），接著第二次繪制的時(shí)候需要繪制第一個(gè)和第二個(gè)信號(hào)，往后就是第一個(gè)信號(hào)，第二個(gè)信號(hào)，第三個(gè)信號(hào)；當(dāng)四格信號(hào)都繪制完畢的時(shí)候記得將 shouldExistSignalSize 重置。

package cc.willread.www.viewapp;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.os.Handler;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

public class WIFIView extends View {
    public WIFIView(Context context) {
        this(context, null);
    }

    public WIFIView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public WIFIView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private Paint paint;
    /**
     * 初始化準(zhǔn)備
     */
    private void init() {
        paint = new Paint();
        //畫(huà)筆顏色
        paint.setColor(Color.BLACK);
        //畫(huà)筆粗細(xì)
        paint.setStrokeWidth(6);
        //抗鋸齒
        paint.setAntiAlias(true);

    }


    /**WIFI控件寬高較小一邊的長(zhǎng)度*/
    private int wifiLength;
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        wifiLength = Math.min(w, h);
    }

    /**
     * 開(kāi)始角度
     */
    private float startAngle = -135;
    /**
     * 扇形或者弧的旋轉(zhuǎn)角度
     */
    private float sweepAngle = 90;
    /**
     * 信號(hào)大小，默認(rèn)4格
     */
    private int signalSize = 4;

    /**每次應(yīng)該繪制的信號(hào)個(gè)數(shù)*/
    private float shouldExistSignalSize = 0f;

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        shouldExistSignalSize++;
        if(shouldExistSignalSize>4){
            shouldExistSignalSize=1;
        }
        canvas.save();
        //計(jì)算最小的扇形信號(hào)所在的圓的半徑
        float signalRadius = wifiLength/2/signalSize;
        //向下平移畫(huà)布,保證繪制的圖形能夠完全顯示
        canvas.translate(0,signalRadius);
        for (int i = 0; i < signalSize; i++) {
            if(i>=signalSize-shouldExistSignalSize) {
                //定義每個(gè)信號(hào)所在圓的半徑
                float radius = signalRadius * i;
                RectF rectf = new RectF(radius, radius, wifiLength - radius, wifiLength - radius);
                if (i < signalSize - 1) {
                    paint.setStyle(Paint.Style.STROKE);
                    canvas.drawArc(rectf, startAngle, sweepAngle, false, paint);
                } else {
                    paint.setStyle(Paint.Style.FILL);
                    canvas.drawArc(rectf, startAngle, sweepAngle, true, paint);
                }
            }
        }
        canvas.restore();

        if(!isDetached) {
            try {
                Thread.sleep(500);
                invalidate();
            } catch (InterruptedException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
    }
    /**
     * 自定義控件是否脫離窗體
     */
    private boolean isDetached;

    /**
     * 當(dāng)自定義控件脫離窗體，即將銷(xiāo)毀
     */
    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        isDetached = true;
    }
}

3.添加自定義view

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
    tools:context=".MainActivity">

    <cc.willread.www.viewapp.WIFIView
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</android.support.constraint.ConstraintLayout>

https://www.willread.cc/p/5be507828a71a