Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to create Swipeable View in android

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 276
    Comment on it

     In the below example I have created View Pager (View pager slider). Here I have added ViewPager in activity_main.xml layout, after that I have created slide_page xml layout, in that I have added a textview and in next step I have created four new xml layouts and In all four file added ImageView. In Next step I have created  a new TabAdaper class and four Frament class in Fragment classes I have inflated the image, In MainActivity I have used String class here I have put all Fragments classes and i have used ViewPager.OnPageChangeListener() method in MainActivity. You can see below program it will clearly describe you How to create Swipeable View in android.

    Step(1)-Added ViewPager in activity_main.xml layout-

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

    Step(2)-Created a new slide_page.xml layout-
     

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="This is slide 1"
            android:id="@+id/textView"
            android:layout_centerVertical="true"
            android:layout_centerHorizontal="true" />
    </RelativeLayout>

    Step(3)-Created new one.xml layout-
     

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fa6a6a">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/one"/>
    
    </RelativeLayout>
    
    

    Step(4)-Created new two.xml layout-
     

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fa6a6a">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/two"/>
    
    </RelativeLayout>

    Step(5)-Created new three.xml layout-
     

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fa6a6a">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/three"/>
    
    </RelativeLayout>

    Step(6)-Created new four.xml layout-
     

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fa6a6a">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/four"/>
    
    </RelativeLayout>
    
    

    Step(7)-Created new TabAdapter class
     

    public class TabAdapter extends FragmentPagerAdapter {
    
    
            public TabAdapter(FragmentManager fm) {
                super(fm);
            }
    
            @Override
            public Fragment getItem(int index) {
    
                switch (index) {
                    case 0:
                       
                        return new OneFragment();
                    case 1:
              
                        return new TwoFragment();
                    case 2:
                 
                        return new ThreeFragment();
                    case 3:
              
                        return new FourFragment();
                }
    
                return null;
            }
    
            @Override
            public int getCount() {
    
                return 4;
            }
    
        }

    Step(8)-Created new OneFragment class
     

        public class OneFragment extends Fragment {
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
    
            View rootView = inflater.inflate(R.layout.one, container, false);
    
            return rootView;
        }
    }
    

    Step(9)-Created new TwoFragment class
     

       public class TwoFragment extends Fragment {
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
    
            View rootView = inflater.inflate(R.layout.two, container, false);
    
            return rootView;
        }
    }

    Step(10)-Created new ThreeFragment class
       

     public class ThreeFragment extends Fragment {
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
    
            View rootView = inflater.inflate(R.layout.three, container, false);
    
            return rootView;
        }
    }

     Step(11)-Created new FourFragment class
      

      public class FourFragment extends Fragment {
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
    
            View rootView = inflater.inflate(R.layout.four, container, false);
    
            return rootView;
        }
    }

    Step(12)-MainActivity-
     

    public class MainActivity extends FragmentActivity implements
            TabListener {
    
        private ViewPager viewPager;
        private TabAdapter mAdapter;
        private ActionBar actionBar;
        // Tab titles
        private String[] tabs = { "OneFragment", "TwoFragment", "ThreeFragment","FourFragment" };
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            // Initilization
            viewPager = (ViewPager) findViewById(R.id.pager);
            actionBar = getActionBar();
            mAdapter = new TabAdapter(getSupportFragmentManager());
    
            viewPager.setAdapter(mAdapter);
            actionBar.setHomeButtonEnabled(false);
            actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    
       
            for (String tab_name : tabs) {
                actionBar.addTab(actionBar.newTab().setText(tab_name)
                        .setTabListener(this));
            }
    
           
            viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    
                @Override
                public void onPageSelected(int position) {
                  
                    actionBar.setSelectedNavigationItem(position);
                }
    
                @Override
                public void onPageScrolled(int arg0, float arg1, int arg2) {
                }
    
                @Override
                public void onPageScrollStateChanged(int arg0) {
                }
            });
        }
    
        @Override
        public void onTabReselected(Tab tab, FragmentTransaction ft) {
        }
    
        @Override
        public void onTabSelected(Tab tab, FragmentTransaction ft) {
            // on tab selected
            // show respected fragment view
            viewPager.setCurrentItem(tab.getPosition());
        }
    
        @Override
        public void onTabUnselected(Tab tab, FragmentTransaction ft) {
        }
    
    }
    
    

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: