Trying to pass Imageview onto viewpagerfragment

Question

So I'm trying to create a viewpager of 26 different layouts based on the same layout file and I'm trying to pass the texts and images through a bundle. I got the text part down but I'm confused on how to put an Image in the bundle.

public class ScreenSlidePageFragment extends Fragment {
//Resources mResources = getResources();
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View v = inflater.inflate(R.layout.alphabet, container, false);
    TextView tv = (TextView)v.findViewById(R.id.alphabet);
   // ImageView iv = (ImageView)v.findViewById(R.id.letter);
    //Drawable drawable = mResources.getDrawable(R.drawable.aletter);
    //iv.setImageDrawable(drawable);
    tv.setText(getArguments().getString("msg"));

    return v;
}


public static ScreenSlidePageFragment newInstance(String text, Drawable drawable) {

    ScreenSlidePageFragment f = new ScreenSlidePageFragment();
    Bundle b = new Bundle();
    b.putString("msg", text);
   // b.putInt();

    f.setArguments(b);

    return f;
}

}

    public Fragment getItem(int position) {
        switch(position) {
            case 0: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 1");
            case 1: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 2");
            case 2: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 3");
            case 3: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 4");
            case 4: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 5");
            case 5: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 6");
            case 6: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 7");
            case 7: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 8");
            case 8: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 9");
            case 9: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 10");
            case 10: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 11");
            case 11: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 12");
            case 12: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 13");
            case 13: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 14");
            case 14: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 15");
            case 15: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 16");
            case 16: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 17");
            case 17: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 18");
            case 18: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 19");
            case 19: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 20");
            case 20: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 21");
            case 21: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 22");
            case 22: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 23");
            case 23: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 24");
            case 24: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 25");
            case 25: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 26");
            default: return ScreenSlidePageFragment.newInstance("FirstFragment, Instance 1");

        }
    }

Answer 1

You should have an ImageView declared in your alphabet layout.

... some layout container ...
<ImageView android:id="@+id/letter" android:width="wrap_content" android:height="wrap_content" />
... some other layouts...

Then in your onCreateView, you can find this ImageView and you can get the resource for that image from the bundle.

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  View v = inflater.inflate(R.layout.alphabet, container, false);
  TextView tv = (TextView)v.findViewById(R.id.alphabet);
  ImageView iv = (ImageView)v.findViewById(R.id.letter);
  iv.setImageResource(getArguments().getInt("letter")); // maybe check first if the argument is set :)
  tv.setText(getArguments().getString("msg"));

  return v;
}

in your newInstance method, you can set the correct resource as a fragment argument.

public static ScreenSlidePageFragment newInstance(String text, @DrawableRes int drawable) {
  ScreenSlidePageFragment f = new ScreenSlidePageFragment();
  Bundle b = new Bundle();
  b.putString("msg", text);
  b.putInt("letter", drawable); // this is the image in your drawable folder that you can access with R.drawable.letter_a (if the file is called letter_a.png

  f.setArguments(b);

  return f;
}