最近IOS的朋友写了一个动画 问我多长时间能实现，本着热爱学习的精神，一下午搞出来一个，，咳咳。。。
话不多说，先看第一个随机运动，上图
这是一个比较初始的动画，主要是绘制一个小方块View，并且改变这个View在画布中的位置，然后进行刷新Canvas来实现动画
关于代码也是很简单，先创建一个been类去保存这个view的一些参数
/**
* @author： jjf
* @date： 2019/5/10
* @describe：View 参数
*/
public class BlockBeen {
//初始View位置
private int viewAddressX = 100;
private int viewAddressY = 200;
//View 大小
private int viewWide = 100;
private int viewHeight = 100;
//画view的画笔仓库
private Paint viewPain ;
//view仓库
private RectF rectF;
//地址状态 0：第一排 1：牧默认位置（中间一排） 2：下边一排
private int addressState;
public int getAddressState() {
return addressState;
}
public void setAddressState(int addressState) {
this.addressState = addressState;
}
public int getViewAddressX() {
return viewAddressX;
}
public void setViewAddressX(int viewAddressX) {
this.viewAddressX = viewAddressX;
}
public int getViewAddressY() {
return viewAddressY;
}
public void setViewAddressY(int viewAddressY) {
this.viewAddressY = viewAddressY;
}
String TAG="MoveBlockView";
public int getViewWide() {
return viewWide;
}
public void setViewWide(int viewWide) {
this.viewWide = viewWide;
}
public int getViewHeight() {
return viewHeight;
}
public void setViewHeight(int viewHeight) {
this.viewHeight = viewHeight;
}
public Paint getViewPain() {
return viewPain;
}
public void setViewPain(Paint viewPain) {
this.viewPain = viewPain;
}
public RectF getRectF() {
return rectF;
}
public void setRectF(RectF rectF) {
this.rectF = rectF;
}
}
然后用这个模型，我们去填充一组数据，并把数据绘制出来，请看大屏幕。。。
/**
* 画View
*
* @param canvas
* @param position 第几个view
*/
public void drawBlock(Canvas canvas, int position) {//viewAddressY+ position * (viewWide+padding)+viewHeight
BlockBeen blockBeen;
if (position >= blockBeens.size()) {
blockBeen = new BlockBeen();
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);//创建画笔
paint.setColor(getResources().getColor(R.color.colorPrimaryDark));//添加画笔颜色
blockBeen.setViewPain(paint);
} else {
blockBeen = blockBeens.get(position);
}
if (position == 0) {
blockBeen.setViewAddressX(viewAddressX);
blockBeen.setViewAddressY(viewAddressY - padding - blockBeen.getViewHeight());
} else {
blockBeen.setViewAddressX(viewAddressX + (position - 1) * (viewWide + padding));
blockBeen.setViewAddressY(viewAddressY);
}
blockBeen.setViewWide(viewWide);
blockBeen.setViewHeight(viewHeight);
RectF rectF;
if (blockBeen.getRectF() == null) {
rectF = new RectF(blockBeen.getViewAddressX(), blockBeen.getViewAddressY(),
blockBeen.getViewAddressX() + blockBeen.getViewWide(),
blockBeen.getViewAddressY() + blockBeen.getViewHeight());//先画一个矩形
blockBeen.setRectF(rectF);
} else {
rectF = blockBeen.getRectF();
rectF.set(blockBeens.get(position).getViewAddressX()
, blockBeens.get(position).getViewAddressY(), blockBeens.get(position).getViewAddressX() + blockBeens.get(position).getViewWide()
, blockBeens.get(position).getViewAddressY() + blockBeens.get(position).getViewHeight());
}
if (!blockBeens.contains(blockBeen)) {
blockBeens.add(blockBeen);
}
canvas.drawRoundRect(rectF, 30, 30, blockBeen.getViewPain());//根据提供的矩形为四个角画弧线，（其中的数字：第一个表示X轴方向大小，第二个Y轴方向大小。可以改成其他的，你可以自己体验），最后添加画笔。
//绘制View
invalidate();
}
好了，核心代码已经奉上，根据这个两行代码，大家应该可以明白了这个视图的绘制，关于行参中的position，是因为我为下个动画准备的，下个动画理论是可以无限增加个方块去循环运动，好了。最最最重要的环节，就是让这个方块动起来：
/**
* 移动小方块
* @param position 第几个View移动
* @param goX 在X轴上移动的幅度
* @param goY 在Y轴上移动的幅度
* @param canvas 画布
*/
private void moveTo(int position, int goX, int goY, Canvas canvas) {
// check the borders, and set the direction if a border has reached
if (blockBeens.get(position).getViewAddressX() > (parentWight - MAX_SIZE)) {
goRight = false;
}
if (blockBeens.get(position).getViewAddressX() <= 0) {
goRight = true;
}
if (blockBeens.get(position).getViewAddressY() > (parentHeight - MAX_SIZE)) {
goDown = false;
}
if (blockBeens.get(position).getViewAddressY() <= 0) {
goDown = true;
}
// move the x and y
if (goRight) {
blockBeens.get(position).setViewAddressX(blockBeens.get(position).getViewAddressX() + goX);
} else {
blockBeens.get(position).setViewAddressX(blockBeens.get(position).getViewAddressX() - goX);
}
if (goDown) {
blockBeens.get(position).setViewAddressY(blockBeens.get(position).getViewAddressY() + goY);
} else {
blockBeens.get(position).setViewAddressY(blockBeens.get(position).getViewAddressY() - goY);
}
blockBeens.get(position).getRectF().set(blockBeens.get(position).getViewAddressX()
, blockBeens.get(position).getViewAddressY(), blockBeens.get(position).getViewAddressX() + blockBeens.get(position).getViewWide()
, blockBeens.get(position).getViewAddressY() + blockBeens.get(position).getViewHeight());
canvas.drawRoundRect(blockBeens.get(position).getRectF(), 30, 30, blockBeens.get(position).getViewPain());
invalidate();
}
好了最后奉上这个代码的引用部分，因为另一个动画 是在同一个类里面写的，为了防止读者混淆了，我把那个主要动画放在下一个博客中，当然 完整的整篇代码也会放在下一篇文章中。
引用部分
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="#80000000" tools:context="com.jjf.blockmoveforcirclepath.MainActivity"> android:layout_width="match_parent" android:layout_height="match_parent" />
CSDN看代码比较清晰哦，点这里