I am using ViewPager to load images from server.When it is swiped the first image is shown again and again.I checked the urls in the browser and it shows different images.I then tried loading images from drawable.Here the last image is being loaded repeatedly.Below is the complete code:
ImagePagerAdapter.java:
public class ImagePagerAdapter extends PagerAdapter {
TaxiDisplayData taxiDisplayData;
LinearLayout pager_lyt;
ImageView imageView;
LayoutInflater layoutInflater;
Context context;
String category;
int count;
LinearLayout linearLayout;
View view;
ImageLoaderConfiguration config;
ArrayList images;
public ImagePagerAdapter(Context context,String ctgry){
Log.e("I","T");
config = new ImageLoaderConfiguration.Builder(context).build();
ImageLoader.getInstance().init(config);
images =new ArrayList();
this.context=context;
this.category=ctgry;
if (category.equalsIgnoreCase("taxi")){
count= taxiDisplayData.getInstance().imagecount();
}
layoutInflater=(LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
Log.e("Count",Integer.toString(count));
return count;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
view=layoutInflater.inflate(R.layout.srch_dsply_pager,container,false);
linearLayout=(LinearLayout) view.findViewById(R.id.pgr_lyt);
imageView=(ImageView) view.findViewById(R.id.image1);
if (category.equalsIgnoreCase("taxi"))
{ images =taxiDisplayData.getInstance().getArrayList();
if(count!=0){
Iterator iterator= images.iterator();
while (iterator.hasNext())
{
Log.e("I","Z");
Picasso.with(context).load("http://example.com/xxxx/"+(String) iterator.next())
.placeholder(R.drawable.doctors)
.fit().into(imageView);
}
}}
container.addView(view);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
#Override
public boolean isViewFromObject(View view, Object object) {
Log.e("I","f");
return view==object;
}}
srch_dsply_pager.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/pgr_lyt">
<ImageView
android:layout_width="match_parent"
android:layout_height="#dimen/prsnl_img_dimen"
android:id="#+id/image1"
android:scaleType="fitXY"
/>
</LinearLayout>
instantiateItem() Creates one view and adds it in the view pager. In your source you are iterating trough the whole array, load only the last one and return the view. Instead the while you should have something like
String url = images.get(position);
Picasso.load(url).into(imageview);
Related
I'm trying to create an app where I can swipe through photos. I currently have the images saved as bitmaps. How can I use ViewPager to swipe through the images? (Preferably without Picasso or Glide)
You said you have the bitmaps, store it in arraylist. First, make an Adapter for your ViewPager.
public class AdapterPagerImageSlider extends PagerAdapter {
private ArrayList<Bitmap> bitmaps;
private Context context;
private LayoutInflater layoutInflater;
public AdapterPagerImageSlider(Context context, ArrayList<Bitmap> bitmaps) {
this.context = context;
this.bitmaps= bitmaps;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = layoutInflater.inflate(R.layout.inflater_imageslider, container, false);
ImageView imageView = view.findViewById(R.id.image);
imageView.setImageBitmap(bitmaps.get(position)); //this set image from bitmap
container.addView(view);
return view;
}
#Override
public int getCount() {
return bitmaps.size();
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((LinearLayout) object);
}
#Override
public boolean isViewFromObject(#NonNull View view, #NonNull Object o) {
return (view == o);
}
}
Then, make a layout and name it inflater_imageslider
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Last, declare that adapter and set it to your ViewPager.
ArrayList<Bitmap> bitmaps = new ArrayList<>();
//code of storing your bitmaps to arraylist here : bitmaps.add(yourbitmap);
ViewPager vp = findViewById(R.id.vp);
AdapterPagerImageSlider adapter = new AdapterPagerImageSlider(MainActivity.this, bitmaps);
vp.setAdapter(adapter);
Hope it helps.
I have a viewPager that implemented for viewing credit cards. In this viewPager placed a imageView with TextViews to have the card image and attributes. I had not yet aware that credit card design git (https://github.com/sharish/CreditCardView) and started to use it. But when I try to set the attributes, it falls into default and not the arrow attributes. (It worked normally with the text view). I'm using a list of the cards, he constroe view the pager with the amount of cards I have but not to set the values (all created cards are equal), that is, it esa not putting it on the list. Am I doing right?
PagerView.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="#+id/pager"
android:layout_centerHorizontal="true"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
>
<com.cooltechworks.creditcarddesign.CreditCardView
android:id="#+id/card_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:card_expiration="01/17"
/>
</RelativeLayout>
AdapterCard.java
public class AdapterCards extends android.support.v4.view.PagerAdapter {
Context context;
private List<Card> listCards = new ArrayList<>();
public AdapterCards(Context context, List<Card> listCards){
this.context = context;
this.listCards = listCards;
}
#Override
public int getCount() {
return listCards.size();
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view==object;
}
#Override
public Object instantiateItem(ViewGroup container, int position){
LayoutInflater layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View itemView = layoutInflater.inflate(R.layout.pagecards, container, false);
CreditCardView creditCardView = new CreditCardView(context);
creditCardView.setCardExpiry(listCards.get(position).cardValid);
container.addView(itemView);
return itemView;
}
#Override
public void destroyItem(ViewGroup container, int position, Object view){
container.removeView((View)view);
}
}
I'm trying to make an image pager and it looks like I've done it correct according to all the tutorials that I've looked up, but all I get is a blank screen. A breakpoint on the adapter's instantiateItem method tells me that it is being called and all the right information is getting set into the views, and swiping even works, but I still don't see anything. Here is my code
activity_photos.xml
<RelativeLayout> // I'm not including that code, irrelevant.
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imagePager"
android:background="#android:color/black"/>
</RelativeLayout>
viewpager_itemx.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/imageView"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/imageLabel"
android:textColor="#android:color/white"/>
</LinearLayout>
PhotosActivity.java
final String[] images = getResources().getStringArray(R.array.tips_images);
final String[] labels = getResources().getStringArray(R.array.tips_text);
final ViewPager viewPager = (ViewPager) findViewById(R.id.imagePager);
final ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(PhotoTipsActivity.this, images, labels);
viewPager.setAdapter(viewPagerAdapter);
and finally, ViewPagerAdapter.java
public class ViewPagerAdapter extends PagerAdapter {
private Context context;
private String[] images;
private String[] labels;
public ViewPagerAdapter(Context context, String[] images, String[] labels) {
this.context = context;
this.images = images;
this.labels = labels;
}
#Override
public int getCount() {
return images.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
final View itemView = LayoutInflater.from(context).inflate(R.layout.viewpager_item, container, false);
final ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
final TextView imageLabel = (TextView) itemView.findViewById(R.id.imageLabel);
// Get drawable image.
final int imageId = context.getResources().getIdentifier(images[position], "drawable", context.getPackageName());
imageView.setImageResource(imageId);
imageLabel.setText(labels[position]);
return itemView;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(((LinearLayout) object));
}
}
Any blatantly obvious reason why I'm not seeing my images?
The same way destroyItem() needs to remove the view from the container, instantiateItem() needs to add the view to the container.
Just add
container.addView(itemView);
before returning from instantiateItem() and you'll be in business.
I would like to make banner carousel. Instead of RecyclerView I choose to use ViewPager. I have a problems with adapter implementation:
public class BannerAdapter extends PagerAdapter {
List<Banner> bannerList;
Context context;
ImageView imageView;
public BannerAdapter(List<Banner> list, Context context) {
bannerList = list;
this.context = context;
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
View v = View.inflate(context, R.layout.fragment_home_layout, null);
imageView = (ImageView) v.findViewById(R.id.image);
Picasso.with(context).load(OpApp.IMAGEORGINAL + bannerList.get(position).getMobileImage() + ".jpg").placeholder(R.drawable.op_logo).into(imageView);
return v;
}
#Override
public void destroyItem(ViewGroup collection, int position, Object view) {
}
#Override
public int getCount() {
return bannerList.size();
}
#Override
public boolean isViewFromObject(View view, Object object) {
return false;
}
}
The image is not loaded to the ViewPager.
fragment_home_layout.xml
<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"
android:background="#color/background">
<-- Other Views -->
<android.support.v4.view.ViewPager
android:id="#+id/home_banner_carousel"
android:layout_width="match_parent"
android:layout_height="#dimen/_150sdp"
android:adjustViewBounds="true"
>
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.view.ViewPager>
<-- Other Views -->
</FrameLayout>
Actual result:
Expected result:
Additional to this question, what you can suggest to achieve position indicator functionality ? I think about implements ViewPager.OnPageChangeListener but not sure with that.
I know how to implement 'ViewPager' using 'Fragments' but in my case I need to use 'List' instead of 'Fragments', and I'm confused with that.
P.S. Please don't minus my question, just comment what you don't like and what is wrong and I will try to edit it. I'm newbie here and in android. Anyway, Thank you!
Solution founded, I have changed adapter`s 2 methods and all is working!
#Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView imageView = new ImageView(context);
Picasso.with(context).load(OpApp.IMAGEORGINAL + bannerList.get(position).getMobileImage() + ".jpg")
.placeholder(R.drawable.op_logo).into(imageView);
((ViewPager) container).addView(imageView);
return imageView;
}
#Override
public void destroyItem(ViewGroup collection, int position, Object view) {
((ViewPager) collection).removeView((View) view);
}
Hi In My application I am displaying images by using swipe.Now, i want to display the under the image i want to display the name.
I want to write the some name in that image.how to write the code
Can anyone please help me.
Photos class updated code
public class Photos extends Activity {
Button button1;
String mImages;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.photos);
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
ImagePagerAdapter adapter = new ImagePagerAdapter();
viewPager.setAdapter(adapter);
}
private class ImagePagerAdapter extends PagerAdapter {
String[] description_images = getIntent().getExtras().getStringArray("{image1,image2,image3,image4}"); //ARRAY OF ALL TEXT ASSOCIATED TO IMAGES
String[] mImages = getIntent().getExtras().getStringArray("{R.drawable.a,R.drawable.b,R.drawable.c,R.drawable.d}");
// String[] mText={"Text1","Text2","Text3"};
#Override
public int getCount() {
return mImages.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == ((ImageView) object);
}
#Override
public View instantiateItem(ViewGroup container, int position) {
LayoutInflater inflater = LayoutInflater.from(container.getContext());
View view = inflater.inflate(R.layout.image_view, null);
final ImageView imageView = (ImageView)view.findViewById(R.id.iv_image);
final TextView textView = (TextView )view.findViewById(R.id.iv_text);
textView.setText(description_images[position]);
// imageView.setImageResource(mImages[position]);
container.addView(view, 0);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
}
xml
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#000000" >
</android.support.v4.view.ViewPager>
description_images = getIntent().getExtras().getStringArray("images_name"); //ARRAY OF ALL TEXT ASSOCIATED TO IMAGES
mImages = getIntent().getExtras().getStringArray("images_path"); //ARRAY OF ALL IMAGE PATHS
private class ImagePagerAdapter extends PagerAdapter {
#Override
public int getCount() {
return mImages.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
#Override
public View instantiateItem(ViewGroup container, int position) {
LayoutInflater inflater = LayoutInflater.from(container.getContext());
View view = inflater.inflate(R.layout.image_view, null);
final ImageView imageView = (ImageView)view.findViewById(R.id.iv_image);
final TextView textView = (TextView )view.findViewById(R.id.iv_text);
textView.setText(description_images[position]);
imageLoader.displayImage(mImages[position], imageView, options);
container.addView(view, 0);
return view;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
Corresponding XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/iv_image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:id="#+id/iv_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true" />
</RelativeLayout>