How can i make a dynamic flipping screen(like that of iPhone) in Android

Question

I am parsing data through the web service. I want the flipping horizontally rather than vertically. Here is a tutorial where ViewFlipper is used but it is for static data.

---

Here is our code where we need flipping between 2 activities:

Splash.java

public class Splash extends Activity{

        /** Called when the activity is first created. */

        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);

            setContentView(R.layout.main);

                    startActivity(new Intent(Splash.this, MainMenu.class));
                    Splash.this.finish();                                     
        }
    }

Splash.xml

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/splash">
</AbsoluteLayout>

Menu.java

public class Menu extends Activity{

        /** Called when the activity is first created. */

        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);               
            setContentView(R.layout.menu);                                       
        }
    }

Menu.xml

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/menu">
</AbsoluteLayout>

Terse

check this answer – Indeterminacy

What do you mean "Here is a tutorial where ViewFlipper is used "? – Opsis

Answer 1

You can add pages to a ViewFlipper dynamically using addView.

  flipper= (ViewFlipper) findViewById(R.id.flipper1);
  flipper.addView(myView,myViewIndex);

Where myView is the view you wish to add, and myViewIndex is the index in the viewflipper you want to add this new view.

You can then set the animations to preform on changing of views:

  flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.left_in));
  flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.left_out));

Then to flip to this page you can use:

  flipper.setDisplayedChild(myViewIndex);

Where left_in.xml is defined as

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" 
  android:interpolator="@android:anim/accelerate_interpolator">
    <translate
    android:interpolator="@android:anim/decelerate_interpolator"
    android:fromXDelta="100%p"
    android:toXDelta="0" 
    android:duration="300"
    />
</set>

and left_out.xml is:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/accelerate_interpolator"
    >
    <translate
    android:interpolator="@android:anim/decelerate_interpolator"
    android:fromXDelta="0" 
    android:toXDelta="-100%p" 
    android:duration="300"
    />
</set>

Greggs

Suppose we have 2 activities with their respective xml files: Splash Activity ->splash.xml Menu activity ->menu.xml Now how we can flip between these 2 activities? That is from splash to menu and vice versa. – Terse

We'll if they are two different activities then this is a completely different question as your not going to be using ViewFlipper. If they are just two different views defined in XML, then you would simply add them both to the viewflipper and use setDisplayedChild to flip between them. – Greggs

I see! So it is possible to have iPhone like flipping between 2 different activities in android. Can you please post the required code keeping in view of the above scenario.Because this is something we are doing for the first ever time. – Terse

I added another answer that I think answers your question now that I understand better. – Greggs

We have the code running on Android 2.0 but not on 1.6. Wonder what's the required code for 1.6? Thank you so much for your input and technical help. – Terse

I've tried to use this but I've hit a wall, I've followed your code but when I display my view it becomes a mix of the view thats already displayed and the one I want to flip to. Any ideas where I'm going wrong? – Velate

Answer 2

Just had a quick look for you because I was sure I've seen it around before, I found this on developer.android.com:

public void overridePendingTransition (int enterAnim, int exitAnim)

Since: API Level 5
Call immediately after one of the flavors of startActivity(Intent) or finish() to specify an explicit transition animation to perform next.
Parameters
enterAnim   A resource ID of the animation resource to use for the incoming activity. Use 0 for no animation.
exitAnim    A resource ID of the animation resource to use for the outgoing activity. Use 0 for no animation.

So you can add this extra parameter to your intent which will define how the activity you call will animate on entrance of new activity and exit of old activity.

Greggs

correct and works like a charm.. more can be found at developer.android.com/resources/samples/ApiDemos/src/com/… one important thing.. this method is supported in API Level 5 and above as mentioned by stealthcopter too. – Lepidolite

Answer 3

If you want to navigate between two activities and not use a view flipper you can use normal intents. Wrote a tutorial so that you can animate your activity's in and out,

Enjoy:

http://blog.blundellapps.co.uk/animate-an-activity/

Aedile

The given link is no longer available. – Hyksos

@LetMeBeYourLostDisciple It's pretty old but I updated the link – Aedile

Answer 4

Do you just want the screen to rotate based off of the position it is being held in (as determined by the accelerometer sensors)?

If so just add

android:screenOrientation="sensor"

to the Activity node in your AndroidManifest.xml file

Titanite

Nothing to do with accelerometer. I want my page/screen to flip just like it does in iPhone. – Terse

So are you asking about a flipping animation then? My iPhone experience is limited so it is not entirely clear to me when you say "flip like it does on the iPhone" sorry – Titanite