Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android特效專輯(九)——仿微信雷達搜索好友特效,邏輯清晰實現簡單

Android特效專輯(九)——仿微信雷達搜索好友特效,邏輯清晰實現簡單

編輯:關於Android編程

Android特效專輯(九)——仿微信雷達搜索好友特效,邏輯清晰實現簡單

不知不覺這個春節也已經過完了,遺憾家裡沒網,沒能及時給大家送上祝福,今天回到深圳,明天就要上班了,小伙伴們是不是和我一樣呢?今天講的是一個大家都見過的動畫,雷達搜索好友嘛,原理也十分的簡單,你看完我的分析,也會覺得很簡單了,國際慣例,無圖無真相,我們先看看效果圖,對了,真
測試機送人了,所講這段時間應該一直用模擬器顯示吧!

截圖

這裡寫圖片描述

這個界面相信大家都認識,我們來說下原理,其實就三層<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjwvYmxvY2txdW90ZT4NCjxwPjxpbWcgYWx0PQ=="這裡寫圖片描述" src="/uploadfile/Collfiles/20160215/2016021509100782.png" title="\" />

中間是一張圖片,然後畫四個圓,這個應該簡單吧,不會的可以看下Android繪圖機制(二)——自定義View繪制形, 圓形, 三角形, 扇形, 橢圓, 曲線,文字和圖片的坐標講解,然後最上面就是一個漸變的圓了,這個圓我們只要讓他不停的旋轉就可以了,那我們新建一個工程——RadarSearch

這裡寫圖片描述

layou_main.xml



    

    

我們新建一個RadarView

RadarView

package com.lgl.radarsearch;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.Shader;
import android.graphics.SweepGradient;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.View;

/**
 * 雷達搜索
 * 
 * @author LGL
 *
 */
public class RadarView extends View {
    /**
     * 思路:我們首先初始化畫筆,並且獲取到控件的寬高,在onMeasure()中設置鋪滿,然後在onDraw()方法中繪制四個靜態圓和一個漸變圓,
     * 我們通過Matrix矩陣來讓他不停的旋轉就達到我們想要的效果了
     */

    private Paint mPaintLine, mPaintCircle;
    private int w, h;
    // 動畫
    private Matrix matrix;
    // 旋轉角度
    private int start;
    // Handler定時動畫
    private Handler handler = new Handler();
    private Runnable run = new Runnable() {

        @Override
        public void run() {
            start = start + 1;
            matrix = new Matrix();
            // 參數:旋轉角度,圍繞點坐標的x,y坐標點
            matrix.postRotate(start, w / 2, h / 2);
            // 刷新重繪
            RadarView.this.invalidate();
            // 繼續循環
            handler.postDelayed(run, 60);
        }
    };

    public RadarView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
        // 獲取高寬
        w = context.getResources().getDisplayMetrics().widthPixels;
        h = context.getResources().getDisplayMetrics().heightPixels;
        // 一致旋轉
        handler.post(run);
    }

    private void initView() {
        mPaintLine = new Paint();
        mPaintLine.setColor(Color.WHITE);
        mPaintLine.setAntiAlias(true);
        mPaintLine.setStyle(Style.STROKE);

        mPaintCircle = new Paint();
        mPaintCircle.setColor(Color.RED);
        mPaintCircle.setAntiAlias(true);

        matrix = new Matrix();
    }

    /**
     * 測量
     * 
     * @author LGL
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        // 設置鋪滿
        setMeasuredDimension(w, h);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        // 畫四個圓形
        canvas.drawCircle(w / 2, h / 2, w / 2, mPaintLine);
        canvas.drawCircle(w / 2, h / 2, w / 3, mPaintLine);
        canvas.drawCircle(w / 2, h / 2, w * 7 / 10, mPaintLine);
        canvas.drawCircle(w / 2, h / 2, w / 4, mPaintLine);

        // 繪制漸變圓
        Shader mShader = new SweepGradient(w / 2, h / 2, Color.TRANSPARENT,
                Color.parseColor("#AAAAAAAA"));
        // 繪制時漸變
        mPaintCircle.setShader(mShader);
        // 增加旋轉動畫,使用矩陣實現
        canvas.concat(matrix); // 前置動畫
        canvas.drawCircle(w / 2, h / 2, w * 7 / 10, mPaintCircle);

    }
}
  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved