54、Android 粒子效果之雨（下雨的效果）

核心内容：
1.绘制下雨场景的个体、雨点（直线）
2.让直线动起来
3.处理边界问题
4.构造雨点对象
5.雨点大小设置
6.速度设置和角度设置等
7.添加多个雨点
8.抽离可以在 XML 中影响的属性
9.在代码中解析样式属性并使用其控制雨点变化

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.View;

/**
 * 基类
 */
public abstract class BaseView extends View {
    private MyThread thread;
    private boolean running = true;

    public BaseView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public BaseView(Context context) {
        super(context);
    }

    protected abstract void drawSub(Canvas canvas);
    protected abstract void logic();
    protected abstract void init();

    class MyThread extends Thread {
        @Override
        public void run() {
            init();
            while (running) {
                logic();
                postInvalidate();
                try {
                    Thread.sleep(30);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }
        }
    }

    @Override
    protected final void onDraw(Canvas canvas) {
        if (thread == null) {
            thread = new MyThread();
            thread.start();
        } else {
            drawSub(canvas);
        }
    }

    @Override
    protected void onDetachedFromWindow() {
        running = false;
        super.onDetachedFromWindow();
    }

}

1）简单描述单个雨点的行为。

绘制下雨场景的个体，雨点（直线）；

让直线动起来；

处理边界问题；

 <com.rain.RainView
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:background="#ff000000"
        />

   import android.content.Context;
 import android.graphics.Canvas;
 import android.graphics.Paint;
 import android.util.AttributeSet;

 public class RainView extends BaseView {
     private float startX;
     private float startY;
     private float stopX;
     private float stopY;
     private float sizeX;
     private float sizeY;
     private Paint paint;

     public RainView(Context context, AttributeSet attrs) {
         super(context, attrs);
         // 角度。
         sizeX = 10;
         sizeY = 30;
         // 以下是 初始化直线的坐标。
         startX = 100;
         startY = 0;
         // 改变 角度的直线。
         stopX = startX + sizeX;
         stopY = startY + sizeY;

         paint = new Paint();
         // 把直线 设置成白色。
         paint.setColor(0xffffffff);
     }

     public RainView(Context context) {
         super(context);
     }

     @Override
     protected void drawSub(Canvas canvas) {
         // 绘制一条直线
         canvas.drawLine(startX, startY, stopX, stopY, paint);
     }

     @Override   /* 让直线动起来 **/
     protected void logic() {

         //倍率，通过倍率来改变速度。
         float opt = 0.5f;

         startX += sizeX * opt;
         stopX += sizeX * opt;

         startY += sizeY * opt;
         stopY += sizeY * opt;

         // 当直线走出屏幕的时候，变为初始位置。
         if (startY > getHeight()) {
             startX = 100;
             startY = 0;
             stopX = startX + 10;
             stopY = startY + 30;
         }
     }

 }

2）完善雨点行为和构造下雨场景。

构造雨点对象；

雨点大小设置；

速度设置；

角度设置等 添加多个雨点；

 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent" >
     <com.rain.RainView
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:background="#ff000000" />
 </FrameLayout>

 public class RainView extends BaseView {
     // 多个 “雨点” 对象。
     private ArrayList<RainItem> list = new ArrayList<RainItem>();
     private int rainNum = 80;  // “雨点”个数。

     public RainView(Context context, AttributeSet attrs) {
         super(context, attrs);
     }

     public RainView(Context context) {
         super(context);
     }

     @Override
     protected void drawSub(Canvas canvas) {
         for (RainItem item : list) {
             item.draw(canvas);
         }
     }

     @Override
     protected void logic() {
         for (RainItem item : list) {
             item.move();
         }
     }

     @Override
     protected void init() {
         for (int i = 0; i < rainNum; i++) {
             RainItem item = new RainItem(getWidth(), getHeight());
             list.add(item);
         }
     }

 }

 /**
  * 抽象出一个 雨点 的类
  */
 public class RainItem {
     private int width;
     private int height;

     private float startX;
     private float startY;
     private float stopX;
     private float stopY;
     private float sizeX;
     private float sizeY;
     private float opt;  // 速率
     private Paint paint;
     private Random random;  // 随机数

     // 自定义“雨点”的 宽 和 高
     public RainItem(int width, int height) {
         this.width = width;
         this.height = height;
         init();
     }

     private void init() {
         random = new Random();
         // 角度 "X和Y随机。
         sizeX = 1 + random.nextInt(10);
         sizeY = 10 + random.nextInt(20);
         // "雨点"X和Y随机位置。
         startX = random.nextInt(width);
         startY = random.nextInt(height);
         stopX = startX + sizeX;
         stopY = startY + sizeY;
         // 速率随机。
         opt = 0.2f + random.nextFloat();
         paint = new Paint();

         paint.setColor(0xffffffff);
     }

     public void draw(Canvas canvas) {
         canvas.drawLine(startX, startY, stopX, stopY, paint);
     }

     public void move() {
         startX += sizeX * opt;
         stopX += sizeX * opt;

         startY += sizeY * opt;
         stopY += sizeY * opt;

         if (startY > height) {
             init();
         }
     }

 }

3）在xml中定义可以控制下雨的属性。

抽离可以在xml中影响的属性；

在代码中解析样式属性并使用其控制雨点变化；

res/values/attrs.xml

 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <declare-styleable name="RainView">
         <!-- 雨点数量 -->
         <attr name="rainNum" format="integer"/>
         <!-- 雨点大小 -->
         <attr name="size" format="integer"/>
         <!-- 雨点颜色 -->
         <attr name="rainColor" format="integer"/>
         <!-- 雨点颜色随机 -->
         <attr name="randColor" format="boolean"/>
     </declare-styleable>
 </resources>

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:rain="http://schemas.android.com/apk/res/com.jikexueyuan.rain"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <com.rain.RainView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ff000000"
        rain:rainNum="50"
        rain:size="20"
        rain:rainColor="0xff00ff00"
        rain:randColor="true"/>
</FrameLayout>

 public class RainView extends BaseView {
     // 多个 “雨点” 对象。
     private ArrayList<RainItem> list = new ArrayList<RainItem>();
     // 以下4个值，均为默认值。
     private int rainNum = 80;  // “雨点”个数。
     private int size;
     private int rainColor;
     private boolean randColor;

     public RainView(Context context, AttributeSet attrs) {
         super(context, attrs);

         // 加载，解析 样式属性。res/values/attrs.xml
         TypedArray ta = context.obtainStyledAttributes(attrs,
                 R.styleable.RainView);

         rainNum = ta.getInteger(R.styleable.RainView_rainNum, 80);
         size = ta.getInteger(R.styleable.RainView_size, 20);
         rainColor = ta.getInteger(R.styleable.RainView_rainColor, 0xffffffff);
         randColor = ta.getBoolean(R.styleable.RainView_randColor, false);
         ta.recycle();
     }

     public RainView(Context context) {
         super(context);
     }

     @Override
     protected void drawSub(Canvas canvas) {
         for (RainItem item : list) {
             item.draw(canvas);
         }
     }

     @Override
     protected void logic() {
         for (RainItem item : list) {
             item.move();
         }
     }

     @Override
     protected void init() {
         for (int i = 0; i < rainNum; i++) {
             RainItem item = new RainItem(getWidth(), getHeight(), size,
                     rainColor, randColor);
             list.add(item);
         }
     }

 }

 /**
  * 抽象出一个 雨点 的类
  */
 public class RainItem {

     private int width;
     private int height;

     private float startX;
     private float startY;
     private float stopX;
     private float stopY;
     private float sizeX;
     private float sizeY;
     private float opt;  // 速率
     private Paint paint;
     private Random random;  // 随机数

     private int size = 20;
     private int color;
     // 随机 雨点颜色
     private boolean randColor = false;;

     // 自定义“雨点”的 宽 和 高
     public RainItem(int width, int height) {
         this.width = width;
         this.height = height;
         init();
     }

     public RainItem(int width, int height, int size) {
         this.size = size;
         this.width = width;
         this.height = height;
         init();
     }

     public RainItem(int width, int height, int size, int color) {
         this.color = color;
         this.size = size;
         this.width = width;
         this.height = height;
         init();
     }

     public RainItem(int width, int height, int size, int color,
             boolean randColor) {
         this.randColor = randColor;
         this.color = color;
         this.size = size;
         this.width = width;
         this.height = height;
         init();
     }

     private void init() {
         random = new Random();
         // 角度 "X和Y随机。
         sizeX = 1 + random.nextInt(size / 2);
         sizeY = 10 + random.nextInt(size);
         // "雨点"X和Y随机位置。
         startX = random.nextInt(width);
         startY = random.nextInt(height);
         stopX = startX + sizeX;
         stopY = startY + sizeY;
         // 速率随机。
         opt = 0.2f + random.nextFloat();
         paint = new Paint();
         if (randColor) {
             // 颜色随机值。
             int r = random.nextInt(256);
             int g = random.nextInt(256);
             int b = random.nextInt(256);

             paint.setARGB(255, r, g, b);
         } else {
             paint.setColor(color);
         }
     }

     public void draw(Canvas canvas) {
         canvas.drawLine(startX, startY, stopX, stopY, paint);
     }

     public void move() {
         startX += sizeX * opt;
         stopX += sizeX * opt;

         startY += sizeY * opt;
         stopY += sizeY * opt;

         if (startY > height) {
             init();
         }
     }

 }

DEMO下载路径：http://download.csdn.net/detail/androidsj/9279741