NaserShaikh
NaserShaikh

Reputation: 1576

Greeting Card Flip-View Animation

I'm working on greeting card application and i need card flip-view type of View. i've added images for same. I've been through multiple flip-view like libraries and i found android-flipview more suitable for my requirement. I've made changes in this library to make it flip from left corner like greeting card. i'm adding code and screenshot for same.

But, it doesn't work like what i need.

View_Dual_card.java File,I made Changes Like this:

public synchronized void buildTexture(FlipRenderer renderer, GL10 gl) {
        if (screenshot != null) {
            if (texture != null)
                texture.destroy(gl);
            texture = Texture.createTexture(screenshot, renderer, gl);
            recycleScreenshot();

            topCard.setTexture(texture);
            bottomCard.setTexture(texture);

            final float viewHeight = texture.getContentHeight();
            final float viewWidth = texture.getContentWidth();
            final float textureHeight = texture.getHeight();
            final float textureWidth = texture.getWidth();

            if (orientationVertical) {
                topCard.setCardVertices(new float[] { 0f, viewHeight, 0f, // top left
                        0f, viewHeight / 2.0f, 0f, // bottom left
                        viewWidth, viewHeight / 2f, 0f, // bottom right
                        viewWidth, viewHeight, 0f // top right
                });

                topCard.setTextureCoordinates(new float[] { 0f, 0f, 0f,
                        viewHeight / 2f / textureHeight,
                        viewWidth / textureWidth,
                        viewHeight / 2f / textureHeight,
                        viewWidth / textureWidth, 0f });

                bottomCard.setCardVertices(new float[] { 0f, viewHeight / 2f,
                        0f, // top left
                        0f, 0f, 0f, // bottom left
                        viewWidth, 0f, 0f, // bottom right
                        viewWidth, viewHeight / 2f, 0f // top right
                        });

                bottomCard.setTextureCoordinates(new float[] { 0f,
                        viewHeight / 2f / textureHeight, 0f,
                        viewHeight / textureHeight, viewWidth / textureWidth,
                        viewHeight / textureHeight, viewWidth / textureWidth,
                        viewHeight / 2f / textureHeight });
            } else {
                topCard.setCardVertices(new float[] { 0f, viewHeight, 0f, // top left
                        0f, 0f, 0f, // bottom left
                        viewWidth /27f, 0f, 0f, // bottom right
                        viewWidth /27f, viewHeight, 0f // top right
                });

                topCard.setTextureCoordinates(new float[] { 0f, 0f, 0f,
                        viewHeight / textureHeight,
                        viewWidth / 27f / textureWidth,
                        viewHeight / textureHeight,
                        viewWidth / 27f / textureWidth, 0f });

                bottomCard.setCardVertices(new float[] {0f,
                        viewHeight, 0f, // top left
                        0f, 0f, 0f, // bottom left
                        viewWidth, 0f, 0f, // bottom right
                        viewWidth, viewHeight, 0f // top right
                        });

                bottomCard.setTextureCoordinates(new float[] {
                        viewWidth /27f / textureWidth, 0f,
                        viewWidth /27f / textureWidth,
                        viewHeight / textureHeight, viewWidth / textureWidth,
                        viewHeight / textureHeight, viewWidth / textureWidth,
                        0f });
            }

            checkError(gl);
        }
    }

What i want:

enter image description here enter image description hereenter image description here

What i'm getting:

enter image description here enter image description here enter image description here

thanks in advance.

Upvotes: 1

Views: 2724

Answers (3)

anar
anar

Reputation: 599

The image appears to be skewing. Make sure you view area is larger than the original card.

Upvotes: 0

Shadow
Shadow

Reputation: 6899

It's better you can use page curl which is simple and open source to use.https://code.google.com/p/android-page-curl/ Hope this might help you.

Upvotes: 1

Snicolas
Snicolas

Reputation: 38168

This animation is a simple scale and skew animation.

Upvotes: 0

Related Questions