Android自定义view实现雪花特效实例代码

目录
  • 一、前言
  • 二、创意名
  • 三、效果展示
  • 四、实现步骤
  • 五、编码实现
  • 总结

一、前言

这个冬天,老家一直没有下雨, 正好圣诞节,就想着制作一个下雪的特效。

圣诞祝福:平安夜,舞翩阡。雪花飘,飞满天。心与心,永相伴。

圣诞节是传统的宗教节日,对于基 督徒,那是庆祝耶稣的诞生,纪念耶稣和发扬基督精神。现在整个西方社会都在过圣诞节,像许多宗教节日一样,它已经越来越民俗化了。

尽管如此,圣诞节依然倍受尊重。人们在圣诞快乐中怀有对耶稣的敬仰,欢乐的节庆里含有庄严肃穆的神念。欢度圣诞佳节的人都不拒绝耶稣的教诲,要仁爱、善良、诚实、忍耐、感恩……在信神的国度,不是基 督徒的人们,也都知道人应该感恩,心存谢意。对需要帮助的人给予关爱;对他人的帮助给予感谢。这是西方社会价值观的一部份,而不是说圣诞夜就只是一家坐在壁炉前,共进有火鸡或烤鹅的圣诞大餐或是冬季里开的一个最热闹的大派对。

二、创意名

Android实现雪花特效自定义view

三、效果展示

四、实现步骤

1.创建一个view,里面加载雪花类的集合,有一个死循环线程,一直执行动画

 public class myRunnable implements Runnable {
        @Override
        public void run() {
            while (true){
                Canvas canvas =null;
                try {
                    synchronized (holder){
                        canvas = holder.lockCanvas();
                        //清除画布
                        canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
                        for (Snowflake snowflake :list){
                            snowflake.draw(canvas);
                            snowflake.update();
                        }
                    }
                }catch (Exception e){
                    e.printStackTrace();
                }finally {
                    if (canvas!=null){
                        holder.unlockCanvasAndPost(canvas);
                    }
                }

            }
        }
    }

这样的话,可以让所有的雪花图片动起来

2.创建雪花类,其实就是一个bitmap,然后设置不同尺寸和动画

这步相对来说简单一些,其实就是将bitmap绘制到画布上面

public void reset(){
        size = randomizer.randomInt(sizeMinInPx, sizeMaxInPx, true);
        if (image!=null){
            if (bitmap==null){
                bitmap = Bitmap.createScaledBitmap(image, size, size, false);
            }
        }
        float speed =  (float)(size - sizeMinInPx) / (sizeMaxInPx - sizeMinInPx) * (speedMax - speedMin) + speedMin;
        double angle = Math.toRadians(randomizer.randomDouble(angleMax) * randomizer.randomSignum());
        speedX = speed* Math.sin(angle);
        speedY = speed* Math.cos(angle);

        alpha = randomizer.randomInt(alphaMin, alphaMax, false);
        paint.setAlpha(alpha);

        positionX = randomizer.randomDouble(parentWidth);

        this.positionY=randomizer.randomDouble(parentHeight);
        if (!alreadyFalling){
            this.positionY = this.positionY-parentHeight-size;
        }
    }

3.界面展示

实现manifest加载视图即可

<?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"
    android:background="#000"
    tools:context="com.marvin.snowfall_master.MainActivity">

    <com.itbird.SnowfallView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/sf_snow"
        app:snowflakesNum="200"
        app:snowflakeAlphaMin="150"
        app:snowflakeAlphaMax="255"
        app:snowflakeAngleMax="5"
        app:snowflakeSizeMin="2dp"
        app:snowflakeSizeMax="40dp"
        app:snowflakeSpeedMin="2"
        app:snowflakeSpeedMax="10"
        app:snowflakesFadingEnabled="true"
        app:snowflakesAlreadyFalling="false"
        app:snowflakeImage="@mipmap/snowflake"
        />

</android.support.constraint.ConstraintLayout>

五、编码实现

界面类SnowfallView

public class SnowfallView extends SurfaceView implements SurfaceHolder.Callback {

    private int DEFAULT_SNOWFLAKES_NUM = 200;
    private int DEFAULT_SNOWFLAKE_ALPHA_MIN = 150;
    private int DEFAULT_SNOWFLAKE_ALPHA_MAX = 250;
    private int DEFAULT_SNOWFLAKE_ANGLE_MAX = 10;
    private int DEFAULT_SNOWFLAKE_SIZE_MIN_IN_DP = 2;
    private int DEFAULT_SNOWFLAKE_SIZE_MAX_IN_DP = 8;
    private int DEFAULT_SNOWFLAKE_SPEED_MIN = 2;
    private int DEFAULT_SNOWFLAKE_SPEED_MAX = 8;
    private boolean DEFAULT_SNOWFLAKES_FADING_ENABLED = false;
    private boolean DEFAULT_SNOWFLAKES_ALREADY_FALLING = false;

    private int snowflakesNum;
    private Bitmap snowflakeImage;
    private int snowflakeAlphaMin;
    private int snowflakeAlphaMax;
    private int snowflakeAngleMax;
    private int snowflakeSizeMinInPx;
    private int snowflakeSizeMaxInPx;
    private int snowflakeSpeedMin;
    private int snowflakeSpeedMax;
    private boolean snowflakesFadingEnabled;
    private boolean snowflakesAlreadyFalling;

    //雪花类集合
    private ArrayList<Snowflake> list =new ArrayList<>();

    private SnowfallView.myRunnable myRunnable = new myRunnable();
    private Thread myThread;
    private SurfaceHolder holder;

    public SnowfallView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
    }

    private void init(Context context, AttributeSet attributeSet) {
        TypedArray typedArray = context.obtainStyledAttributes(attributeSet, R.styleable.SnowfallView);
        snowflakesNum = typedArray.getInt(R.styleable.SnowfallView_snowflakesNum, DEFAULT_SNOWFLAKES_NUM);
        snowflakeImage = drawable2Bitmap(typedArray.getDrawable(R.styleable.SnowfallView_snowflakeImage));
        snowflakeAlphaMin = typedArray.getInt(R.styleable.SnowfallView_snowflakeAlphaMin, DEFAULT_SNOWFLAKE_ALPHA_MIN);
        snowflakeAlphaMax = typedArray.getInt(R.styleable.SnowfallView_snowflakeAlphaMax, DEFAULT_SNOWFLAKE_ALPHA_MAX);
        snowflakeAngleMax = typedArray.getInt(R.styleable.SnowfallView_snowflakeAngleMax, DEFAULT_SNOWFLAKE_ANGLE_MAX);
        snowflakeSizeMinInPx = typedArray.getDimensionPixelSize(R.styleable.SnowfallView_snowflakeSizeMin, dp2Px(DEFAULT_SNOWFLAKE_SIZE_MIN_IN_DP));
        snowflakeSizeMaxInPx = typedArray.getDimensionPixelSize(R.styleable.SnowfallView_snowflakeSizeMax, dp2Px(DEFAULT_SNOWFLAKE_SIZE_MAX_IN_DP));
        snowflakeSpeedMin = typedArray.getInt(R.styleable.SnowfallView_snowflakeSpeedMin, DEFAULT_SNOWFLAKE_SPEED_MIN);
        snowflakeSpeedMax = typedArray.getInt(R.styleable.SnowfallView_snowflakeSpeedMax, DEFAULT_SNOWFLAKE_SPEED_MAX);
        snowflakesFadingEnabled = typedArray.getBoolean(R.styleable.SnowfallView_snowflakesFadingEnabled, DEFAULT_SNOWFLAKES_FADING_ENABLED);
        snowflakesAlreadyFalling = typedArray.getBoolean(R.styleable.SnowfallView_snowflakesAlreadyFalling, DEFAULT_SNOWFLAKES_ALREADY_FALLING);
        typedArray.recycle();

        holder = this.getHolder();
        holder.addCallback(this);

        //设置背景为透明
        setZOrderOnTop(true);
        holder.setFormat(PixelFormat.TRANSPARENT);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        //获取雪花集合
        for (int i=0;i<snowflakesNum;i++){
            list.add(new Snowflake(w, h, snowflakeImage, snowflakeAlphaMin, snowflakeAlphaMax
                    , snowflakeAngleMax, snowflakeSizeMinInPx, snowflakeSizeMaxInPx, snowflakeSpeedMin, snowflakeSpeedMax
                    , snowflakesFadingEnabled, snowflakesAlreadyFalling));
        }
    }

    @Override
    protected void onVisibilityChanged(@NonNull View changedView, int visibility) {
        super.onVisibilityChanged(changedView, visibility);
        if (changedView==this&&visibility==GONE){
            //初始化雪花类
            try {
                for (Snowflake snowflake :list){
                    snowflake.reset();
                }
            }catch (Exception e){
                e.printStackTrace();
            }

        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (isInEditMode()){
            return;
        }
    }

    /**
     * dp转px
     * @param dp
     * @return
     */
    private int dp2Px(int dp){
        return (int) (dp*getResources().getDisplayMetrics().density);
    }

    /**
     * drawble转Bitmap
     * @param drawable
     * @return
     */
    private Bitmap drawable2Bitmap(Drawable drawable){
        Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        drawable.setBounds(0,0,drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());
        drawable.draw(canvas);
        return bitmap;
    }

    @Override
    public void surfaceCreated(SurfaceHolder surfaceHolder) {
        if (myThread==null){
            myThread = new Thread(myRunnable);
        }
        if(!myThread.isAlive()){
            myThread.start();
        }

    }

    @Override
    public void surfaceChanged(SurfaceHolder surfaceHolder, int i, int i1, int i2) {

    }

    @Override
    public void surfaceDestroyed(SurfaceHolder surfaceHolder) {
        if (myThread!=null){
            myThread.interrupt();
        }
    }

    public class myRunnable implements Runnable {
        @Override
        public void run() {
            while (true){
                Canvas canvas =null;
                try {
                    synchronized (holder){
                        canvas = holder.lockCanvas();
                        //清除画布
                        canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
                        for (Snowflake snowflake :list){
                            snowflake.draw(canvas);
                            snowflake.update();
                        }
                    }
                }catch (Exception e){
                    e.printStackTrace();
                }finally {
                    if (canvas!=null){
                        holder.unlockCanvasAndPost(canvas);
                    }
                }

            }
        }
    }
}

雪花类Snowflake

public class Snowflake {

    private int parentWidth;
    private int parentHeight;
    private int alphaMin;
    private int alphaMax;
    private int angleMax;
    private int sizeMinInPx;
    private int sizeMaxInPx;
    private int speedMin;
    private int speedMax;
    private Bitmap image;
    private boolean fadingEnabled;
    private boolean alreadyFalling;

    private int size = 0 ;
    private int alpha = 255;
    private Bitmap bitmap = null;
    private double speedX= 0.0;
    private double speedY = 0.0;
    private double positionX = 0.0;
    private double positionY = 0.0;
    private final Randomizer randomizer;

    private Paint paint;

    public Snowflake(int parentWidth, int parentHeight, Bitmap image
            ,int alphaMin,int alphaMax,int angleMax,int sizeMinInPx,int sizeMaxInPx,
                    int speedMin,int speedMax,boolean fadingEnabled,boolean alreadyFalling ){
        this.parentWidth = parentWidth;
        this.parentHeight = parentHeight;
        this.alphaMin = alphaMin;
        this.alphaMax = alphaMax;
        this.angleMax = angleMax;
        this.sizeMinInPx = sizeMinInPx;
        this.sizeMaxInPx = sizeMaxInPx;
        this.speedMin = speedMin;
        this.speedMax = speedMax;
        this.image = image;
        this.fadingEnabled=fadingEnabled;
        this.alreadyFalling=alreadyFalling;

        randomizer = new Randomizer();
        initPaint();
        reset();
    }

    /**
     * 初始化画笔
     */
    private void initPaint() {
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.rgb(255,255,255));
        paint.setStyle(Paint.Style.FILL);
    }

    public void reset(double positionY){
        size = randomizer.randomInt(sizeMinInPx, sizeMaxInPx, true);
        if (image!=null){
            if (bitmap==null){
                bitmap = Bitmap.createScaledBitmap(image, size, size, false);
            }
        }
        float speed = (float)(size - sizeMinInPx) / (sizeMaxInPx - sizeMinInPx) * (speedMax - speedMin) + speedMin;

        double angle = Math.toRadians(randomizer.randomDouble(alphaMax) * randomizer.randomSignum());
        if (angle<-1||angle>1){
            angle = 0;
        }
        speedX = speed* Math.sin(angle);
        speedY = speed* Math.cos(angle);
        alpha = randomizer.randomInt(alphaMin, alphaMax, false);
        paint.setAlpha(alpha);

        positionX = randomizer.randomDouble(parentWidth);

        this.positionY = positionY;
    }

    public void reset(){
        size = randomizer.randomInt(sizeMinInPx, sizeMaxInPx, true);
        if (image!=null){
            if (bitmap==null){
                bitmap = Bitmap.createScaledBitmap(image, size, size, false);
            }
        }
        float speed =  (float)(size - sizeMinInPx) / (sizeMaxInPx - sizeMinInPx) * (speedMax - speedMin) + speedMin;
        double angle = Math.toRadians(randomizer.randomDouble(angleMax) * randomizer.randomSignum());
        speedX = speed* Math.sin(angle);
        speedY = speed* Math.cos(angle);

        alpha = randomizer.randomInt(alphaMin, alphaMax, false);
        paint.setAlpha(alpha);

        positionX = randomizer.randomDouble(parentWidth);

        this.positionY=randomizer.randomDouble(parentHeight);
        if (!alreadyFalling){
            this.positionY = this.positionY-parentHeight-size;
        }
    }

    public void update(){
        positionX = positionX+speedX;
        positionY = positionY+speedY;
        if (positionY>parentHeight){
            positionY = -(double)size;
            reset(positionY);
        }
        if (fadingEnabled){
            paint.setAlpha((int) (alpha * ((float) (parentHeight - positionY) / parentHeight)));
        }
    }

    public void draw(Canvas canvas){
        if (bitmap!=null){
            canvas.drawBitmap(bitmap,(float)positionX,(float)positionY,paint);
        }else {
            canvas.drawCircle((float)positionX,(float)positionY,(float)size,paint);
        }
    }
}

总结

到此这篇关于Android自定义view实现雪花特效的文章就介绍到这了,更多相关Android实现雪花特效内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Android自定义View实现雪花特效

    本文实例为大家分享了Android自定义View实现雪花特效展示的具体代码,供大家参考,具体内容如下 效果图 1.SnowView 类 package com.ilz.rocketapplication.handaccount.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; impo

  • Android自定义view实现太极效果实例代码

    Android自定义view实现太极效果实例代码 之前一直想要个加载的loading.却不知道用什么好,然后就想到了太极图标,最后效果是有了,不过感觉用来做loading简直丑到爆!!! 实现效果很简单,我们不要用什么贝塞尔曲线啥的,因为太极无非就是圆圆圆,只要画圆就ok了.来上代码: 因为有黑有白,所以定义2个画笔分别为黑和白. private void inital() { whitePaint = new Paint(); whitePaint.setAntiAlias(true); wh

  • Android自定义view实现圆环效果实例代码

    先上效果图,如果大家感觉不错,请参考实现代码.           重要的是如何实现自定义的view效果 (1)创建类,继承view,重写onDraw和onMesure方法 public class CirclePercentBar extends View{ private Context mContext; private int mArcColor; private int mArcWidth; private int mCenterTextColor; private int mCent

  • android 自定义圆角button效果的实例代码(自定义view Demo)

    概述 在平时开发过程中经常会碰到需要使用圆角button的情况,一般也会包括很多其他小功能,比如要在里面添加img,设置不同的圆角大小等. 针对这样的场景,直接使用创建多个shape,定义多个xml文件也是可以实现的.但是如果使用非常频繁,那么直接自定义一个就会来的非常方便. 甚至在一些情况下,不是可以用shape定义的规则图形,比如需要用到贝塞尔曲线等. 如果全局需要这样风格的view,那么自定义一个View是非常必要的. 本文主要是个demo记录,如有需要的读者可以借鉴学习. Demo 主要

  • Android自定义水波纹动画Layout实例代码

    话不多说,我们先来看看效果: Hi前辈搜索预览 这一张是<Hi前辈>的搜索预览图,你可以在这里下载这个APP查看更多效果: http://www.wandoujia.com/apps/com.superlity.hiqianbei LSearchView 这是一个MD风格的搜索框,集成了ripple动画以及search时的loading,使用很简单,如果你也需要这样的搜索控件不妨来试试:https://github.com/onlynight/LSearchView RippleEverywh

  • Android自定义View的实现方法实例详解

    一.自绘控件 下面我们准备来自定义一个计数器View,这个View可以响应用户的点击事件,并自动记录一共点击了多少次.新建一个CounterView继承自View,代码如下所示: 可以看到,首先我们在CounterView的构造函数中初始化了一些数据,并给这个View的本身注册了点击事件,这样当CounterView被点击的时候,onClick()方法就会得到调用.而onClick()方法中的逻辑就更加简单了,只是对mCount这个计数器加1,然后调用invalidate()方法.通过 Andr

  • Android自定义View实现多边形统计图示例代码

    前言   最近利用空闲时间学习了自定义View的一些知识,为了巩固,写了一个小东西,顺便分享出来,下面话不多说了,来一起看看详细的介绍吧. 简介   一个多边形统计图.边数,每个方向的值,每个点的文字等等都是可以设置的. 下面就来分析一下这个自定义View 这个view由以下几个部分组成 M层N边形 中心到各顶点的连线 填充区域 文字 @Override protected void onDraw(Canvas canvas) { if (!canDraw()) { return; } canv

  • Android自定义指示器时间轴效果实例代码详解

    指示器时间轴在外卖.购物类的APP里会经常用到,效果大概就像下面这样,看了网上很多文章,大都是自己绘制,太麻烦,其实通过ListView就可以实现. 在Activity关联的布局文件activity_main.xml中放置一个ListView,代码如下.由于这个列表只是用于展示信息,并不需要用户去点击,所以将其clickable属性置为false:为了消除ListView点击产生的波纹效果,我们设置其listSelector属性的值为透明:我们不需要列表项之间的分割线,所以设置其divider属

  • ASP.net中Core自定义View查找位置的实例代码

    .NET Core 的内容处处可见,刷爆全球各大社区,所以,老周相信各位大伙伴已经看得不少了,故而,老周不考虑一个个知识点地去写,那样会成为年度最大的屁话,何况官方文档也很详尽.老周主要扯一下大伙伴们在入门的时候可能会疑惑的内容. ASP.NET Core 可以在一个项目中混合使用 Web Pages 和 MVC ,这是老周最希望的,因为这样会变得更灵活.Web Pages 类似于我们过去的 Web 开发方式,以页面为单位,此模型侧重于功能划分.而 MVC 侧重于数据,有什么样的数据模型就有什么

  • Android自定义View——扇形统计图的实现代码

    Android 扇形统计图 先看看效果: 看上去如果觉得还行就继续往下看吧! 自定义View 定义成员变量 private int mHeight, mWidth;//宽高 private Paint mPaint;//扇形的画笔 private Paint mTextPaint;//画文字的画笔 private int centerX, centerY;//中心坐标 //"其他"的value //扇形图分成太多快 所以要合并一部分为其他 即图中灰色部分 private double

随机推荐

其他