Android: Implementing ViewHolder - java

I am trying to implement ViewHolder in my Android app, but I keep getting that ViewHolder cannot be resolved to a type, without any suggestions for an import. Anyone know how to get around this?

That's because a ViewHolder is not a class that is from the Android SDK, you make it yourself.
Based on what I can find, a ViewHolder is an implementation that stores Views (per row in a ListView usually) for a larger area, so it is a sort of helper class and cache mechanism. This is one example I found on Android Developers of what a ViewHolder would contain.
static class ViewHolder {
TextView text;
TextView timestamp;
ImageView icon;
ProgressBar progress;
int position;
}
Then you can implement it in a ListAdapter or a similar class.

**Create a Holder class**
protected static class ViewHolderItems
{
private ImageView mStoreImage;
private TextView mStoreName;
}
And use In getView method of adapter
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolderItems viewHolder;
if (inflater == null)
inflater = (LayoutInflater) activity
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
if (convertView == null) {
convertView = inflater.inflate(R.layout.coupen_row, null);
viewHolder = new ViewHolderItems();
viewHolder.mStoreImage = (ImageView) convertView.findViewById(R.id.storeImage);
viewHolder.mStoreName = (TextView) convertView.findViewById(R.id.storeName);
convertView.setTag(viewHolder);
}
else
{
viewHolder = (ViewHolderItems) convertView.getTag();
}
return convertView;
}

Maybe you are looking for the RecyclerView.ViewHolder which is part of the android support lib.
Like the code from this link gist by Paul Burke
public static class ItemViewHolder extends RecyclerView.ViewHolder implements
ItemTouchHelperViewHolder {
public final TextView textView;
public final ImageView handleView;
public ItemViewHolder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(R.id.text);
handleView = (ImageView) itemView.findViewById(R.id.handle);
}
#Override
public void onItemSelected() {
itemView.setBackgroundColor(Color.LTGRAY);
}
#Override
public void onItemClear() {
itemView.setBackgroundColor(0);
}
}
This would make sense for you if you were working with an Android RecyclerView
In this case they need an object to hold the view so that it can be filled with content as needed.

Related

Holder vs RecylerView.ViewHolder

I have ListView with Adapter, and also use holder. but later I read about recyclerView.ViewHolder and now confused, Is it different with the one I've been using right now? I mean for the optimization purpose, I want to know if using holder only is not good enough without using recyclerView.
public class NewsAdapter extends ArrayAdapter<News> {
Context context;
List<News> myList;
public NewsAdapter(Context context, int resource, List<News> objects) {
super(context, resource, objects);
this.context = context;
this.myList = objects;
}
#Override
public News getItem(int position) {
if(myList != null)
return myList.get(position);
return null;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
Holder holder;
if (convertView == null){
LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = inflater.inflate(R.layout.list_news, null);
holder = new NewsAdapter.Holder();
holder.title = (TextView)convertView.findViewById(R.id.textViewTitle);
holder.datePosted = (TextView)convertView.findViewById(R.id.textViewDate);
holder.imageView = (ImageView)convertView.findViewById(R.id.imageViewThumbnailpic);
convertView.setTag(holder);
}else{
holder = (Holder)convertView.getTag();
}
News news = getItem(position);
holder.title.setText(news.getTitle());
holder.datePosted.setText(news.getDatePost());
Picasso.with(context)
.load(news.getImgUrl())
.placeholder(R.drawable.coin25)
.error(R.drawable.hnbspic)
.into(holder.imageView);
return convertView;
}
private class Holder{
ImageView imageView;
TextView title;
TextView datePosted;
}
}
It's better to use Recyclerview because it has been optimized for various scenarios and not just for View holder pattern like it give the option for determining how your item should be laid out or like what should be the animation or custom drawing in each item.You can read more this medium post

How to add a fast-scrolling-scrollbar to Recyclerview without 3rd-Libraries

I want to add the Fast-Scroll-Feature (like in the Android contacts app or in Whatsapp contacts) to my RecyclerView?
I would also use a listview but I need Cards in my app on the same layout!
If implementing fast-scroll to Recyclerview is too difficult, using a ViewStub is also an option, or not?
My RecyclerViewAdapter:
public class SongRecyclerViewAdapter extends RecyclerView.Adapter<SongRecyclerViewAdapter.Holder> {
private Song[] sSongs;
public SongRecyclerViewAdapter(Song[] songs) {
sSongs = songs;
}
#Override
public Holder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.adapter_songview, parent, false);
Holder holder = new Holder(view);
return holder;
}
#Override
public void onBindViewHolder(Holder holder, int position) {
//holder.imvSong.setImageResource(R.drawable.standardartwork);
holder.txvSongTitle.setText(sSongs[position].getTitle());
holder.txvSongInfo.setText(sSongs[position].getArtists());
}
#Override
public int getItemCount() {
return sSongs != null ? sSongs.length : 0;
}
public class Holder extends RecyclerView.ViewHolder {
LinearLayout linearLayout;
ImageView imvSong;
TextView txvSongTitle;
TextView txvSongInfo;
public Holder(View layout) {
super(layout);
linearLayout = (LinearLayout) layout;
imvSong = (ImageView) layout.findViewById(R.id.imvSong);
txvSongTitle = (TextView) layout.findViewById(R.id.adap_txvSongtitle);
txvSongInfo = (TextView) layout.findViewById(R.id.txvSongInfo);
}
}
}
Thanks!
the problem in your code would be the commented line :
//holder.imvSong.setImageResource(R.drawable.standardartwork);
to handle this you have 2 solutions:
1) if u have limited small amount of known images, you can to create bitmaps/drawables once when initializing then you will only need to reference those.
2) create a bitmap cache, smart way to decode bitmaps along with reusable bitmap pool and pooling mechanism. This is not trivial and this what 3rd party libraries do for you. I would not suggest to implemented it yourself.

Android - Using RecyclerView with default Adapters

Is it possible to use default Adapters for RecyclerView? ArrayAdapter, for example (without creating own classes?)
Is there sense to use RecyclerView with just one line of text per item? ListView can do it without any extra classes.
Here is a default ArrayAdapter implementation for the RecyclerView
https://github.com/passsy/ArrayAdapter
Sample implementation:
public class UserAdapter extends ArrayAdapter<User, UserAdapter.ViewHolder> {
public static class ViewHolder extends RecyclerView.ViewHolder {
private final TextView titleView;
public ViewHolder(final View itemView) {
super(itemView);
titleView = (TextView) itemView.findViewById(R.id.title);
}
}
#Nullable
#Override
public Object getItemId(#NonNull final User user) {
return user.getId();
}
#Override
public void onBindViewHolder(final ViewHolder holder, final int position) {
final User item = getItem(position);
holder.titleView.setText(item.getName());
}
#Override
public ViewHolder onCreateViewHolder(final ViewGroup parent, final int viewType) {
final View view = LayoutInflater.from(parent.getContext())
.inflate(R.layout.itemview_user, parent, false);
return new ViewHolder(view);
}
}

"Flickering images" with ViewHolder pattern when downloading images from server

I want to create a list of Views, where the images shown in each View is downloaded from a server as you scroll the list (lazy loading). This is the code I have got so far:
public class CustomAdapter extends ArrayAdapter<Component> {
private final List<Component> components;
private final Activity activity;
public CustomAdapter(Activity context, List<Component> components) {
super(context, android.R.layout.simple_list_item_1, components);
this.components = components;
this.activity = context;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
if (convertView == null) {
LayoutInflater inflater = activity.getLayoutInflater();
convertView = inflater.inflate(R.layout.item, null, false);
viewHolder = new ViewHolder();
viewHolder.imageView = (ImageView) convertView.findViewById(R.id.image);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder)convertView.getTag();
}
Component component = components.get(position);
// Don't show any image before the correct one is downloaded
viewHolder.imageView.setImageBitmap(null);
if (component.getImage() == null) { // Image not downloaded already
new DownloadImageTask(viewHolder.imageView).execute(component);
} else {
viewHolder.imageView.setImageBitmap(component.getImage());
}
return convertView;
}
private class ViewHolder {
ImageView imageView;
}
private class DownloadImageTask extends AsyncTask<Component, Void, Component> {
private ImageView imageView;
public DownloadImageTask(ImageView imageView) {
this.imageView = imageView;
}
#Override
protected Component doInBackground(Component... params) {
String url = params[0].getImageURL();
Component component = params[0];
// Download the image using the URL address inside found in component
Bitmap image = ImageDownloader.getImage(url);
// Set the Bitmap image to the component so we don't have to download it again
component.setImage(image);
return component;
}
#Override
protected void onPostExecute(Component component) {
// Update the ImageView with the downloaded image and play animation
imageView.setImageBitmap(component.getImage());
Animation animation = AnimationUtils.loadAnimation(activity, R.anim.fade_in);
imageView.startAnimation(animation);
}
}
}
Basically, when getView() is run it gets data (in this case a Bitmap) from Component (which is used to cache data from the item), unless there is no data. In that case it executes the DownloadImageTask which will download the image and store it inside a Component. Once it's stored it puts the image in the ImageView.
My problem is that when using the ViewHolder pattern the ImageViews, instead of the "wrong way" (calling findViewById() each time), scrolling through the list will make the wrong ImageViews get the downloaded Bitmap. This gif shows how it looks:
Preview
Obviously, I want the images to only appear where they should. Is there any good way to make this work as supposed to?
I used Glide to solve the problem. Thanks everyone for informing me there already existed such wonderful things!
Doing (almost) the same thing was as easy as:
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
if (convertView == null) {
LayoutInflater inflater = activity.getLayoutInflater();
convertView = inflater.inflate(R.layout.item, null, false);
viewHolder = new ViewHolder();
viewHolder.imageView = (ImageView) convertView.findViewById(R.id.image);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
String url = components.get(position).getImageURL();
Glide.with(activity).load(url).crossFade().into(viewHolder.imageView);
return convertView;
}
While others are right that there are many libraries that can handle this for you, it is possible to do it the way you tried initially if you really want to. You just need to make sure you cancel AsyncTasks when the item view is recycled. You can do this by adding the AsyncTask to your ViewHolder class, so you can see if there's something running and cancel it before starting a new one.
private class ViewHolder {
ImageView imageView;
AsyncTask<?,?,?> task;
}
Then in your getView():
#Override
public View getView(int position, View convertView, ViewGroup parent) {
...
// Don't show any image before the correct one is downloaded
viewHolder.imageView.setImageBitmap(null);
if (viewHolder.task != null) { // Existing task may be executing
viewHolder.task.cancel(true);
viewHolder.task = null;
}
if (component.getImage() == null) { // Image not downloaded already
AsyncTask<?,?,?> task = new DownloadImageTask(viewHolder.imageView);
viewHolder.task = task;
task.execute(component);
} else {
viewHolder.imageView.setImageBitmap(component.getImage());
}
return convertView;
}

Populating Custom ArrayAdapters

I have made my own CustomArrayAdapter to show list of Brazilian Restaurants. I have overidden the GetView method to make my own custom view.
private class MyAdapter extends ArrayAdapter<String> {
public MyAdapter(Context context, int resource, int textViewResourceId,
String[] strings) {
super(context, resource, textViewResourceId, strings);
// TODO Auto-generated constructor stub
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View row = inflater.inflate(R.layout.list_item, parent,false);
String [] items= getResources().getStringArray(R.array.locations_array);
TextView tv= (TextView) row.findViewById(R.id.textView1);
ImageView iv = (ImageView) row.findViewById(R.id.imageView1);
tv.setText(items[position]);
iv.setImageResource(R.drawable.brazil);
return row;
}
}
Currently this new GetView class is pulling in a text string from a resource xml file and putting it into the list item.
If I wanted to incorporate an array of extra data generated within the app, I assume that I don't do the array generating in the GetView class as this will be recreated each time a new row is made.
Where do I put the code to make the array, and how do I call this data into the GetView code above?
It's worth pointing out that for better performance you should be making use of the convertView variable passed into the getView() method.
The use of convertView allows you to re-use list item views instead of creating new ones which has a heavy performance hit. If you have a large data set or value performance in your app, you would do well to check out the documentation for getView()
Your code would then look something more like this:
...
//it's also worth moving these methods to your constructor so they aren't called every time getView() for better performance
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
String [] items= getResources().getStringArray(R.array.locations_array);
#Override
public View getView(int position, View convertView, ViewGroup parent) {
if(convertView == null)
convertView = inflater.inflate(R.layout.list_item, parent, false);
TextView tv= (TextView) convertView.findViewById(R.id.textView1);
ImageView iv = (ImageView) convertView.findViewById(R.id.imageView1);
tv.setText(items[position]);
iv.setImageResource(R.drawable.brazil);
return row;
}
...
Building on #CodeDownZero's answer, I highly recommend you adopt the ViewHolder pattern, and definitely recycle your listviews (using convertview).
...
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = null;
if (convertView == null) {
LayoutInflater inflater = (LayoutInflater) getSystemService
(Context.LAYOUT_INFLATER_SERVICE);
view = inflater.inflate(textViewResourceId, parent, false);
final ViewHolder viewHolder = new ViewHolder();
viewHolder.tv1 = (TextView) view.findViewById(R.id.textView1);
viewHolder.tv2 = (TextView) view.findViewById(R.id.textView2);
view.setTag(viewHolder);
} else {
view = convertView;
}
ViewHolder holder = (ViewHolder) view.getTag();
MyDataClass data = this.getItem(position);
holder.tv1.setText(data.street);
holder.tv2.setText(data.name);
return view;
}
...
private class ViewHolder {
private TextView tv1;
private TextView tv2;
}
You can base an ArrayAdapter on a custom class instead of string. Here is an example:
public class MyDataClass {
public String street;
public String name;
}
private class MyAdapter extends ArrayAdapter<MyDataClass> {
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View row = inflater.inflate(R.layout.list_item, parent,false);
TextView tv1= (TextView) row.findViewById(R.id.textView1);
TextView tv2= (TextView) row.findViewById(R.id.textView2);
MyDataClass data = this.getItem(position);
tv1.setText(data.street);
tv2.setText(data.name);
return row;
}
}
To populate the Adapter with data you can use this snippet in the OnCreate method of the Activity:
..
MyAdapter adapter = new MyAdapter();
MyDataClass lData = new MyDataClass(); // here was a mistake
lData.name = "MyName";
lData.street = "MyRoad";
adapter.Add(lData);
..
ListView.Adapter=adapter; // where Listview is the Listview

Categories

Resources