Android floating category animation Analysis and Implementation !, Android floating

Android floating category animation Analysis and Implementation !, Android floating

Respect Original, welcome to reprint, reprint Please note: FROM GA_studio http://blog.csdn.net/tianjian4592

Note: For some reason, this article mainly describes the idea of dynamic efficiency analysis and does not provide source code download. Please forgive me ......

In the previous article, I only talked about the drawBitmap method in the Canvas, and the method also seems very greasy and can make a lot of awesome results, the next article is just to serve as a small chestnut in the previous article, and further expands the idea of using drawBitmap to achieve dynamic effects!

Well, the first distortion cannot be lost again:

Let's first analyze the above results:

Assume that you have just obtained the above animation design drawing from UE or animation shot chicken wet hand. What you see is the vast starry sky, the deep and vast universe created by the floating planet, well, there's not much BB. What kind of implementation solution will you think?

1. Some may think of creating a corresponding number of imageviews, and then using Animation or Animator for each ImageView for the corresponding moving effect;

2. Use your own Rendering Method for implementation. Isn't it just a floating planet;

Needless to say, the second solution above is certainly more desirable. The first solution has the following defects:

1. Too many views are created, resulting in poor performance;

2. Poor flexibility. For example, it is troublesome for UE or products to increase or decrease the number of planets;

3. Make a mobile animation for each view. The overhead is too large to be controllable or modified;

In view of this, we are unswervingly following our own route to complete the floating animation;

To draw a map, you must first obtain the bitmap of the planet and obtain all the bitmaps based on the type of the planet:

    /**     * init bitmap info     */    private void initBitmapInfo() {        mBackBitmap = ((BitmapDrawable) mResources.getDrawable(R.drawable.back))                .getBitmap();        mBackWidth = mBackBitmap.getWidth();        mBackHeight = mBackBitmap.getHeight();        mStarOne = ((BitmapDrawable) mResources.getDrawable(R.drawable.star2))                .getBitmap();        mStarOneWidth = mStarOne.getWidth();        mStarOneHeight = mStarOne.getHeight();        mStarTwo = ((BitmapDrawable) mResources.getDrawable(R.drawable.star1))                .getBitmap();        mStarTwoWidth = mStarTwo.getWidth();        mStarTwoHeight = mStarTwo.getHeight();        mStarThree = ((BitmapDrawable) mResources.getDrawable(R.drawable.star3))                .getBitmap();        mStarThreeWidth = mStarThree.getWidth();        mStarThreeHeight = mStarThree.getHeight();    }

We have obtained the background and three types of planet bitmaps. Based on the above results, we will analyze the characteristic data:

1. The same planet is large and small;

2. There is a transparency difference between each other;

3. The floating direction is different;

4. The floating speed is different;

5. Each planet has its own location;

For the moment, we only analyze so much. Based on this, we abstract the planet objects:

/*** Planet * @ author AJian */private class StarInfo {// scaling ratio float sizePercent; // x position int xLocation; // y position int yLocation; // transparency float alpha; // float direction int direction; // floating speed int speed ;}

To get some of the above data, we first write some data or methods:

1. In order to initialize the location of the planet, we use arrays to first define the location of a group of planets (based on the ratio of the view width to the height). Of course, you can also be random, but a random heap may occur:

private static final float[][] STAR_LOCATION = new float[][] {            {0.5f, 0.2f}, {0.68f, 0.35f}, {0.5f, 0.05f},            {0.15f, 0.15f}, {0.5f, 0.5f}, {0.15f, 0.8f},            {0.2f, 0.3f}, {0.77f, 0.4f}, {0.75f, 0.5f},            {0.8f, 0.55f}, {0.9f, 0.6f}, {0.1f, 0.7f},            {0.1f, 0.1f}, {0.7f, 0.8f}, {0.5f, 0.6f}    };

2. method for obtaining the planet size (based on the original Bitmap scaling ratio ):

/*** Get the planet size */private float getStarSize (float start, float end) {float nextFloat = (float) Math. random (); if (start <nextFloat & nextFloat <end) {return nextFloat;} else {// if it is not in the desired data segment, it is random again, because continuous recursion is risky, return (float) Math. random ();}}

3. Define three floating speeds at different speeds:

        mFloatTransLowSpeed = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 0.5f,                mResources.getDisplayMetrics());        mFloatTransMidSpeed = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 0.75f,                mResources.getDisplayMetrics());        mFloatTransFastSpeed = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 1f,                mResources.getDisplayMetrics());

4. How to get the floating direction of the planet:

/*** Initialize the operation direction of the planet */private int getStarDirection () {Random random = new Random (); int randomInt = random. nextInt (4); int direction = 0; switch (randomInt) {case 0: direction = LEFT; break; case 1: direction = RIGHT; break; case 2: direction = TOP; break; case 3: direction = BOTTOM; break; default: break;} return direction ;}

With the above data and methods, we first initialize a certain amount of planet data:

/*** Initialize planet information */private void initStarInfo () {StarInfo starInfo = null; Random random = new Random (); for (int I = 0; I <mStarCount; I ++) {// obtain the ratio of the planetary size float starSize = getStarSize (0.4f, 0.9f); // initialize the planetary size float [] starLocation = STAR_LOCATION [I]; starInfo = new StarInfo (); starInfo. sizePercent = starSize; // initialization floating speed int randomSpeed = random. nextInt (3); switch (randomSpeed) {case 0: starInfo. speed = mFloatTransLowSpeed; break; case 1: starInfo. speed = mFloatTransMidSpeed; break; case 2: starInfo. speed = mFloatTransFastSpeed; break; default: starInfo. speed = mFloatTransMidSpeed; break;} // initialize starInfo. alpha = getStarSize (0.3f, 0.8f); // initialize starInfo. xLocation = (int) (starLocation [0] * mTotalWidth); starInfo. yLocation = (int) (starLocation [1] * mTotalHeight); log ("xLocation =" + starInfo. xLocation + "-- yLocation =" + starInfo. yLocation); log ("stoneSize =" + starSize + "--- stoneAlpha =" + starInfo. alpha); // initialize the starInfo location of the planet. direction = getStarDirection (); mStarInfos. add (starInfo );}}

With this data, we can draw the planet on the screen:

 private void drawStarDynamic(int count, StarInfo starInfo,            Canvas canvas, Paint paint) {        float starAlpha = starInfo.alpha;        int xLocation = starInfo.xLocation;        int yLocation = starInfo.yLocation;        float sizePercent = starInfo.sizePercent;        xLocation = (int) (xLocation / sizePercent);        yLocation = (int) (yLocation / sizePercent);        Bitmap bitmap = null;        Rect srcRect = null;        Rect destRect = new Rect();        if (count % 3 == 0) {            bitmap = mStarOne;            srcRect = mStarOneSrcRect;            destRect.set(xLocation, yLocation,                    xLocation + mStarOneWidth, yLocation                            + mStarOneHeight);        } else if (count % 2 == 0) {            bitmap = mStarThree;            srcRect = mStarThreeSrcRect;            destRect.set(xLocation, yLocation, xLocation                    + mStarThreeWidth, yLocation + mStarThreeHeight);        } else {            bitmap = mStarTwo;            srcRect = mStarTwoSrcRect;            destRect.set(xLocation, yLocation, xLocation                    + mStarTwoWidth, yLocation + mStarTwoHeight);        }        paint.setAlpha((int) (starAlpha * 255));        canvas.save();        canvas.scale(sizePercent, sizePercent);        canvas.drawBitmap(bitmap, srcRect, destRect, paint);        canvas.restore();    }

The next thing to consider is how to make the planet move. With the above data and ideas, we believe that it is not difficult for everyone to make the planet move. Just according to the direction of the planet movement, you can increase or decrease the size of x and y of the planet during each re-painting:

private void resetStarFloat(StarInfo starInfo) {        switch (starInfo.direction) {            case LEFT:                starInfo.xLocation -= starInfo.speed;                break;            case RIGHT:                starInfo.xLocation += starInfo.speed;                break;            case TOP:                starInfo.yLocation -= starInfo.speed;                break;            case BOTTOM:                starInfo.yLocation += starInfo.speed;                break;            default:                break;        }    }

At this time, some may say, What should we do if Nima and planet are directly removed from the screen? I believe everyone can solve this problem, but it is just a matter of judgment and repair, and I will not say more;

Finally, let's take a look at this kind of animation effect. In fact, a large part of it is similar to the above animation effect. Do not believe it? Let me give you a few examples:

1. Snowflake Falling Effect

Nima! Is snowflake similar to this? Snowflakes fly down and rotate;

For this purpose, we only need to add the Rotation Angle and rotation speed when extracting objects (for problems with rotation, you can refer to a brilliant loading Dynamic Efficiency Analysis and Implementation !), As for the problem of flying from top to bottom, we only need to modify the update policies of x and y;

2. The Falling petals and colorful effects of many desktop applications;

The above analysis and implementation principles are basically used. It is important to extract and use data flexibly. Others are the data to be updated dynamically based on specific requirements, such as location, size, transparency, etc;

Therefore, the above results are not complex. All we need to do is to break down and extract complex dynamic effects and find the most suitable implementation method for each small point, make the most efficient, and then break through them one by one;

In the process of writing, I will try my best to describe my ideas clearly, because in my opinion, the most important thing to do is to take effect apart, link up, and solve, the idea is clear, and the solution is generally clear;