1

I'm trying to create a finger sliding effect to my application. I saw that in many app when you slide your finger from left to right another page opens. How can i add this to my application? I want to add few thing like about, feedback,etc in this page.

How can i do this? What command should i use?

captainblack
  • 4,107
  • 5
  • 50
  • 60
Anish688
  • 81
  • 11
  • see http://stackoverflow.com/questions/9078727/change-of-activity-with-the-slide-of-the-finger and http://stackoverflow.com/questions/2697799/android-how-can-i-make-my-page-slide-as-the-user-slides-finger-on-the-screen – Shayan Pourvatan Jan 26 '14 at 05:34

2 Answers2

2

If you want to create a slideable screen, you shall go on ViewPager

ViewPager is a View (like EditText, TextView) that have all you need to create what you want.

First you need to create a xml file that have one ViewPager inside, all the area covered by the ViewPager will be slideable. You can, for exemple, build a layout that have the half of the screen filled by a LinearLayout and the other half by the ViewPager, if you do this, everything inside the LinearLayout will be static, and everything inside the ViewPager will be "slideable".

Lets create a XML file called main.xmlwith just one ViewPager that fills the entire screen.

<android.support.v4.view.ViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/activity_main_viewpager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"/>

Then, create any layout you want, with TextViews, anything, lets call it as fragment_page1.xml. Create a second layout, with anything you want, lets call it as fragment_page2.xml.

Now, your MainActivity.java:

public class MainActivity extends FragmentActivity { //not Activity, but FragmentActivity


    ViewPager viewPager;

    PagerAdapter pagerAdapter;

    int FIRST_PAGE = 0;

    int SECOND_PAGE = 1;









    @Override
    public void onCreate(Bundle bundle){

        super.onCreate(bundle);

        setContentView(R.layout.main);



        viewPager = (ViewPager) findViewById(R.id.activity_main_viewpager);

        pagerAdapter = new MyViewPagerAdapter(getSupportFragmentManager()); //see below

        viewPager.setAdapter(pagerAdapter);

        viewPager.setCurrentItem(0);

    }







    //this happens when you press the back button
    @Override
    public void onBackPressed(){

        //Check if you are on your first page
        if(viewPager.getCurrentItem() == 0){

            //If yes, quit app
            super.onBackPressed();

        } 


        else{

            //if not, go to previous page
            viewPager.setCurrentItem(viewPager.getCurrentItem() - 1);

        }


    }








    private class MyViewPagerAdapter extends FragmentStatePagerAdapter{








        public MyViewPagerAdapter(FragmentManager fm){

            super(fm);

        }








        @Override
        public int getCount(){

            return 2; //place the number of pages you want, in this case, only two pages

        }









        @Override
        public Fragment getItem(int position){

            //position count starts from 0, so if you have 3 pages, the count will be 0, 1 and 2
            if(position == FIRST_PAGE){ // first page 

                return new FragmentFirstPage();  // show first page

            }


            else if(position == SECOND_PAGE){ // second page

                return new FragmentSecondPage(); // show second page

            }



            //keep doing the same thing for how many pages you have



            else{

                 return null; //show a null page, generally you will never reach here

            }






        }

    }







}

Now we need to create 2 classes, FragmentFirstPage and FragmentSecondPage, you need one for each page you would like to show. Lets create your FragmentFirstPage.java

//this class you will use to handle button clicks, touch events, anything you have inside your fragment_page1.xml

    public class FragmentFirstPage extends Fragment{


    View root;




    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle bundle){

        root = inflater.inflate(R.layout.fragment_page1, container, false);

                //If you want to retrieve a textview inside fragment_page1.xml for example, you shall do:
                //TextView text = (TextView) root.findViewById(R.id.blablabla); 

        return root;

    }



}

Now, this is your FragmentSecondPage.java

public class FragmentSecondPage extends Fragment{


    View root;




    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle bundle){

        root = inflater.inflate(R.layout.fragment_page2, container, false); 

        return root;

    }



}

Run your app, you may be able to swype throught 2 pages :)

Hope it helps!

= UPDATE =

If you want the half of the screen to be filled by a LinearLayout:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical">

        <!-- Here, add any views you want -->

    </LinearLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/activity_main_viewpager"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

</LinearLayout>
Murillo Ferreira
  • 1,423
  • 1
  • 16
  • 31
  • How should I build a layout that has the half of the screen filled by a LinearLayout and the other half by the ViewPager? What kind of layout should i use for main.xml file i create in doing this? Also gave me error at line public Fragment getItem(int position) in main activity – Anish688 Jan 26 '14 at 09:53
  • About what I said about "half of the screen" was just a example. All you need on your main.xml is what I wrote above, a single ViewPager that fill all the screen. Ooh sorry, I updated that part of the code! – Murillo Ferreira Jan 26 '14 at 10:22
  • 1
    The example you gave me worked perfectly as i wanted. I'll try to add it to my application thanks alot. – Anish688 Jan 26 '14 at 11:12
  • You are welcome : ) Please, don't forget to accept this as right answer, just mark the "V" below the 0 on the left-top of this answer, so others can see how to do it. Good luck! – Murillo Ferreira Jan 26 '14 at 11:21
  • It is working well in my program but i'M FACING ONE PROBLEM I.E I have put my main page as FragmentSecond and the options page as FragmentFirst and i want to load the FragmentSecond as my starting page in which when slided from left to right it should show me FragmentFirst and back button shows me FragmentSecond. I tried few thing but i can't get it straight. Could you please help me out here too. Please – Anish688 Jan 26 '14 at 12:06
  • You can do it by renaming the xml files, in your project, click on the file then press F2, change the name of fragment_page1 to fragment_page2 and vice versa – Murillo Ferreira Jan 26 '14 at 12:20
  • Also, rename the FragmentFirst to FragmentSecond and vice versa to keep the logic of the files names – Murillo Ferreira Jan 26 '14 at 12:26
  • I tried many combinations but can't achieve it also how can i make each content in the xml files to open the other xml files. I treid but it doesn't work? This is inside Fragment First i want to do the same for other button and textview in FragmentSecond too? – Anish688 Jan 26 '14 at 12:41
  • Ooh, I forgot that eclipse update references so renaming the files wont work. To switch the position of the pages, inside: public fragment getItem, invert the position of the return values, instead of new FragmentFirst then new FragmentSecond, should be newFragmentSecond then FragmentFirst. – Murillo Ferreira Jan 26 '14 at 12:59
  • android:onclick="myMethodName" gives a click event to the app and send it inside his activity, you have to add @Override.. public void myMethodName (View v) inside your MainActivity then give the commands to it, if you still have problems with this i suggest you to open a new question, paste the link here and I answer to you : ) – Murillo Ferreira Jan 26 '14 at 13:07
  • I tried that too it doesn't work my question is how can i make the second fragment the default fragment so that when i slide from left to right i can view the first fragment. – Anish688 Jan 26 '14 at 13:07
  • Ok i have created a new thread [link](http://stackoverflow.com/questions/21363798/how-can-i-use-a-button-to-open-an-xml-file-in-my-project) could you please help me. – Anish688 Jan 26 '14 at 13:13
  • I'll check your question. I updated this answer, now, just invert the values of FIRST_PAGE and SECOND_PAGE to invert you fragment order : ) – Murillo Ferreira Jan 26 '14 at 13:26
1

A view pager does exactly the same thing as you require. Please check the documentation here

http://developer.android.com/reference/android/support/v4/view/ViewPager.html

Ajit Pratap Singh
  • 1,299
  • 12
  • 24