Develop Reference

Create a slideshow of all images in android

I am working on an image gallery, where I fetch all the images stored in the Android phone gallery into my application. Please find the link that I followed to develop that image gallery.
Get all images from Gallery into android application Programmatically
I have trying for hours to figure out how to create a full screen slideshow of images. I am able to achieve the full screen image, but it shows the same image all and always, even though the gallery has 3 images. I am using a ViewPagerAdapter to set the image in the adapter for showing the full screen preview. The image slider isn't working and I don't have an idea of why its not working. Please find the source code of what I have tried so far.
Model_images.java
public class Model_images{
String str_folder;
ArrayList<String> al_imagepath;
public String getStr_folder() {
return str_folder;
}
public void setStr_folder(String str_folder) {
this.str_folder = str_folder;
}
public ArrayList<String> getAl_imagepath() {
return al_imagepath;
}
public void setAl_imagepath(ArrayList<String> al_imagepath) {
this.al_imagepath = al_imagepath;
}
}
I followed the same exact tutorial, where I have given a link to the original source code. Even though I have given a link, I'm posting the source code of the ViewPager I tried.
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_gallery);
ButterKnife.bind(this);
setSupportActionBar(toolbar);
gridView = (GridView)findViewById(R.id.gv_folder);
int_position = getIntent().getIntExtra("value", 0);
adapter = new GridViewAdapter(this, GalleryFragment.al_images,int_position);
gridView.setAdapter(adapter);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Bundle bundle = new Bundle();
bundle.putInt("position", int_position);
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
SlideshowDialogFragment newFragment = SlideshowDialogFragment.newInstance();
newFragment.setArguments(bundle);
newFragment.show(ft, "slideshow");
}
});
}
Here is the SlideshowFragmentDialog to show the images in a slideview.
SLideShowFragmentDialog.java
public class SlideshowDialogFragment extends DialogFragment {
private String TAG = SlideshowDialogFragment.class.getSimpleName();
private ViewPager viewPager;
private MyViewPagerAdapter myViewPagerAdapter;
private int selectedPosition = 0;
static SlideshowDialogFragment newInstance() {
SlideshowDialogFragment frag = new SlideshowDialogFragment();
return frag;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_image_slider, container, false);
viewPager = (ViewPager) v.findViewById(R.id.viewpager);
//images = (ArrayList<Image>) getArguments().getSerializable("images");
selectedPosition = getArguments().getInt("position");
myViewPagerAdapter = new MyViewPagerAdapter();
viewPager.setAdapter(myViewPagerAdapter);
viewPager.addOnPageChangeListener(viewPagerPageChangeListener);
setCurrentItem(selectedPosition);
return v;
}
private void setCurrentItem(int position) {
viewPager.setCurrentItem(position, false);
displayMetaInfo(selectedPosition);
}
// page change listener
ViewPager.OnPageChangeListener viewPagerPageChangeListener = new ViewPager.OnPageChangeListener() {
#Override
public void onPageSelected(int position) {
displayMetaInfo(position);
}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
#Override
public void onPageScrollStateChanged(int arg0) {
}
};
private void displayMetaInfo(int position) {
Model_images imagePath = GalleryFragment.al_images.get(position);
Toast.makeText(getContext(), imagePath.toString(), Toast.LENGTH_SHORT).show();
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setStyle(android.support.v4.app.DialogFragment.STYLE_NORMAL, android.R.style.Theme_Black_NoTitleBar_Fullscreen);
}
// adapter
public class MyViewPagerAdapter extends PagerAdapter {
private LayoutInflater layoutInflater;
public MyViewPagerAdapter() {
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
layoutInflater = (LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = layoutInflater.inflate(R.layout.activity_full_screen, container, false);
ImageView imageViewPreview = (ImageView) view.findViewById(R.id.fullScreenImageView);
Model_images image = GalleryFragment.al_images.get(position);
Glide.with(getContext()).load(image.getAl_imagepath().get(position))
.thumbnail(0.5f)
.diskCacheStrategy(DiskCacheStrategy.NONE)
.skipMemoryCache(true)
.into(imageViewPreview);
container.addView(view);
return view;
}
#Override
public int getCount() {
return GalleryFragment.al_images.size();
}
#Override
public boolean isViewFromObject(View view, Object obj) {
return view == ((View) obj);
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
I am not posting the source code for the MainActivity and the Adapter classes, since I have given a link to the project directly. I followed the exact same link. If you still want me to post the source codes, I can edit the question and post the missing stuffs. I don't wanna make this post big with all the code base.
Thanks in advance. Any help is appreciated. Please help me on how to achieve full screen slideshow of images.

OnPageChangeListener in ViewPager adapter?

I have a regular ViewPager with an adapter:
public class MyDialogFragment extends DialogFragment {
private ViewPager viewPager;
private MyViewPagerAdapter myViewPagerAdapter;
private City city;
public static MyDialogFragment newInstance() {
MyDialogFragment fragment = new MyDialogFragment();
return fragment;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_layout, container, false);
viewPager = (ViewPager) v.findViewById(R.id.viewPager);
city = Parcels.unwrap(getArguments().getParcelable("city"));
myViewPagerAdapter = new MyViewPagerAdapter(getContext());
viewPager.setAdapter(myViewPagerAdapter);
viewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
// Page changed
}
});
return v;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
public class MyViewPagerAdapter extends PagerAdapter {
private Context context;
private LayoutInflater layoutInflater;
public MyViewPagerAdapter(Context context) {
this.context = context;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
layoutInflater = (LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = layoutInflater.inflate(R.layout.city_layout, container, false);
ImageView imageView = (ImageView) view.findViewById(R.id.cityImage);
Glide.with(context)
.load(city.getImage())
.into(imageView);
}
container.addView(view);
return view;
}
#Override
public int getCount() {
return city.size();
}
#Override
public boolean isViewFromObject(View view, Object obj) {
return view == ((View) obj);
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
}
As you can see, I have a page change listener set on my ViewPager. But I need to be able to notify the adapter when the page has changed so that I can modify the adapter's ImageView. How can I do this?

Add a method to your adapter class
public class MyViewPagerAdapter extends PagerAdapter {
...
public void pageChanged(int position) {
// Do something
}
...
}
After that in your OnPageChangeListener use that method
#Override
public void onPageSelected(int position) {
myViewPagerAdapter.pageChanged(position);
}

One approach is to create a data structure in your adapter to map the pager view to its position. A SparseArray is most efficient:
private SparseArray<View> pageMap = new SparseArray<>();
Then in the adapter's instantiateItem() method, add the view to the SparseArray:
public Object instantiateItem(ViewGroup container, int position) {
...
pageMap.put(position, view);
...
}
Now in your OnPageChangeListener you can do the following:
#Override
public void onPageSelected(int position) {
View view = adapter.getView(pos);
if (view != null) {
ImageView iv = (ImageView) view.findViewById(R.id.your_image_view);
// You now have the image view
}
}
Make sure you remove views from the SparseArray in the adapter's destroyItem() method:
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
pageMap.remove(position);
...
}

You can use the constructor with imagelist to pass and that automatically called on next page..In your code will be modified like :::
ArrayList imageList=new ArrayList<>();
imageList.add("ImagePath here");
myViewPagerAdapter = new MyViewPagerAdapter(getContext(),imageList);
viewPager.setAdapter(myViewPagerAdapter);
Then your adapter will be like ::
public class MyViewPagerAdapter extends PagerAdapter {
private Context context;
private ArrayList<String> imageList
private LayoutInflater layoutInflater;
public MyViewPagerAdapter(Context context,ArrayList<String> imageList) {
this.context = context;
this.imageList = imageList;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
layoutInflater = (LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = layoutInflater.inflate(R.layout.city_layout, container, false);
ImageView imageView = (ImageView) view.findViewById(R.id.cityImage);
Glide.with(context)
.load(imageList.get(position)) // This will be changes like
.into(imageView);
}
container.addView(view);
return view;
}
#Override
public int getCount() {
return city.size();
}
#Override
public boolean isViewFromObject(View view, Object obj) {
return view == ((View) obj);
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
That done ..
After this, there are some suggestion that
- please use arraylist while using the viewpager ..
Now you just taking the parceble object from bundle..
you can do the same for the arraylist,
just receive the arraylist from the same bundle by passing the whole arraylist at once.
so you dont need to find the page change event..viewpager will automatically handle that..
Here's How to send & receiving the parceable arraylist
// while sending the list
Bundle bundle = new Bundle();
bundle.putParcelableArrayList("citylist", new ArrayList<City>());
// while receiving the list
ArrayList<City> citylist = getIntent().getParcelableArrayListExtra("citylist");
After this just get the all image and add in the imagelist array
for (int i = 0; i < citylist.size(); i++) {
imageList.add(citylist.get(i).getImage());
}
And pass this imageList in
myViewPagerAdapter = new MyViewPagerAdapter(getContext(),imageList);
viewPager.setAdapter(myViewPagerAdapter);
Tell me if needed more assitance.

ViewPager Is Not Scrolling Smoothly

i implemented a viewpager in my activity that on scroll, loads a set of data to an adapter and display them in a list view. everything is working fine, but i cant seem to find out how to make it more efficient because when scrolling, the view freezes but for example in the GMAIL app when scrolling between Emails the scrolling is so smooth.
Below is the code i am using:
Activity:
in oncreate
pageradapter adapter2 = new pageradapter(this, ArrayOfItems); //ArrayOfItems is an Array containing the data that will be displayed
ViewPager myPager = (ViewPager) findViewById(R.id.mypanelpager);
myPager.setAdapter(adapter2);
pagechangelistener pageListener = new pagechangelistener();
myPager.setOnPageChangeListener(pageListener);
pageradapter:
public pageradapter(Activity act, ArrayList <List<Item>>Arrayitems) {
this.Arrayitems = Arrayitems;
activity = act;
}
public int getCount() {
return Arrayitems.size();
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
List<Item> item = Arrayitems.get(position);
ListView view = new ListView(activity);
taskdetailsarrayadaptertest adapter = new taskdetailsarrayadaptertest(activity, item);
view.setAdapter(adapter);
view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT));
((ViewPager) container).addView(view, 0);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
((ViewPager) container).removeView((View) object);
}
#Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == ((View) arg1);
}
#Override
public Parcelable saveState() {
return null;
}
pagechangelistener:
#Override
public void onPageSelected(int position)
{
currentPage = position;
int positionTemp = position + 1;
}
public final int getCurrentPage() {
return currentPage;
}

First you need to use holders like this.
in your ViewPager:
class Holder{
ListView listView;
Adapter adapter;
}
private ArrayList<Holder> mHolders;
//init holders
#Override
public Object instantiateItem(ViewGroup collection, int position) {
Holder holder = mHolders.get(position);
holder.listView.setAdapter(holder.adapter);
collection.addView(holder.listView);
return holder.listView;
}
Second try async loading data in listview

set myPager.setOffscreenPageLimit(1);

Pager adapter with private methods without fragments in android

Is it possible to user View pager without fragments. I google it, and all examples use fragments for view pager. I want to pager load only one item from my list, so I want to ask is it possible. Here is my code for main activity, and I want to use UpdateDisplay for viewpager. Any suggestions.
public class MainActivity extends Activity implements OnClickListener{
private Button prev, next;
private TextView tv;
private int number = 0;
private ArrayList<Integer> numbers;
private ViewPager pager;
private MyPagerAdapter adapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
prev = (Button) findViewById(R.id.prevButton);
prev.setOnClickListener(this);
next = (Button) findViewById(R.id.nextButton);
next.setOnClickListener(this);
numbers = new ArrayList<Integer>();
for (int i=0;i<5;i++){
numbers.add(i);
Log.i("Sljedece elemente dodaje u listu", String.valueOf(i));
}
tv = (TextView) findViewById(R.id.rezultatTextView);
pager = (ViewPager) findViewById(R.id.pager);
adapter = new MyPagerAdapter();
pager.setAdapter(adapter);
updateDIsplay(number);
}
#Override
public void onClick(View v) {
switch(v.getId()){
case R.id.prevButton:
number--;
if (number==-1){
number = 4;
}
updateDIsplay(number);
break;
case R.id.nextButton:
number++;
if (number==5){
number = 0;
}
updateDIsplay(number);
break;
}
}
private void updateDIsplay(int z){
tv.setText(String.valueOf(numbers.get(z)));
}
private class MyPagerAdapter extends PagerAdapter{
#Override
public int getCount() {
return numbers.size();
}
#Override
public boolean isViewFromObject(View arg0, Object arg1) {
return false;
}
}
}

yes it possible. Use a PageAdapter. When instantiateItem is called, you can inflate/instantiate your view, and this to the container. E.g:
private class MyPagerAdapter extends PagerAdapter {
#Override
public Object instantiateItem(ViewGroup container, int position) {
TextView view = new TextView(PagerActivity.this);
view.setText("Item "+position);
view.setGravity(Gravity.CENTER);
view.setBackgroundColor(Color.argb(255, position * 50, position * 10, position * 50));
container.addView(view);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
#Override
public int getCount() {
return 5;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return (view == object);
}
}

How can i getCurrentView by position in a ViewPager?

I need getCurrentView by position in a ViewPager
This my ViewPagerAdapter
public class TutorialViewPagerAdapter extends ViewPagerAdapter {
private LayoutInflater mInflater;
private View view;
private List<Integer> views;
public TutorialViewPagerAdapter(Activity act, List<Integer> views) {
super(act, null);
this.views = views;
this.mInflater = LayoutInflater.from(this.activity);
}
#Override
public void destroyItem(View container, int arg1, Object view) {
((ViewPager) container).removeView((View) view);
}
#Override
public int getCount() {
return views.size();
}
#Override
public Object instantiateItem(ViewGroup collection, int position) {
int viewId = (Integer) views.get(position);
this.view = mInflater.inflate(viewId, null);
((ViewPager) collection).addView(view);
return view;
}
}
And this is my activity
public class Tutorial extends FragmentActivity implements
ViewPager.OnPageChangeListener {
private List<Integer> views;
private TutorialViewPagerAdapter viewPagerAdapter;
private ViewPager viewPager;
private CirclePageIndicator circlePageIndicator;
private int currentViewId;
private View currentView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tutorial);
init();
}
private void init() {
views = new ArrayList<Integer>();
views.add(R.layout.tutorial_step_one);
views.add(R.layout.tutorial_step_two);
views.add(R.layout.tutorial_step_three);
views.add(R.layout.tutorial_step_four);
views.add(R.layout.tutorial_step_five);
viewPagerAdapter = new TutorialViewPagerAdapter(this, views);
viewPager = (ViewPager) findViewById(R.id.steps_view_pager);
circlePageIndicator = (CirclePageIndicator) findViewById(R.id.steps_indicator);
viewPager.setAdapter(viewPagerAdapter);
viewPager.setCurrentItem(0, false);
circlePageIndicator.setViewPager(viewPager);
circlePageIndicator.setCentered(true);
circlePageIndicator.setPadding(20, 20, 20, 20);
circlePageIndicator.notifyDataSetChanged();
circlePageIndicator.setCurrentItem(0);
viewPager.setOnPageChangeListener(this);
}
#Override
public void onPageScrollStateChanged(int state) {
int currentPosition = viewPager.getCurrentItem();
circlePageIndicator.setCurrentItem(currentPosition);
enableStep(currentPosition);
}
private void enableStep(int currentPosition) {
/*viewPagerAdapter.getItemPosition(object)
currentView = viewPager.getChildAt(viewPager.getRootView());
Log.d("DEBUG", currentView.toString() + " CURRENT VIEW");*/
}
#Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
}
#Override
public void onPageSelected(int position) {
}
}

You could add all your created views in instantiateItem to an ArrayList<View> and then make a public method for getting a view from the ArrayList with get(position). But be carefully, as soon the Activity is finished the views could be null

Instead of ViewPagerAdapter you can use FragmentPagerAdapter which will have getItem(int position) method by using which you can easily access view.
You can take a look at this post : Android Return back to same fragment after click on goto first fragment in view pager
Hope this help!!

It's moot point. What exactly You need? Current view or view by position. Imho it is different things.
Current view:
currentView = viewPager.getCurrentItem();
Or view by index (you pass wrong parameter - should be int):
currentView = viewPager.getChildAt(currentPosition);