Android view pager with page indicator

Question

I need to get page indicator in the view pager file with images  Here is my code   public class IndicatorActivity extends Activity          Called when the activity is first created          Override          public void onCreate Bundle savedInstanceState                super onCreate savedInstanceState               setContentView R layout main                MyPagerAdapter adapter   new MyPagerAdapter                ViewPager myPager    ViewPager  findViewById R id pager               myPager setAdapter adapter               myPager setCurrentItem 0               TitlePageIndicator indicator    TitlePageIndicator findViewById R id indicat               indicator setViewPager  myPager              In this code  i got an error in  TitlePageIndicator indicator    TitlePageIndicator findViewById R id indicat   as TitlePageIndicator cannot be resolved to a type  What is this error  How can I resolve it   here is my xml code    lt  xml version  1 0  encoding  utf-8   gt   lt LinearLayout xmlns android  http   schemas android com apk res android      android layout width  fill parent      android layout height  fill parent      android orientation  vertical   gt        lt android support v4 view ViewPager         android id    id pager          android layout width  match parent          android layout height  match parent             gt       lt com viewpagerindicator TitlePageIndicator     android id    id indicat      android layout height  wrap content      android layout width  fill parent    gt   lt  LinearLayout gt    What code do I need to write in the TitlePageIndicator  I want to do this without using fragments   Me also created a class such as   class MyPagerAdapter extends PagerAdapter         private static Integer   titles   new Integer                               R drawable jk R drawable lm R drawable no                         public int getCount                 return 3             public Object instantiateItem View collection  int position                 LayoutInflater inflater    LayoutInflater  collection getContext                                getSystemService Context LAYOUT INFLATER SERVICE               View view              ImageView iv               view   inflater inflate R layout first  null                  ViewPager  collection  addView view  0               switch  position                case 0                  iv    ImageView view findViewById R id imageView1                   iv setImageResource titles position                        break              case 1                  iv    ImageView view findViewById R id imageView1                   iv setImageResource titles position                        break              case 2                   iv    ImageView view findViewById R id imageView1                   iv setImageResource titles position                        break                            return view             public void destroyItem View arg0  int arg1  Object arg2                  ViewPager  arg0  removeView  View  arg2                 public boolean isViewFromObject View arg0  Object arg1                return arg0      View  arg1               Did I want to do anything more than this class   Thanks in advance for help

User · Answer

Just an improvement to the nice answer given by @vuhung3990. I implemented the solution and works great but if I touch one radio button it will be selected and nothing happens.

I suggest to also change page when a radio button is tapped. To do this, simply add a listener to the radioGroup:

mPager = (ViewPager) findViewById(R.id.pager);
final RadioGroup radioGroup = (RadioGroup)findViewById(R.id.radiogroup);    
radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                switch (checkedId) {
                    case R.id.radioButton :
                        mPager.setCurrentItem(0, true);
                        break;
                    case R.id.radioButton2 :
                        mPager.setCurrentItem(1, true);
                        break;
                    case R.id.radioButton3 :
                        mPager.setCurrentItem(2, true);
                        break;
                }
            }
        });

User · Answer

Here are a few things you need to do   1-Download the library if you haven t already done that   2- Import into Eclipse   3- Set you project to use the library  Project-  Properties -  Android -  Scroll down to Library section  click Add    and select viewpagerindicator   4- Now you should be able to import com viewpagerindicator TitlePageIndicator   Now about implementing this without using fragments   In the sample that comes with viewpagerindicatior  you can see that the library is being used with a ViewPager which has a FragmentPagerAdapter   But in fact the library itself is Fragment independant  It just needs a ViewPager  So just use a PagerAdapter instead of a FragmentPagerAdapter and you re good to go

User · Answer

UPDATE  22 03 2017  main fragment layout           lt FrameLayout xmlns android  http   schemas android com apk res android              xmlns app  http   schemas android com apk res-auto              android layout width  match parent              android layout height  match parent  gt                lt android support v4 view ViewPager                 android id    id viewpager                  android layout width  match parent                  android layout height  match parent    gt                lt RadioGroup                 android id    id page group                  android layout width  wrap content                  android layout height  wrap content                  android layout gravity  center horizontal bottom                  android layout marginBottom   dimen margin help container                  android orientation  horizontal  gt                    lt RadioButton                     android id    id page1                      android layout width  wrap content                      android layout height  wrap content                      android checked  true    gt                    lt RadioButton                     android id    id page2                      android layout width  wrap content                      android layout height  wrap content    gt                    lt RadioButton                     android id    id page3                      android layout width  wrap content                      android layout height  wrap content    gt               lt  RadioGroup gt           lt  FrameLayout gt    set up view and event on your fragment like this           mViewPaper    ViewPager  view findViewById R id viewpager           mViewPaper setAdapter adapder            mPageGroup    RadioGroup  view findViewById R id page group           mPageGroup setOnCheckedChangeListener this            mViewPaper addOnPageChangeListener this                                                                                                                            Override     public void onPageScrolled int position  float positionOffset  int positionOffsetPixels                Override     public void onPageSelected int position               when current page change - gt  update radio button state         int radioButtonId   mPageGroup getChildAt position  getId            mPageGroup check radioButtonId               Override     public void onPageScrollStateChanged int state                Override     public void onCheckedChanged RadioGroup radioGroup  int checkedId               when checked radio button - gt  update current page         RadioButton checkedRadioButton    RadioButton radioGroup findViewById checkedId              get index of checked radio button         int index   radioGroup indexOfChild checkedRadioButton               update current page         mViewPaper setCurrentItem index   true           custom checkbox state  Custom checkbox image android  Viewpager tutorial  http   architects dzone com articles android-tutorial-using

User · Answer

you have to do following   1-Download the full project from here https   github com JakeWharton ViewPagerIndicator ViewPager Indicator 2- Import into the Eclipse   After importing if you want to make following type of screen then follow below steps -     change in   Sample circles Default    package com viewpagerindicator sample    import android os Bundle      import android support v4 view ViewPager    import com viewpagerindicator CirclePageIndicator     public class SampleCirclesDefault extends BaseSampleActivity       Override    protected void onCreate Bundle savedInstanceState        super onCreate savedInstanceState       setContentView R layout simple circles        mAdapter   new TestFragmentAdapter getSupportFragmentManager          mPager    ViewPager findViewById R id pager         mPager setAdapter mAdapter        ImageAdapter adapter   new ImageAdapter SampleCirclesDefault this       mPager setAdapter adapter         mIndicator    CirclePageIndicator findViewById R id indicator       mIndicator setViewPager mPager           ImageAdapter    package com viewpagerindicator sample    import android content Context   import android support v4 view PagerAdapter   import android support v4 view ViewPager   import android view LayoutInflater   import android view View   import android view ViewGroup   import android widget ImageView   import android widget TextView    public class ImageAdapter extends PagerAdapter    private Context mContext    private Integer   mImageIds     R drawable about1  R drawable about2          R drawable about3  R drawable about4  R drawable about5          R drawable about6  R drawable about7        public ImageAdapter Context context        mContext   context       public int getCount         return mImageIds length       public Object getItem int position        return position       public long getItemId int position        return position        Override  public Object instantiateItem ViewGroup container  final int position         LayoutInflater inflater    LayoutInflater  container getContext                getSystemService Context LAYOUT INFLATER SERVICE        View convertView   inflater inflate R layout gallery view  null        ImageView view image    ImageView  convertView              findViewById R id view image       TextView description    TextView  convertView              findViewById R id description        view image setImageResource mImageIds position        view image setScaleType ImageView ScaleType FIT XY        description setText  The natural habitat of the Niligiri tahr Rajamala          Rajamala is 2695 Mts above sea level             The natural habitat of the Niligiri tahr Rajamala Rajamala is 2695 Mts above sea level                         The natural habitat of the Niligiri tahr Rajamala Rajamala is 2695 Mts above sea level           ViewPager  container  addView convertView  0        return convertView        Override  public boolean isViewFromObject View view  Object object        return view      View  object         Override  public void destroyItem ViewGroup container  int position  Object object          ViewPager  container  removeView  ViewGroup  object          gallery view xml    lt  xml version  1 0  encoding  utf-8   gt   lt LinearLayout xmlns android  http   schemas android com apk res android  android layout width  fill parent  android layout height  fill parent  android background   drawable about bg  android orientation  vertical   gt    lt LinearLayout     android id    id about layout      android layout width  match parent      android layout height  match parent      android orientation  vertical      android weightSum  1   gt        lt LinearLayout         android id    id about layout1          android layout width  match parent          android layout height  0dp          android layout weight   4          android orientation  vertical   gt            lt ImageView             android id    id view image              android layout width  match parent              android layout height  match parent               android background   drawable about1  gt        lt  ImageView gt       lt  LinearLayout gt        lt LinearLayout         android id    id about layout2          android layout width  fill parent          android layout height  0dp          android layout weight   6          android orientation  vertical   gt            lt TextView             android id    id textView1              android layout width  match parent              android layout height  wrap content              android text  SIGNATURE LANDMARK OF MALAYSIA-SINGAPORE CAUSEWAY              android textColor   000000              android gravity  center              android padding  18dp              android textStyle  bold              android textAppearance   android attr textAppearance    gt             lt ScrollView             android layout width  fill parent              android layout height  match parent              android fillViewport  false              android orientation  vertical              android scrollbars  none              android layout marginBottom  10dp              android padding  10dp   gt                lt TextView                 android id    id description                  android layout width  match parent                  android layout height  match parent                  android textColor   000000                  android text  TextView    gt                lt  ScrollView gt       lt  LinearLayout gt    lt  LinearLayout gt

User · Answer

I know this has already been answered  but for anybody looking for a simple  no-frills implementation of a ViewPager indicator  I ve implemented one that I ve open sourced  For anyone finding Jake Wharton s version a bit complex for their needs  have a look at  https   github com jarrodrobins SimpleViewPagerIndicator

User · Answer

You Can create a Linear layout containing an array of TextView  mDots   To represent the textView as Dots provide this HTML source in your code   refer my code   I got this information from Youtube Channel TVAC Studio   here the code          addDotsIndicator 0       viewPager addOnPageChangeListener viewListener      public void addDotsIndicator int position            mDots   new TextView 5           mDotLayout removeAllViews             for  int i   0  i lt mDots length   i                           mDots i  new TextView this                mDots i  setText Html fromHtml   amp  8226                   HTML for dots              mDots i  setTextSize 35                mDots i  setTextColor getResources   getColor R color colorAccent                  mDotLayout addView mDots i                       if mDots length gt 0                        mDots position  setTextColor getResources   getColor R color orange                 ViewPager OnPageChangeListener viewListener   new ViewPager OnPageChangeListener          Override     public void onPageScrolled int position  float positionOffset  int     positionOffsetPixels                 Override     public void onPageSelected int position             addDotsIndicator position               Override     public void onPageScrollStateChanged int state

User · Answer

I have also used the SimpleViewPagerIndicator from  JROD  It also crashes as described by  manuelJ   According to his documentation   SimpleViewPagerIndicator pageIndicator    SimpleViewPagerIndicator  findViewById R id page indicator   pageIndicator setViewPager pager     Make sure you add this line as well   pageIndicator notifyDataSetChanged      It crashes with an array out of bounds exception because the SimpleViewPagerIndicator is not getting instantiated properly and the items are empty  Calling the notifyDataSetChanged results in all the values being set properly or rather reset properly

[android] Android view pager with page indicator

Examples related to android

Examples related to android-viewpager

Examples related to android-view

Examples related to viewpagerindicator

Examples related to activity-indicator