Hasmukh
Hasmukh

Reputation: 4670

Vertical 3dCarousel animation in android?

How i can achieve this animation in android, here below is the link which i have tried to modify it but there is no output like below image.

enter image description here

http://horribile.blogspot.in/2011/11/android-3d-carousel.html

https://github.com/rameshkec85/Android-VerticalCarousel

i have modify below function for vertical animation as below.

private void Calculate3DPosition(CarouselItem child, int diameter,
            float angleOffset) {

    angleOffset = angleOffset * (float) (Math.PI / 180.0f);
    float x = 0.0f;
    float y = (float) (diameter / 2 * Math.sin(angleOffset)) + diameter / 2 - child.getWidth() / 2;
    float z = diameter / 2 * (1.0f - (float) Math.cos(angleOffset));                 

    child.setItemX(x);
    child.setItemZ(z);
    child.setItemY(y);
    }

when i implement this as a result, animation is not work properly and also image is not display in center correctly.

does any body have implement this animation correctly, Please send me.

Thanks in Advance.

Upvotes: 4

Views: 3416

Answers (2)

Hasmukh
Hasmukh

Reputation: 4670

i have achieved this animation.

Below is the link for horizontal carousel animation which is most popular.

Androd 3d carousel animation

Now, here is the changes to achieve vertical carousel animation from above animation.

Carousel.java

  1. onFling : Change velocityX To velocityY

  2. onScroll : Change trackMotionScroll(/* -1 * / (int) distanceX); To trackMotionScroll(/ -1 * */ (int) distanceY);

  3. scrollIntoSlots : change "if (angle != 0.0f)" to "if (Math.abs(angle) > 4)"

  4. Calculate3DPosition :

    angleOffset = angleOffset * (float) (Math.PI / 180.0f);

        float x = (screenWidth - child.getWidth())/2;       
        float y = (float) (diameter / 2 * Math.sin(angleOffset)) + diameter / 2 - child.getWidth() / 2;
        float z = diameter*2 * (1.0f - (float) Math.cos(angleOffset));
    
        child.setItemX(x);
        child.setItemZ(z);
        child.setItemY(y-(screenHeight - child.getHeight())/2);
    

Enjoy carousel animation.

Upvotes: 6

Gil Moshayof
Gil Moshayof

Reputation: 16761

First of all, try setting:

float x = child.getWidth() / 2;

That should solve the image not being centered problem. The y & z look ok, but maybe try changing the y placement to take into account the view's height instead of it's width?:

float y = (float) (diameter / 2 * Math.sin(angleOffset)) + diameter / 2 - child.getHeight() / 2;

Not sure if this'll work since I didn't set the project up, but I hope it'll get you closer at least :)

Good luck!

Upvotes: 2

Related Questions