Android: QQ implementation of multiple slide menus

Android: QQ implementation of multiple slide menus

However, this menu effect is just a normal side pull effect. We can also implement a drawer-style slide menu, just like this.

First Effect

Second Effect

Third Effect

Fourth Effect

The other code is the same as the previous article, but the onScrollChanged method is rewritten in MyHorizontalScrollView. class.

The code for the first slide effect is very simple.

 

@Overrideprotected void onScrollChanged(int l, int t, int oldl, int oldt) {// TODO Auto-generated method stubsuper.onScrollChanged(l, t, oldl, oldt);ViewHelper.setTranslationX(mMenu, l);}

Use the setTranslationX method to set the x coordinate offset of mMenu, where l = getScrollX ()

 

After setting these settings, you can achieve this slide effect.

The code for the second slide effect is similar to the code for the first method, except that the offset of the x coordinate of mMenu is increased by one factor, making the mMenu menu appear from the right.

 

@Overrideprotected void onScrollChanged(int l, int t, int oldl, int oldt) {// TODO Auto-generated method stubsuper.onScrollChanged(l, t, oldl, oldt);ViewHelper.setTranslationX(mMenu, 2*l);}

In the third slide effect, we found that a zooming animation is used, so there must be a 0 ~ 1. Because the initial l = getScrollX () = mMenuWidth and the final l = 0, we can get

// Scale 1 ~ 0 change rate float scale = l * 1.0f/mMenuWidth;

The Code is as follows:

@ Overrideprotected void onScrollChanged (int l, int t, int oldl, int oldt) {// TODO Auto-generated method stubsuper. onScrollChanged (l, t, oldl, oldt); // scale 1 ~ 0 change rate float scale = l * 1.0f/mMenuWidth; // The scaling ratio of Content is 1 ~ 0.7 float rightScale = scale * 0.3f + 0.7f; // sets the zoom center ViewHelper. setmediatx (mContent, 0); ViewHelper. setequalty (mContent, mContent. getHeight ()/2); // scale ViewHelper. setScaleX (mContent, rightScale); ViewHelper. setScaleY (mContent, rightScale );}

Why do I set the zoom center to mContent x = 0 y = height/2 so that the distance between the left side of the mContent and the right side of the screen remains unchanged after the slide, or the distance will also be scaled?

In the fourth effect, we will find that the effect of mMenu on the left is different, and the scaling and transparency are achieved.

The Code is as follows:

@ Overrideprotected void onScrollChanged (int l, int t, int oldl, int oldt) {// TODO Auto-generated method stubsuper. onScrollChanged (l, t, oldl, oldt); // scale 1 ~ 0 change rate float scale = l * 1.0f/mMenuWidth; // The scaling ratio of Content is 1 ~ 0.7 float rightScale = scale * 0.3f + 0.7f; // The Menu transparency changes from 0 ~ 1 float leftAlpha = 1.0f-scale; // Menu scaling change 0.3-1.0 float leftScale = 1.0f-scale * 0.7f; // mContent sets the scaling center ViewHelper. setmediatx (mContent, 0); ViewHelper. setequalty (mContent, mContent. getHeight ()/2); // mContent for scaling ViewHelper. setScaleX (mContent, rightScale); ViewHelper. setScaleY (mContent, rightScale);/** scale mMenu and set transparency **/ViewHelper. setScaleX (mMenu, leftScale); ViewHelper. setScaleY (mMenu, leftScale); ViewHelper. setAlpha (mMenu, leftAlpha );}

This effect is achieved.

In the past two days, I have also tried the rectangular flip effect simulator. It's successful on the real machine, so I won't post it. It's a waste of time o (too many) o alas.

What is the side pull effect of qqv6.2.3?

The Code is as follows:

@Overrideprotected void onScrollChanged(int l, int t, int oldl, int oldt) {// TODO Auto-generated method stubsuper.onScrollChanged(l, t, oldl, oldt);ViewHelper.setTranslationX(mMenu, l*0.6f);}

Effect

These animations may seem quite simple to others. I 've been thinking for a long time, a day and a half, and a matrix switch .,.~~ NN, DFAGDAJFHJK

I saw qq and remembered that today is my birthday. I dare not think that this year's second year is so big.

Happy birthday.