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.xml
with 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>