java - Different text for each image in image viewpager

Question

I used viewpager class to display sets of images instead of gallery class as its deprecated and customized it to show the text by using the below code , the problem is the same text showed for all images , what im trying to get is : Different text for each image , which explain it , lets say we have 5 images , it must has 5 different text each one describe its image .

any advice will be appreciated , thanks

The code:

ImagePager

   public class ImagePager extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    ImagePagerAdapter adapter = new ImagePagerAdapter(this, imageArra);
    ViewPager myPager = (ViewPager) findViewById(R.id.myimagepager);
    myPager.setAdapter(adapter);
    myPager.setCurrentItem(0);}

private int imageArra[] = { R.drawable.a, R.drawable.b, R.drawable.c,
                              R.drawable.d, R.drawable.e};        }

ImagePagerAdapter

   public class ImagePagerAdapter extends PagerAdapter {

Activity activity;
int imageArray[];

public ImagePagerAdapter(Activity act, int[] imgArra) {
    imageArray = imgArra;
    activity = act;}

public int getCount() {
    return imageArray.length;}

public Object instantiateItem(View collection, int position) {
    LayoutInflater inflater = (LayoutInflater)collection.getContext
                 ().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View layout = inflater.inflate(R.layout.custom_pager, null);   

    ImageView im=(ImageView) layout.findViewById(R.id.myimage);             
    im.setImageResource(imageArray[position]);

    TextView txt=(TextView) layout.findViewById(R.id.image_text);
    ((ViewPager) collection).addView(layout, 0);
       return layout;   }

@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
    ((ViewPager) arg0).removeView((View) arg2);
            }

@Override
public boolean isViewFromObject(View arg0, Object arg1) {
    return arg0 == ((View) arg1);
                      }

@Override
public Parcelable saveState() {
    return null;
              }   }

activity_main.xml

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

custom_pager.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
   android:layout_width="match_parent" 
   android:layout_height="match_parent" 
   android:orientation="vertical" 
   android:background="#FFDAB9" 
   android:gravity="center_horizontal">
 <ImageView android:id="@+id/myimage" 
   android:layout_width="match_parent" 
   android:layout_height="0dp" 
   android:layout_margin="5dp" 
   android:layout_weight="2" /> 
 <TextView android:id="@+id/image_text" 
    android:layout_width="fill_parent" 
    android:layout_height="0dp" 
    android:textColor="#B22222" 
    android:layout_weight="1" 
    android:text="text to image" />

 </LinearLayout>                       

Answer 1

You could pass an array of Strings into your adapter that correspond to each image.. ex.

In the activity declare your string array with your list of images..

private int imageArra[] = { R.drawable.a, R.drawable.b, R.drawable.c,
                              R.drawable.d, R.drawable.e};  

private String[] stringArray = new String[] { "Image a", "Image b","Image c","Image d","Image e"}; 

Then when instantiating your adapter..

ImagePagerAdapter adapter = new ImagePagerAdapter(this, imageArra, stringArray );

In your adapter:

int imageArray[];
String[] stringArray;
public ImagePagerAdapter(Activity act, int[] imgArra, String[] stringArra) {
    imageArray = imgArra;
    activity = act;
    stringArray = stringArra;
}

Then assign the text value from the array

TextView txt=(TextView) layout.findViewById(R.id.image_text);
txt.setText(stringArray[position]);