Android学习之自定义View

/**
*@author StormMaybin
*@Date 2016-06-16
*/

写在前面

成功不是将来才有的，而是从决定去做的那一刻起，持续累积而成。

前面写了好多关于简单控件的用法，其中ListView是最常用也是最复杂的控件，想要了解ListView的可以参考一下。

自定义View可以根据自己的需要定义自己喜欢的View，今天代码来实现一个下雨的View。



先分析一下，这个界面是动态的，可以用画笔来画一个点然后来移动，并且是很多个点，而且初始的位置和结束的位置都是随机的，然后思路就很清晰了，我们先定义一个Rain类，来描述这些雨点的特征。

Step 1:

package com.stormmaybin.raindemo;

import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import java.util.Random;

/**
* Created by StormMaybin on 2016/6/16.
*/
public class Rain
{
private float startX;
private float startY;
private float stopX;
private float stopY;
private float deltaX;
private float deltaY;
private int height;
private int width;
private float v;
Random random = new Random();
private Paint paint = new Paint();

public Rain(int width, int height)
{
this.width = width;
this.height = height;
//调用构造函数时候就进行初始化
init();
}

public void draw(Canvas canvas)
{
canvas.drawLine(startX, startY, stopX, stopY, paint);
//画完一次之后进行移动坐标位置
move();
}

//进行初始化操作
private void init()
{
paint.setColor(Color.WHITE);
v = 0.2f + random.nextFloat();
deltaX = (5 + random.nextInt(10)) * (-1);
deltaY = 10 + random.nextInt(20);
startX = random.nextInt(width);
startY = random.nextInt(height/2);
stopX = startX + deltaX;
stopY = startY + deltaY;
}

//进行移动操作
private void move()
{
startX += deltaX * v;
startY += deltaY * v;

stopX = startX + deltaX * v;
stopY = startY + deltaY * v;

//如果此时的y值大于屏幕的高，那么重新进行初始化
if (startY >= height)
{
init();
}
}
}

先分析一下这个Rain类，这个类中的成员变量都有startX，startY，stopX，stopY，deltaX，deltaY，height，width，v，paint。startx和y是用来指定雨点的初始坐标，那么stopx和y就是指定雨点的结束坐标，deltaX和deltaY是代表雨点每次移动距离。v的作用就是代表一个随机的float值，目的是为了让雨点的初始点的位置也是随机的，paint就是一个画笔了。还有最后两个成员变量height和width，这两个就代表屏幕的宽和高了。然后Rain类中有move（），init（）和draw（）方法。init（）方法是为了对雨点进行初始化操作，move（）方法是为让雨点移动起来，主体部分很简单。draw（）方法作用是开始画线。

Step 2:

Rain类定义完成了，再新建一个RainView类继承View类。

package com.stormmaybin.raindemo;

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

import java.util.ArrayList;

/**
* Created by StormMaybin on 2016/6/16.
*/
public class RainView extends View
{

//判断是否进行了初始化
private boolean isInit = false;
//屏幕的高
private int height;
//定义一个容器！
private ArrayList<Rain> rains = new ArrayList<Rain>();
public RainView(Context context)
{
super(context);
}

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

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

//复写onDraw方法
@Override
protected void onDraw(Canvas canvas)
{
super.onDraw(canvas);

if (!isInit)
{

height = getHeight();
for (int i = 0; i < 400; i++)
{
rains.add(new Rain(getWidth(), height));
}

isInit = true;
}

//开始画图
for (Rain rain : rains)
{
rain.draw(canvas);
}
//延迟
postInvalidateDelayed(30);
}
}

MainActivity中的代码省略，同志们自行脑补。

Step 3:

最后一步，就是布局文件中引入自定义View

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000">

<com.stormmaybin.raindemo.RainView
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>

到这里，自定义View就搞定了！有没有很激动！

写在最后

你现在的努力，将会在未来的某一个时刻得到回报！