Thursday 2 May 2013

view pager with tab on top example

1) LayoutOne.java
=============

import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class LayoutOne extends Fragment {


    public static Fragment newInstance(Context context) {
        LayoutOne f = new LayoutOne();   
       
        return f;
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
        ViewGroup root = (ViewGroup) inflater.inflate(R.layout.layout_one, null);       
        return root;
    }
   
}
2)LayoutTwo.java
===========

import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class LayoutTwo extends Fragment {


    public static Fragment newInstance(Context context) {
        LayoutTwo f = new LayoutTwo();   
       
        return f;
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
        ViewGroup root = (ViewGroup) inflater.inflate(R.layout.layout_two, null);       
        return root;
    }
   
}
3)ViewPagerAdapter.java
==================
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

public class ViewPagerAdapter extends FragmentPagerAdapter {
    private Context _context;
   
    public ViewPagerAdapter(Context context, FragmentManager fm) {
        super(fm);   
        _context=context;
       
        }
    @Override
    public Fragment getItem(int position) {
        Fragment f = new Fragment();
        switch(position){
        case 0:
            f=LayoutOne.newInstance(_context);   
            break;
        case 1:
            f=LayoutTwo.newInstance(_context);   
            break;
        }
        return f;
    }
    @Override
    public int getCount() {
        return 2;
    }

}
4)ViewPagerStyle1Activity.java
===================
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;



public class ViewPagerStyle1Activity extends FragmentActivity {
    private ViewPager _mViewPager;
    private ViewPagerAdapter _adapter;
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        setUpView();
        setTab();
    }
    private void setUpView(){       
        _mViewPager = (ViewPager) findViewById(R.id.viewPager);
     _adapter = new ViewPagerAdapter(getApplicationContext(),getSupportFragmentManager());
     _mViewPager.setAdapter(_adapter);
     _mViewPager.setCurrentItem(0);
    }
    private void setTab(){
            _mViewPager.setOnPageChangeListener(new OnPageChangeListener(){
                       
                        @Override
                        public void onPageScrollStateChanged(int position) {}
                        @Override
                        public void onPageScrolled(int arg0, float arg1, int arg2) {}
                        @Override
                        public void onPageSelected(int position) {
                            // TODO Auto-generated method stub
                            switch(position){
                            case 0:
                                findViewById(R.id.first_tab).setVisibility(View.VISIBLE);
                                findViewById(R.id.second_tab).setVisibility(View.INVISIBLE);
                                break;
                               
                            case 1:
                                findViewById(R.id.first_tab).setVisibility(View.INVISIBLE);
                                findViewById(R.id.second_tab).setVisibility(View.VISIBLE);
                                break;
                            }
                        }
                       
                    });

    }
}

5) indicator.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <TableLayout
        style="@style/layout_f_w"
        android:stretchColumns="*" >
        <TableRow
            android:background="#dddddd"
            android:id="@+id/tableRow1"
            style="@style/layout_wrap" >
           
             <!-- First Tab indicator -->
                <LinearLayout
                style="@style/indicator_style"
                android:id="@+id/first_tab" >
               </LinearLayout>
              
            <!-- Second Tab indicator -->
                <LinearLayout
                style="@style/indicator_style"
                android:id="@+id/second_tab"
                android:visibility="invisible" >
               </LinearLayout>
        </TableRow>
    </TableLayout>
   
    <!-- Bottom line -->
        <LinearLayout
        style="@style/h_line"
        android:orientation="vertical" >
      </LinearLayout>
                      

</LinearLayout>
2)layout1.xml
============
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/white"
    android:gravity="center|center"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="First Layout" />

</LinearLayout>
3)layout2.xml
===========
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/white"
    android:gravity="center|center"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Second Layout" />

</LinearLayout>

4)main.xml
=========
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/white"
    android:orientation="vertical" >

   

    <TableLayout
        style="@style/layout_f_w"
        android:stretchColumns="*" >
        <TableRow
            android:id="@+id/tableRow1"
            android:background="#dddddd"
            style="@style/layout_wrap">
           
              <!-- First Tab -->
                <LinearLayout
                style="@style/layout_f_w"
                android:id="@+id/first_text"
                android:orientation="vertical" >
               
                      <TextView
                        android:id="@+id/textView1"
                        style="@style/text_title"
                        android:text="Tab1" />
               </LinearLayout>
              
            <!-- Second Tab -->
                <LinearLayout
                style="@style/layout_f_w"
                android:id="@+id/second_text"
                android:orientation="vertical" >

                    <TextView
                        android:id="@+id/textView1"
                        style="@style/text_title"
                        android:text="Tab2" />
           
               </LinearLayout>
        
        </TableRow>
    </TableLayout>
    <!-- Include Tab Indicator  -->
 <include layout="@layout/indicator" android:layout_width="fill_parent" android:layout_height="wrap_content"  />

 <android.support.v4.view.ViewPager
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:id="@+id/viewPager" />
</LinearLayout>

No comments:

Post a Comment