How Can I Create A Sliding Layout, Like The Main Android Menu?

I need to create an application with 4 view. I need to pass from a view to an other simply by a touch and a move to the left or to the right (no button). The effect I would like is

Solution 1:

Finally I made it. This is my solution. First of all you need to define a main layout, that contains the child layout.

<?xml version="1.0" encoding="utf-8"?><RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent"
    ><ViewFlipperandroid:id="@+id/ViewFlipper01"android:layout_width="fill_parent"android:layout_height="fill_parent"
    ><includeandroid:id="@+id/libraryView1"layout="@layout/page_1" /><includeandroid:id="@+id/libraryView2"layout="@layout/page_2" /></ViewFlipper></RelativeLayout>

where page_1 and page_2 are the layout that I need to exchange. Those layout are absolutely standard layout, made as you prefear.

Then you need an activity:

publicclassMainextendsActivity {

    private ViewFlipper vf;

    privatefloat oldTouchValue;

    /** Called when the activity is first created. */@OverridepublicvoidonCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        vf=(ViewFlipper)findViewById(R.id.ViewFlipper01);
    }

    @OverridepublicbooleanonTouchEvent(MotionEvent touchevent) {
        switch (touchevent.getAction())
        {
            case MotionEvent.ACTION_DOWN:
            {
                oldTouchValue = touchevent.getX();
                break;
            }
            case MotionEvent.ACTION_UP:
            {
                //if(this.searchOk==false) return false;floatcurrentX= touchevent.getX();
                if (oldTouchValue < currentX)
                {
                   vf.setInAnimation(inFromLeftAnimation());
                   vf.setOutAnimation(outToRightAnimation());
                    vf.showNext();
                }
                if (oldTouchValue > currentX)
                {
                    vf.setInAnimation(inFromRightAnimation());
                    vf.setOutAnimation(outToLeftAnimation());
                    vf.showPrevious();
                }
            break;
            }
        }
        returnfalse;
    }

    //for the previous movementpublicstatic Animation inFromRightAnimation() {

        AnimationinFromRight=newTranslateAnimation(
        Animation.RELATIVE_TO_PARENT,  +1.0f, Animation.RELATIVE_TO_PARENT,  0.0f,
        Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,   0.0f
        );
        inFromRight.setDuration(350);
        inFromRight.setInterpolator(newAccelerateInterpolator());
        return inFromRight;
        }
    publicstatic Animation outToLeftAnimation() {
        AnimationouttoLeft=newTranslateAnimation(
         Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,  -1.0f,
         Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,   0.0f
        );
        outtoLeft.setDuration(350);
        outtoLeft.setInterpolator(newAccelerateInterpolator());
        return outtoLeft;
        }    
    // for the next movementpublicstatic Animation inFromLeftAnimation() {
        AnimationinFromLeft=newTranslateAnimation(
        Animation.RELATIVE_TO_PARENT,  -1.0f, Animation.RELATIVE_TO_PARENT,  0.0f,
        Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,   0.0f
        );
        inFromLeft.setDuration(350);
        inFromLeft.setInterpolator(newAccelerateInterpolator());
        return inFromLeft;
        }
    publicstatic Animation outToRightAnimation() {
        AnimationouttoRight=newTranslateAnimation(
         Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,  +1.0f,
         Animation.RELATIVE_TO_PARENT,  0.0f, Animation.RELATIVE_TO_PARENT,   0.0f
        );
        outtoRight.setDuration(350);
        outtoRight.setInterpolator(newAccelerateInterpolator());
        return outtoRight;
        }    
}

Tada! Done!

Solution 2:

I think what you're looking for is a SlidingDrawer. With that, you could so something like this:

<SlidingDrawerandroid:id="@+id/drawer"android:layout_width="match_parent"android:layout_height="match_parent"android:handle="@+id/handle"android:content="@+id/content"><ImageViewandroid:id="@id/handle"android:layout_width="88dip"android:layout_height="44dip" /><GridViewandroid:id="@id/content"android:layout_width="match_parent"android:layout_height="match_parent" /></SlidingDrawer>

Solution 3:

You mean like the home screen where you can swipe between views and it snaps at each one? This might help you out.

Solution 4:

I think you can use layout animation for the purpose..

res/anim/popin.xml:

<setxmlns:android="http://schemas.android.com/apk/res/android"android:interpolator="@android:anim/accelerate_interpolator"><scaleandroid:fromXScale="0.0"android:toXScale="1.0"android:fromYScale="0.0"android:toYScale="1.0"android:pivotX="50%"android:pivotY="50%"android:duration="400" 
  /></set>

res/anim/popinlayout.xml:

<layoutAnimationxmlns:android="http://schemas.android.com/apk/res/android"android:delay="0.5"android:animationOrder="random"android:animation="@anim/popin" 
/>

Source:

// Applying a Layout Animation and Animation Listener
aViewGroup.setLayoutAnimationListener(newAnimationListener() {
  publicvoidonAnimationEnd(Animation _animation) {
    // TODO: Actions on animation complete. 
  }
  publicvoidonAnimationRepeat(Animation _animation) {}
  publicvoidonAnimationStart(Animation _animation) {}
});

aViewGroup.scheduleLayoutAnimation();