自定义气泡背景

这个就是一个自定义View，其实自定义View也就是重写那么几个方法，onDraw（），onMeasure（）。还是直接来看代码吧，注视里面都有的

public class CircleView extends View {      private int circleSum;//圆的数量      private int circleRadio;//圆的半径      private int circleColor;//圆的颜色      private int backColor;//背景颜色      private Paint backPaint;//背景画笔      private Paint circlePaint;//圆的画笔      private Circle[] circles;      private int[] direction = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10};      private Random random;      private float width;      private float height;      private int[] location = new int[2];      private MyThread mMyThread;      private boolean running = true;      public CircleView(Context context) {          super(context);          backPaint = new Paint();          init();      }      public CircleView(Context context, AttributeSet attrs) {          super(context, attrs);          TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.CircleView);          circleSum = ta.getInteger(R.styleable.CircleView_circleSum, 10);          circleColor = ta.getColor(R.styleable.CircleView_circleColor, Color.parseColor("#7756ffff"));          backColor = ta.getColor(R.styleable.CircleView_backColor, Color.parseColor("#21efef"));          circleRadio = ta.getInteger(R.styleable.CircleView_circleRadio, 60);          ta.recycle();          init();      }      /**      * 初始化画笔      */      private void init() {          backPaint = new Paint();          backPaint.setColor(backColor);          circlePaint = new Paint();          circlePaint.setColor(circleColor);      }      /**      * 比onDraw先执行      * <p/>      * 一个MeasureSpec封装了父布局传递给子布局的布局要求，每个MeasureSpec代表了一组宽度和高度的要求。      * 一个MeasureSpec由大小和模式组成      * 它有三种模式：UNSPECIFIED(未指定),父元素部队自元素施加任何束缚，子元素可以得到任意想要的大小;      * EXACTLY(完全)，父元素决定自元素的确切大小，子元素将被限定在给定的边界里而忽略它本身大小；      * AT_MOST(至多)，子元素至多达到指定大小的值。      * <p/>      * 　　它常用的三个函数：      * 1.static int getMode(int measureSpec):根据提供的测量值(格式)提取模式(上述三个模式之一)      * 2.static int getSize(int measureSpec):根据提供的测量值(格式)提取大小值(这个大小也就是我们通常所说的大小)      * 3.static int makeMeasureSpec(int size,int mode):根据提供的大小值和模式创建一个测量值(格式)      */      @Override      protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {          super.onMeasure(widthMeasureSpec, heightMeasureSpec);          //获取控件宽度          width = getMeasuredWidth();          //获取控件高度          height = getMeasuredHeight();          //获取控件相对于父控件的位置坐标          this.getLocationInWindow(location);          //初始化圆          initCircle();      }      /**      * 初始化圆      */      private void initCircle() {          circles = new Circle[circleSum];          random = new Random();          for (int i = 0; i < circleSum; i++) {              int d = random.nextInt(direction.length);              int x = random.nextInt((int) width);              int y = random.nextInt((int) height);              circles[i] = new Circle(x, y, d);          }      }      @Override      protected void onDraw(Canvas canvas) {          //绘制背景          canvas.drawRect(0, 0, location[0] + width, location[1] + height, backPaint);          //遍历绘制每一个圆          for (Circle c : circles) {              canvas.drawCircle(c.getX(), c.getY(), circleRadio, circlePaint);          }          if (mMyThread == null) {              mMyThread = new MyThread();              mMyThread.start();          }      }      /**      * 不在窗口显示的时候停止线程      */      @Override      protected void onDetachedFromWindow() {          running = false;          super.onDetachedFromWindow();      }      class MyThread extends Thread {          @Override          public void run() {              while (running) {                  for (int i = 0; i < circleSum; i++) {                      Circle c = circles[i];                      changeDirection(c);                      //超出边界后重置方向                      if (c.getX() > width || c.getX() < 0 || c.getY() > height || c.getY() < 0) {                          int d;                          while (true) {                              d = random.nextInt(direction.length);                              int lastD = c.getDirection();                              if ((lastD == 0 || lastD == 4 || lastD == 6 || lastD == 8 || lastD == 10) && (d == 0 || d == 4 || d == 6 || d == 8 || d == 10)) {//上                                  continue;                              } else if ((lastD == 1 || lastD == 5 || lastD == 7 || lastD == 9) && (d == 1 || d == 5 || d == 7 || d == 9)) {//下                                  continue;                              } else if ((lastD == 2 || lastD == 4 || lastD == 5 || lastD == 8 || lastD == 9) && (d == 2 || d == 4 || d == 5 || d == 8 || d == 9)) {//左                                  continue;                              } else if ((lastD == 3 || lastD == 6 || lastD == 7 || lastD == 10) && (d == 3 || d == 6 || d == 7 || d == 10)) {//右                                  continue;                              }                              break;                          }                          circles[i].setDirection(d);                      }                  }                  try {                      Thread.sleep(30);                  } catch (InterruptedException e) {                      e.printStackTrace();                  }                  postInvalidate();              }          }          private void changeDirection(Circle c) {              float dx = 0.3f;              switch (c.getDirection()) {                  case 0://上                      c.setY(c.getY() - dx);                      break;                  case 1://下                      c.setY(c.getY() + dx);                      break;                  case 2://左                      c.setX(c.getX() - dx);                      break;                  case 3://右                      c.setX(c.getX() + dx);                      break;                  case 4://左上                      c.setX(c.getX() - dx);                      c.setY(c.getY() - dx);                      break;                  case 5://左下                      c.setX(c.getX() - dx);                      c.setY(c.getY() + dx);                      break;                  case 6://右上                      c.setX(c.getX() + dx);                      c.setY(c.getY() - dx);                      break;                  case 7://右下                      c.setX(c.getX() + dx);                      c.setY(c.getY() + dx);                      break;                  case 8://左上                      c.setX(c.getX() - dx);                      c.setY(c.getY() - dx * 2);                      break;                  case 9://左下                      c.setX(c.getX() - dx * 2);                      c.setY(c.getY() + dx);                      break;                  case 10://右上                      c.setX(c.getX() + dx);                      c.setY(c.getY() - dx * 2);                      break;              }          }      }      class Circle {          private float x;          private float y;          private int direction;          public Circle(float x, float y, int d) {              this.x = x;              this.y = y;              this.direction = d;          }          public float getX() {              return x;          }          public void setX(float x) {              this.x = x;          }          public void setY(float y) {              this.y = y;          }          public float getY() {              return y;          }          public void setDirection(int direction) {              this.direction = direction;          }          public int getDirection() {              return direction;          }      }  }  

来看看在xml文件中怎么使用

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"      android:layout_width="match_parent"      android:layout_height="match_parent">      <com.tianzhao.myapplication.CircleView          xmlns:cv="http://schemas.android.com/apk/res/com.tianzhao.myapplication"  //自己的命名空间          android:layout_width="fill_parent"          android:layout_height="200dp"          cv:circleSum="10"  //圆的数量          cv:circleColor="#7756ffff"  //圆的颜色          cv:backColor="#21efef"/> //背景颜色      <RelativeLayout          android:layout_width="fill_parent"          android:layout_height="200dp">          <ImageView              android:id="@+id/iv"              android:layout_width="80dp"              android:layout_height="80dp"              android:layout_centerInParent="true"              android:background="@drawable/user" />          <TextView              android:layout_width="wrap_content"              android:layout_height="wrap_content"              android:layout_below="@id/iv"              android:layout_centerHorizontal="true"              android:layout_marginTop="5dp"              android:text="登录"              android:textSize="20dp" />      </RelativeLayout>      <LinearLayout          android:layout_width="wrap_content"          android:layout_height="40dp"          android:layout_centerHorizontal="true"          android:layout_marginTop="230dp">          <TextView              android:layout_width="wrap_content"              android:layout_height="wrap_content"              android:gravity="center_vertical"              android:text="用户名:"              android:textSize="20dp" />          <EditText              android:layout_width="200dp"              android:layout_height="wrap_content"              android:layout_marginLeft="5dp"              android:gravity="center_vertical" />      </LinearLayout>      <LinearLayout          android:layout_width="wrap_content"          android:layout_height="40dp"          android:layout_centerHorizontal="true"          android:layout_marginTop="280dp">          <TextView              android:layout_width="wrap_content"              android:layout_height="wrap_content"              android:gravity="center_vertical"              android:text="密    码:"              android:textSize="20dp" />          <EditText              android:layout_width="200dp"              android:layout_height="wrap_content"              android:layout_marginLeft="5dp"              android:gravity="center_vertical" />      </LinearLayout>  </RelativeLayout>

这里会涉及到一个attr.xml

<?xml version="1.0" encoding="utf-8"?>  <resources>      <declare-styleable name="CircleView">          <attr name="circleSum" format="integer"></attr>          <attr name="circleColor" format="color"></attr>          <attr name="backColor" format="color"></attr>          <attr name="circleRadio" format="integer"></attr>      </declare-styleable>  </resources>