Android 粒子爆炸 煙花效果

最近項目上線完樟遣,正好有空搞點新花樣而叼,記得有個粒子爆炸效果,一直沒弄過豹悬,現(xiàn)在正好擼一下葵陵。。瞻佛。

下面先看一下實現(xiàn)效果:


20200527203126.gif

當(dāng)手指在屏幕上按下脱篙,會生成隨機顏色的粒子,然后向上移動伤柄,在高處爆炸绊困,看上去就像放煙花一樣,還挺好看适刀。秤朗。。笔喉。取视。

現(xiàn)在開始說一下實現(xiàn)流程:
一.每一個粒子都是一個實體,有自己的屬性常挚,所以需要定義一個實體類:

/**
 * 上升粒子
 */
public class ParticalBean {
    //畫筆
    private Paint paint;
    //x位置
    private int x;
    //y位置
    private int y;
    //速率
    private int speed;
    //移動距離
    private int distance;
    //是否爆炸
    private boolean isBoom;
    //爆炸后粒子數(shù)據(jù)
    private List<BoomParicalBean> boomParicalBeans;

    public ParticalBean(Paint paint, int x, int y, int speed, int distance) {
        this.paint = paint;
        this.x = x;
        this.y = y;
        this.speed = speed;
        this.distance = distance;
    }

    public Paint getPaint() {
        return paint;
    }

    public void setPaint(Paint paint) {
        this.paint = paint;
    }

    public int getDistance() {
        return distance;
    }

    public void setDistance(int distance) {
        this.distance = distance;
    }

    public int getX() {
        return x;
    }

    public void setX(int x) {
        this.x = x;
    }

    public int getY() {
        return y;
    }

    public void setY(int y) {
        this.y = y;
    }

    public int getSpeed() {
        return speed;
    }

    public void setSpeed(int speed) {
        this.speed = speed;
    }

    public boolean isBoom() {
        return isBoom;
    }

    public void setBoom(boolean boom) {
        isBoom = boom;
    }

    public List<BoomParicalBean> getBoomParicalBeans() {
        return boomParicalBeans;
    }

    public void setBoomParicalBeans(List<BoomParicalBean> boomParicalBeans) {
        this.boomParicalBeans = boomParicalBeans;
    }

}

這個實體類就是上升粒子的實體類作谭,詳細屬性有寫。

二.每一個爆炸粒子也是一個實體奄毡,所以也要定義一個實體類:

/**
 * 爆炸粒子
 */
public class BoomParicalBean {
    //x位置
    private int x;
    //y位置
    private int y;
    //速率
    private int speed;
    //移動距離
    private int distance;
    //粒子半徑
    private int raduis;

    public BoomParicalBean(int x, int y, int raduis, int speed, int distance) {
        this.x = x;
        this.y = y;
        this.raduis = raduis;
        this.speed = speed;
        this.distance = distance;
    }

    public int getX() {
        return x;
    }

    public void setX(int x) {
        this.x = x;
    }

    public int getY() {
        return y;
    }

    public void setY(int y) {
        this.y = y;
    }

    public int getRaduis() {
        return raduis;
    }

    public void setRaduis(int raduis) {
        this.raduis = raduis;
    }

    public int getSpeed() {
        return speed;
    }

    public void setSpeed(int speed) {
        this.speed = speed;
    }

    public int getDistance() {
        return distance;
    }

    public void setDistance(int distance) {
        this.distance = distance;
    }
}

三.生成實體粒子與爆炸粒子折欠,需要一個制造它們的工廠:

/**
 * 粒子工廠
 */
class ParticalFactory {

    /** 生成上升粒子
     * @param paint
     * @param x
     * @param y
     * @param speed
     * @param distance
     * @return
     */
    static ParticalBean createPartical(Paint paint, int x, int y, int speed, int distance){
        return new ParticalBean(paint, x, y, speed, distance);
    }

    /** 生成爆炸粒子
     * @param x
     * @param y
     * @param raduis
     * @param speed
     * @param distance
     * @return
     */
    static BoomParicalBean createBoomPartical(int x, int y, int raduis, int speed, int distance){
        return new BoomParicalBean(x, y, speed, raduis, distance);
    }
}

四.有了這些基本元素之后,開始繪制邏輯:

1.當(dāng)手指按下新增一個粒子,將粒子添加到集合怨酝,并刷新畫布傀缩。

 gestureDetector = new GestureDetector(getContext(), new GestureDetector.SimpleOnGestureListener(){
            @Override
            public boolean onDown(MotionEvent e) {
                ViewCompat.postInvalidateOnAnimation(ParticalView.this);
                list.add(ParticalFactory.createPartical(cratePaint(), (int) e.getX(), (int)e.getY(), (int) (Math.random() * (15-5)+5), (int) (Math.random() * 1000)));
                return true;
            }
        });

2.在onDraw()方法繪制圓形粒子,當(dāng)粒子移動到設(shè)定的位置(范圍內(nèi)隨機)時农猬,設(shè)置為爆炸粒子赡艰。

for (ParticalBean particalBean : list) {
                if(!particalBean.isBoom()){
                    canvas.drawCircle(particalBean.getX(), particalBean.getY(), 50, particalBean.getPaint());
                    particalBean.setY(particalBean.getY() - particalBean.getSpeed());
                }
            }
            for (int i=0; i<list.size(); i++){
                ParticalBean particalBean = list.get(i);
                if(!particalBean.isBoom()){
                    if (particalBean.getY() <= particalBean.getDistance()){
                        //碎片個數(shù)
                        int fragments = (int) (Math.random() * (100 - 60) + 60);
                        List<BoomParicalBean> boomParicalBeans = new ArrayList<>();
                        for (int j=0; j < fragments ;j++){
                            double angle = (j * 2 * Math.PI) / fragments;
                            int raduis = (int) (Math.random() * fragmentsRaduis);
                            int x = (int) (Math.cos(angle) * raduis) + particalBean.getX();
                            int y = (int) (Math.sin(angle) * raduis) + particalBean.getY();
                            BoomParicalBean boomPartical = ParticalFactory.createBoomPartical(x, y, boomParicalSpeed, (int) (Math.random() * particalRaduis), y + boomParticalMoveY);
                            boomParicalBeans.add(boomPartical);
                        }
                        particalBean.setBoomParicalBeans(boomParicalBeans);
                        particalBean.setBoom(true);
                    }
                }
            }

3.根據(jù)上升粒子的位置,計算爆炸粒子的位置(范圍內(nèi)隨機)斤葱,爆炸粒子數(shù)量(范圍內(nèi)隨機)慷垮,爆炸粒子下落距離(預(yù)設(shè)),開始繪制爆炸粒子揍堕。

 //爆炸粒子
            for (int p=0; p< list.size(); p++){
                ParticalBean particalBean = list.get(p);
                if(particalBean.isBoom()){
                    List<BoomParicalBean> boomParicalBeans = particalBean.getBoomParicalBeans();
                    for (int i=0; i<boomParicalBeans.size() ;i++){
                        BoomParicalBean boomParicalBean = boomParicalBeans.get(i);
                        canvas.drawCircle(boomParicalBean.getX(), boomParicalBean.getY(), boomParicalBean.getRaduis(), particalBean.getPaint());
                        boomParicalBean.setY(boomParicalBean.getY() + boomParicalBean.getSpeed());

                        if(boomParicalBean.getY() >= boomParicalBean.getDistance()){
                            boomParicalBeans.remove(boomParicalBean);
                        }

                        if(boomParicalBeans.isEmpty()){
                            list.remove(particalBean);
                            ViewCompat.postInvalidateOnAnimation(ParticalView.this);
                        }
                    }
                }
            }

4.當(dāng)爆炸粒子下落完設(shè)定距離后料身,清除集合中的粒子,畫布停止刷新衩茸。

有點意思

完芹血、、楞慈、幔烛。
完整代碼:
github:

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市囊蓝,隨后出現(xiàn)的幾起案子饿悬,更是在濱河造成了極大的恐慌,老刑警劉巖聚霜,帶你破解...
    沈念sama閱讀 210,914評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件狡恬,死亡現(xiàn)場離奇詭異,居然都是意外死亡蝎宇,警方通過查閱死者的電腦和手機弟劲,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評論 2 383
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來夫啊,“玉大人函卒,你說我怎么就攤上這事∑裁校” “怎么了报嵌?”我有些...
    開封第一講書人閱讀 156,531評論 0 345
  • 文/不壞的土叔 我叫張陵,是天一觀的道長熊榛。 經(jīng)常有香客問我锚国,道長,這世上最難降的妖魔是什么玄坦? 我笑而不...
    開封第一講書人閱讀 56,309評論 1 282
  • 正文 為了忘掉前任血筑,我火速辦了婚禮绘沉,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘豺总。我一直安慰自己车伞,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 65,381評論 5 384
  • 文/花漫 我一把揭開白布喻喳。 她就那樣靜靜地躺著另玖,像睡著了一般。 火紅的嫁衣襯著肌膚如雪表伦。 梳的紋絲不亂的頭發(fā)上谦去,一...
    開封第一講書人閱讀 49,730評論 1 289
  • 那天,我揣著相機與錄音蹦哼,去河邊找鬼鳄哭。 笑死,一個胖子當(dāng)著我的面吹牛纲熏,可吹牛的內(nèi)容都是我干的妆丘。 我是一名探鬼主播,決...
    沈念sama閱讀 38,882評論 3 404
  • 文/蒼蘭香墨 我猛地睜開眼局劲,長吁一口氣:“原來是場噩夢啊……” “哼飘痛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起容握,我...
    開封第一講書人閱讀 37,643評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎车柠,沒想到半個月后剔氏,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,095評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡竹祷,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,448評論 2 325
  • 正文 我和宋清朗相戀三年谈跛,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片塑陵。...
    茶點故事閱讀 38,566評論 1 339
  • 序言:一個原本活蹦亂跳的男人離奇死亡感憾,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出令花,到底是詐尸還是另有隱情阻桅,我是刑警寧澤,帶...
    沈念sama閱讀 34,253評論 4 328
  • 正文 年R本政府宣布兼都,位于F島的核電站嫂沉,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏扮碧。R本人自食惡果不足惜趟章,卻給世界環(huán)境...
    茶點故事閱讀 39,829評論 3 312
  • 文/蒙蒙 一杏糙、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蚓土,春花似錦宏侍、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,715評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至嗜愈,卻和暖如春旧蛾,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背蠕嫁。 一陣腳步聲響...
    開封第一講書人閱讀 31,945評論 1 264
  • 我被黑心中介騙來泰國打工锨天, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人剃毒。 一個月前我還...
    沈念sama閱讀 46,248評論 2 360
  • 正文 我出身青樓病袄,卻偏偏與公主長得像,于是被迫代替她去往敵國和親赘阀。 傳聞我的和親對象是個殘疾皇子益缠,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,440評論 2 348