I have recyclerview that contains image.
#Override
public void onBindViewHolder(ViewHolder viewHolder, final int position) {
// Get element from your dataset at this position and replace the contents of the view
// with that element
if(mEntities.get(position).url.equals("kosong")) {
Log.e("LOAD", "KOSONG " + position);
viewHolder.getTextDataView().setText(mEntities.get(position).data);
}
else{
Log.e("LOAD", "ISI " + position);
Picasso.with(mContext).load(mEntities.get(position).url).skipMemoryCache().into(viewHolder.imageView);
viewHolder.getTextDataView().setText(mEntities.get(position).data);
}
}
Im success to make the image loaded to recyclerview in correct list, but somehow it duplicate in another list in that recyclerview. Why ?
Thanks for your answer :)
So from what I understand if your url contains "kosong" you shouldn't display any image right?
However you're not clearing the imageview of it's previous image. Keep in mind that listviews/recycler views recycle their views. So if you display an image on your imageview and later on (scrolling up and down) that imageview is recycled it will contain the last image that was set to it.
Remember to clear the image when you don't want to use it (if(mEntities.get(position).url.equals("kosong"))) using something like:
viewHolder.imageView.setImageResource(android.R.color.transparent);
So it should be something like this:
if(mEntities.get(position).url.equals("kosong")) {
Log.e("LOAD", "KOSONG " + position);
viewHolder.getTextDataView().setText(mEntities.get(position).data);
//we don't need to display an image here however it's possible that our listview contains another image from a recycled row. Let's clear it
viewHolder.imageView.setImageResource(android.R.color.transparent);
}
else{
Log.e("LOAD", "ISI " + position);
Picasso.with(mContext).load(mEntities.get(position).url).skipMemoryCache().into(viewHolder.imageView);
viewHolder.getTextDataView().setText(mEntities.get(position).data);
}
Related
I have been trying to implement animation vectors . I managed to do it correctly but there's seem to be a problem.
I used recycler view to display all contacts.
I have used selected and unselected functions to play animations on contact profile pic. I did it and selecting and unselecting animations have been working correctly but when I tried to unselect all selected contacts through this loop it seems to be not working and it only happens when I want to unselect them all .
private void deselectAll(viewHolder holder) {
for(int i = 0; i < selected_contacts.size(); i++){
unselected(holder, contacts.indexOf(selected_contacts.get(i)),true);
}
selected_contacts.clear();
}
i have used unselected function which's code is down below. can anybody help me with this problem here cause i cant seem to figure it out.
private void unselected(viewHolder holder, int position, boolean b) {
if(!b){
selected_contacts.remove(contacts.get(position));
}
contacts.get(position).setSelected(false);
AnimatedVectorDrawable animatedVectorDrawable = (AnimatedVectorDrawable) AppCompatResources.getDrawable(context, R.drawable.item_unselected);
holder.image2.setBackground(animatedVectorDrawable);
animatedVectorDrawable.start();
Contact.selectedItems--;
Log.i("items", "numbers of selected items are updated to " + Contact.selectedItems);
String top_text = Contact.selectedItems + " Contacts selected";
selectedItems.setText(top_text);
Log.i("animation", "animation of item no " + position + " is unselected");
}
And also animation is not working even for single item selected when tried to use setImageDrawable instead of setBackground idk what's the difference.
If you wanna see my whole project here is link to My project :
https://github.com/kevaldonga/contacts
I'm trying to read if there is any image or not, then if image is null, I make the imageview in post card gone. If not then load it using Glide.
It works when I load the recyclerview for first time. But after some scrolls, those imageviews get invisible(View.gone)
onBindViewHolder:
DataSnapshot d = topics.get(position);
holder.text.setText(d.child("caption").getValue(String.class));
if (d.child("type").getValue(String.class)!=null&&d.child("type").getValue(String.class).equals("image")){
Glide.with(c).load(d.child("image").getValue(String.class)).placeholder(R.drawable.background).centerCrop().into(holder.image);
}
else{
holder.image.setVisibility(View.GONE);
}
holder.name.setText(d.child("username").getValue(String.class));
holder.category.setText(d.child("category").getValue(String.class));
long millis = System.currentTimeMillis();
long posttime = d.child("time").getValue(Long.class);
long timedifference = millis-posttime;
int days = (int) (timedifference / (1000*60*60*24));
if (days<2){
holder.time.setText("Today");
}else {
holder.time.setText(days+" days ago");
}
if (d.child("pic").exists()){
Glide.with(c).load(d.child("pic").getValue(String.class)).placeholder(R.drawable.background).centerCrop().into(holder.pic);
}
So where am I doing wrong?
It is better to set the visibility first in your case as you are passing the image view to Glide to setup.
We never know what will happen with the glide library update, in case it library wants to access the dimensions. Especially you are making it GONE in else part, which is a bit different from making INVISIBLE.
if (d.child("type").getValue(String.class)!=null&&d.child("type").getValue(String.class).equals("image")){
holder.image.setVisibility(View.VISIBLE);
Glide.with(c).load(d.child("image").getValue(String.class)).placeholder(R.drawable.background).centerCrop().into(holder.image);
}
else{
holder.image.setVisibility(View.GONE);
}
Try this code snippet :
if (d.child("type").getValue(String.class)!=null&&d.child("type").getValue(String.class).equals("image")){
Glide.with(c).load(d.child("image").getValue(String.class)).placeholder(R.drawable.background).centerCrop().into(holder.image);
holder.image.setVisibility(View.VISIBLE);
}
else{
holder.image.setVisibility(View.GONE);
}
When you are setting visibility gone it won't be visible by it self.
you need to visible it when glide load the image and gone when image
is null.
Add holder.image.setVisibility(View.VISIBLE); in if condition.
RecyclerView creates new views first time for first visible data objects and when you scroll to load other items it reuses those views which has been scrolled to top and reuses those views again for new data items.
So whatever the visibility status of that view was when it was created for the first time, it will get retain and will be used for the other items as well.
What you need to do is to set the view VISIBLE explicitly to show it again:
if (d.child("type").getValue(String.class)!=null&&d.child("type").getValue(String.class).equals("image")){
holder.image.setVisibility(View.VISIBLE)
Glide.with(c).load(d.child("image").getValue(String.class)).placeholder(R.drawable.background).centerCrop().into(holder.image);
}
else{
holder.image.setVisibility(View.GONE);
}
I am trying to get the selected item from grid view in Android development. Here is the list of drawable I used to populate the grid view:
private static Integer[] iconlist = {
R.drawable.food_icon, R.drawable.transport_icon, R.drawable.entertainment_icon,
R.drawable.bill_icon, R.drawable.others_icon, R.drawable.salary_icon,
R.drawable.investment_icon, R.drawable.bonus_icon, R.drawable.medication_icon,
R.drawable.drinks_icon, R.drawable.car_icon, R.drawable.mask_icon,
R.drawable.shopping_icon, R.drawable.lottery_icon, R.drawable.pet_icon,
R.drawable.movie_icon, R.drawable.plant_icon, R.drawable.paint_icon,
};
And gridview on click listener:
grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent,
View v, int position, long id) {
Toast.makeText(getActivity(), "Grid Item " + (position + 1) + " Selected", Toast.LENGTH_LONG).show();
int selected = position + 1;
for(int i = 0; i < iconlist.length; i++){
if(iconlist[i] == selected){
}
}
}
});
I managed to get the correct integer position based on the clicks. What I am trying to do is based on the selected drawable, I am trying to extract out the string.
For example, when transport icon is clicked, I am trying to get the "transport_icon" string from "R.drawable.transport_icon" and store it as string. However, I not sure how to do it.
Any ideas?
first define a drawable from integer array (the ids)
Drawable drawable = context.getResources().getDrawable(iconlist[n]);
and you can get name of resources like this
String name = context.getResources().getResourceEntryName(ID);
this method should return what you need.
You can try in below way:
Context.getResources().getResourceEntryName(R.drawable.transport_icon)
or
Context.getResources().getResourceName(R.drawable.transport_icon)
Reference: https://developer.android.com/reference/android/content/res/Resources.html#getResourceEntryName(int)
I am developing a chat application, where i have implemented image sending. So without the images everything works fine. But now I'm facing issues in displaying the images that are sent / received. For that what i've done is downloaded the image first and saved it in external storage. My idea was simple fetch the bitmap set it in an imageview on the getView method. Nothing wrong with fetching the image and displaying but listview ruins everthing.
This is my code-
ListView getView()
ViewHolder holder = null;
if(convertView == null ){
convertView = inflater.inflate(R.layout.chat_list, null);
holder = new ViewHolder();
holder.mMsg = (TextView) convertView.findViewById(R.id.text);
holder.mDate = (TextView) convertView.findViewById(R.id.text1);
holder.mLinLay=(LinearLayout) convertView.findViewById(R.id.linSide1);
holder.mRelLay=(RelativeLayout) convertView.findViewById(R.id.relSide);
holder.img=(ImageView)convertView.findViewById(R.id.image);
holder.progCircle=(ProgressBar)convertView.findViewById(R.id.pbHeaderProgress);
convertView.setTag(holder);
} else{
holder = (ViewHolder) convertView.getTag();
}
holder.position=position;
holder.img.setTag(position+"img");
HashMap<String, String> hm = list.get(position);
String date=hm.get("date");
long l = Long.parseLong(date);
long unixTime = System.currentTimeMillis();
CharSequence datedate=DateUtils.getRelativeTimeSpanString(l, unixTime, 1);
String status = hm.get("status");
String who = hm.get("who");
if(hm.get("message").contains("[[pic_message]]"))
{
String picName=hm.get("message").replace("[[pic_message]]", "");
final String picPath1=Environment.getExternalStorageDirectory()+"/App/sent_pics/"+picName+".jpg";
File file = new File(picPath);
if(file.exists())
{
new AsyncTask<ViewHolder, Void, Bitmap>() {
private ViewHolder v;
Bitmap bm;
#Override
protected Bitmap doInBackground(ViewHolder... params) {
v = params[0];
bm = decodeSampledBitmapFromResource(picPath1,100,100);
return bm;
}
#Override
protected void onPostExecute(Bitmap result) {
super.onPostExecute(result);
if (v.img.getTag().equals(position+"img")) {
v.img.setImageBitmap(result);
}
}
}.execute(holder);
}else{
holder.img.setImageBitmap(null);
}
}else{
holder.img.setImageBitmap(null);
Spannable msg =getSmiledText(getApplicationContext(),hm.get("message"));
holder.mMsg.setText(msg);
}
holder.mDate.setText(datedate);
return convertView;
What the problem is-
The listview shows up, but the images are displayed at random listview items. I searched a lot for this kind of problem, tried them but still no luck. The asyntask code is from Google- Use A Background Thread.. As you see from above i didn't set any holder.mMsg.setText(msg); but still whenever the images are shown they are accompanied by a msg, which is not desirable. Also the scrolling is kindda laggy when the images are shown. I have seen many messaging apps, they all run so smoothly, and the items are never mixed up. So what do they use.Also, while googling this problem, one answer suggested that we should remove the converView if else and then everything will be fine. But that will have performance issues which i don't want.
So my question is what should i do? How do the chat apps like, hangouts,bbm,whatsapp achieve this so smoothly?
EDIT
The pictures are displayed with no problem but the main problem is that they are diplayed at random orders.
Like this- i scroll till the image message, they are displayed. Then I again scroll and now the image is displayed in other listview item. My guess is that the same view(which originallly holds the image) is now being used by other, but the image stays there. How can i fix that ? And make the listview smooth (even with images) like the IM apps?
It's because Android ListView reuses Views, so while your Asynctask execute the donInBackground the user is already doing something else and you code don't know anything about it. (So it will put the image)
I would use Picasso to avoid the problem and let someone else handle your problem.
I handled this problem in my application (a contact phone) using:
A cache, to avoid to send multiple requests for the same image even when i already have in memory his image
I send a WeakReference<> to the Asynctask so when it's done check if the ImageView is still valid and put the bitmap inside it. Update the cache.
(Specific to me) Since sometimes i could happen that a contact don't have a photo i just created another List with all users without a photo (so i don't try to download it)
Everytime a .getview is called check if the image is inside the cache and if it's inside the cache put directly it, or start the asynctask.
Bitmap bitmap = cache.get(number);
if (bitmap == null) {
Log.d(TAG, "I will download image for " + name + ".");
// i set a dummy image to avoid to show the wrong picture
holder.contactPhoto.setImageResource(R.drawable.ic_action_person);
loadUserProfilePhoto(number, holder.contactPhoto);
}
else {
// show it directly
Log.d(TAG, "I already have " + name + " in cache.");
holder.contactPhoto.setImageBitmap(bitmap);
}
If you see, it could happen that it shows another picture instead of the user-photo while it's still loading it so i set a dummy picture instead of the old photo.
It's not the best implementation, but it's to show you that it could be very hard to implement it by yourself and do it right.
Read Picasso documentation and see how it could implement it in your code (it's simple, it's just one line.)
The issue is with listview which continuously keep refreshing it.
So your all code is fine, but just set default image in holder.img instead of making it null holder.img.setImageBitmap(null);
And may be in async too, you need set default_image while your image is being loaded.
If you want display images on the fly I think you should use SurfaceView. It is a lot faster and has a higher refresh rate. I made a video streaming application where I tried to display each video frame on the ImageView but that failed. But when I tried out SurfaceVIew it worked out fine.
Currently I am in training, I am working on a file management application online.
I have a problem with the scrolling when I try to display many images (100 images or 200) with a thumbs GridView scrolling is very very long.
I download the images from the server I set drawable and layout parameter I set for the small image here is my code:
public void openImageWithCache(boolean loopTry, final ImageView iconView,
final LayoutParams layoutParams, final View v, final Node o) {
//if (v.getTag() == previewT){
try {
String prefix = (true ? "thumb_mini" : "");
File cacheFile = new File(AjaXplorerApplication.getCacheFolder(),
(prefix) + previewT.getUuidPath());
if (cacheFile.exists()) {
iconView.setImageDrawable(Drawable.createFromPath(cacheFile
.getPath()));
iconView.setLayoutParams(layoutParams);
//iconView.invalidate();
//loopTry = true;
return;
}
Are the thumb images large? If so minimize them to the smallest size you can.
In the getView method in the adapter, if the view is not null do not call "new" , just change the image, according to the position.