Develop Reference

Strange actions with item selection on a ListView in Android

Could someone please help before this drives me completely insane!
Imagine you have a list view. It has in it 9 items, but there is only space to display 6 without scrolling. If an item is selected the background colour will change to indicate this.
If you select any item from 2 to 8 inclusive all is well in the world.
If you select item 1 it also selects item 9 and vica versa. Also with this selection if you scroll up and down a random number of times, the selection will change. If you continue to scroll up and down, the selection changes back to 1 and 9. The value of the selected item is always the actual item you selected.
This is my code from my adapter :
public class AvailableJobAdapter extends ArrayAdapter<JobDto> {
private Context context;
private ArrayList<JobDto> items;
private LayoutInflater vi;
public AvailableJobAdapter(Context context, ArrayList<JobDto> items) {
super(context, 0, items);
this.context = context;
this.items = items;
vi = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
JobDto jh = getItem(position);
if (convertView == null) {
convertView = vi.inflate(R.layout.inflator_job_list, null);
holder = new ViewHolder();
holder.numberText = (TextView) convertView.findViewById(R.id.txtNumber);
holder.descriptionText = (TextView) convertView.findViewById(R.id.txtDescription);
holder.statusText = (TextView) convertView.findViewById(R.id.txtStatus);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.numberText.setText(jh.getJobNumber());
holder.descriptionText.setText(jh.getDescription());
holder.statusText.setText(jh.getStatus());
return convertView;
}
public static class ViewHolder {
public TextView numberText;
public TextView descriptionText;
public TextView statusText;
}
}
and this is the code from my click listener :
jobs.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Button btnOk = (Button) findViewById(R.id.btnOk);
view.setSelected(true);
int selected = position;
int pos = val.get(selected);
int firstItem = jobs.getFirstVisiblePosition();
int viewIndex = selected - firstItem;
if (pos == 0) {
jobs.getChildAt(viewIndex).setBackgroundColor(getResources().getColor(R.color.selected));
val.set(selected, 1);
selectedCount ++;
} else {
jobs.getChildAt(viewIndex).setBackgroundColor(getResources().getColor(R.color.unselected));
val.set(selected, 0);
selectedCount --;
}
if (selectedCount > 0 ){
btnOk.setEnabled(true);
} else {
btnOk.setEnabled(false);
}
}
});
I have spent hours researching this and trying various suggestions.
Any help will be greatly appreciated.
****EDIT****
After playing with some suggestion I tested it with a HUGE list. This is exactly what the behaviour is :-
If your screen has space for 10 items, if you select item 1 it also highlights 11, 21, 31, 41 etc.
Anything in between these values behaves correctly.

From this guide:
When your ListView is connected to an adapter, the adapter will instantiate rows until the ListView has been fully populated with enough items to fill the full height of the list. At that point, no additional row items are created in memory.
Instead, as the user scroll through the list, items that leave the screen are kept in memory for later use and then every new row that enters the screen reuses an older row kept around in memory. In this way, even for a list of 1000 items, only ~7 item view rows are ever instantiated or held in memory.
That's the root of the problem you are facing. You are changing the background color of the views in your click listener. But once a selected item is scrolled out of the screen, its view will be reused for the new item that is swiping in. As the reused view had its background color changed, the new item will consequently have that same color.
You need to take in account that views are recycled, so they might be "dirty" when you get them in getView(). I recommend you to take a look at the guide from where I got the quotes above, it's a nice and important read.
One possible way to fix that is to add a boolean field to your JobDto class and use it to track if an item is selected or not. Then in getView(), you could update the background color accordingly. You'll also probably need to add the item root view(convertView) to your ViewHolder in order to change its background color.

In setOnItemClickListener() just update setSelected() true of false for clicked position and notifydataset. In getView put a condition
if(jh.isSelelcted())
{
// background is selected color
}else{
// background is non selected color
}
note : handle else condition.

Android : Updating row layouts based on User Input with a CursorAdapter

I am currently working on an Application wich displays data from a SQLiteDatabase in a listview. This listview is using custom layouts. My intent was to have three different layouts, depending on what the user is doing. The first layout only displays one TextView and a Button (called row_nameonly). If the user presses this button, the layout would switch to a more detailed view (called row_viewentry). Finnaly, if the user presses the button again, the first layout is displayed once more (row_nameonly). I have tried to accomplish this, but have not found a working solution. My current version seems to change the View of the row, but the new layout is not visible. I wish to do this without having to add extra data to the database.
This is the code of the Custom CursorAdapter :
public class EntryListCursorAdapter extends CursorAdapter{
public int viewRequestPosition = -100;
public EntryListCursorAdapter(Context context, Cursor c) {
super(context, c, 0);
}
#Override
public View newView(Context context, Cursor cursor, ViewGroup parent) {
return LayoutInflater.from(context).inflate(R.layout.row_nameonly, parent, false);
}
#Override
public void bindView(View view, final Context context, final Cursor cursor) {
ViewGroup parent = (ViewGroup) view.getParent();
if(cursor.getPosition() == viewRequestPosition){
view = LayoutInflater.from(context).inflate(R.layout.row_viewentry, parent, false);
}
if(!(cursor.getPosition() == viewRequestPosition)) {
TextView nameView = (TextView) view.findViewById(R.id.txt_name);
ImageButton expandMoreButton = (ImageButton) view.findViewById(R.id.btn_expandmore);
String name = cursor.getString(cursor.getColumnIndexOrThrow("prename")) + " " +
cursor.getString(cursor.getColumnIndexOrThrow("surname"));
nameView.setText(name);
expandMoreButton.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
viewRequestPosition = cursor.getPosition();
notifyDataSetChanged();
}
});
}
}
TLDR: Is there a way to have the CursorAdapter change the layout of the view in wich the button was clicked, and have the new layout displayed, without adding extra data to the SQLiteDatabase ?
Thank you
(If you need any more information please ask)

In case someone is curious,
I had the Adapter take the Fragment calling it in its constructor. Then i saved the position of the ListItems i wanted to change the layout of in the fragment wich called the adapter. Then i created a new instance of the adapter, but this time the layout would changed based on the positions i saved in the fragment.

Set visibility for an image within a ListView row

Overview:
I have a ListView with a custom adapter/layout, every time a user adds a new row (which contains a number), I check if that number is the smallest in the list. If so, an image within that row must be set as visible while setting all other row's images as invisible.
Problem:
My ListView does not set any row's image as visible, even though I have the index of the smallest element.
How I'm doing it:
//In MainActivity
private void addProduct(float price) { //User adds product
priceList.add(price); //Add to Float list
adapter.notifyDataSetChanged();
updateView(findMinIndex(priceList)); //Find smallest val indx
}
private void updateView(int index){
View v = listView.getChildAt(index -
listView.getFirstVisiblePosition());
if(v == null)
return;
ImageView checkMark = (ImageView) v.findViewById(R.id.check_mark);
checkMark.setVisibility(View.VISIBLE); //Initially set Invisible
}
Edit, CustomAdapter:
public CustomList(Activity context,
ArrayList<Float> priceList) {
super(context, R.layout.list_single, priceList);
this.context = context;
priceList = priceList;
}
#Override
public View getView(int position, View view, ViewGroup parent) {
LayoutInflater inflater = context.getLayoutInflater();
View rowView = inflater.inflate(R.layout.list_single, null, true);
TextView price = (TextView) rowView.findViewById(R.id.new_price);
ImageView cheapest = (ImageView) rowView.findViewById(R.id.check_mark);
price.setText(priceList.get(position) + "");
return rowView;
}
Thank you

It is your priceList binded with the adapter?
First of all i would put a breakpoint to see if you are getting the right view in the updateView method.

try this way;
Create a Pojo class with imageview and it's state(Visibility) initially set all to invisible
Add your items to the ArrayList of Pojo Class type.
when user enters a new row based on your requirement set visibility state to true or false(visible or invisible) and call notifyDataSetChanged() to the adapter.
Doing this way you can have a easy track of the items.

I got it working :).
Problem is that adapter.notifyDataSetChanged(); is async, so while it's doing that, updateView(findMinIndex(priceList)); runs but doesn't find the new row as it should. Therefore, I add a runnable to the ListView object as so:
adapter.notifyDataSetChanged();
listView.post( new Runnable() {
#Override
public void run() {
updateView(findMinIdx(priceList));
}
});
Now it works perfectly!

ArrayAdapter has strange results - Android

I have an ArrayAdapter class that creates comment boxes. There is a button within the comment box that will be either blue or black. The color of the button is dependent on an array which is received through JSON. If the array looks like this "NO","NO","YES","NO","NO","NO" the third button will have blue text. My JSON and ArrayAdapter class create 7 comment boxes at a time. The problem is once the code changes a button to blue it continuously changes the button blue. By this I mean if an array is received that looks like this "NO","NO","YES","NO","NO","NO" the third button will be blue, then I receive another set of comments so this time the array looks like this "NO","NO","NO","NO","NO","NO" according to this code no button should be blue, but for some reason the third button is still blue. I could load multiple more sets of comments and the third button will always be blue even though the code clearly says it should be black. Strangely the button will be blue but will act as if it were a black button. Here is my ArrayAdapter,
class ListAdapter extends ArrayAdapter<Item> {
public ListAdapter(Context context, int textViewResourceId) {
super(context, textViewResourceId);
}
private List<Item> items;
public ListAdapter(Context context, int resource, List<Item> items) {
super(context, resource, items);
this.items = items;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
if (v == null) {
LayoutInflater vi;
vi = LayoutInflater.from(getContext());
v = vi.inflate(R.layout.list_item_layout, null);
}
final Item p = items.get(position);
if (p != null) {
//set xml objects
//must be done inside of class
ButtonListViewItem = (TextView) v.findViewById(R.id.button_listview_item);
if(p.getJSONArray().equals("NO")){
ButtonListViewItem.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
ButtonListViewItem.setTextColor(0xff000000);
new AsyncTask().execute();
}//end on click
});
}//end if equals NO
if(p.getJSONArray().equals("YES")){
ButtonListViewItem.setClickable(false);
ButtonListViewItem.setTextColor(0xff3399FF);
}//end if equals yes
}//end if null
return v;
}//end getView
}//end ListAdapter class

The text color is wrong because you're not correctly handling recycled views.
The shortest and simplest solution is to remove this check:
if (v == null)
and inflate a new view every time. This is less efficient, but will make your code easier to work with.
The solution if you opt to continue using recycled views is to explicitly set the text color and clickability of the button every time:
if (p.getJSONArray().equals("YES")) {
ButtonListViewItem.setClickable(false);
ButtonListViewItem.setTextColor(0xff3399FF);
} else {
ButtonListViewItem.setClickable(true);
ButtonListViewItem.setTextColor(0xff000000);
}
The reason you need to do that is because recycled views are handed over just as you left them, changed attributes and all. They will no longer match your XML layout. So when a view that was previously tied to a "YES" is recycled, the changes you made to the text color will still be in place: the text will be blue and the button won't be clickable.
Inflating a new view allows you start in a known state every time---you'll always have something that starts off matching your XML. The tradeoff is efficiency, inflating views is relatively expensive. If your apps needs to be more efficient you should look into the view holder pattern as well, as finding views is also an expense that can be avoided.

Android onlistclick toggle listview row height causing muliple changes

Situation:
My application contains a ToDo-list styled listview (each row has a checkbox). The listview rows are structured with 2 textviews laid out vertically. The topmost text is the title and bottommost is the description, however the description is hidden (View.GONE). Using the ListActivities onListItemClick method I can set both the height and visibility of the pressed row.
#Override
protected void onListItemClick(ListView list, View view, int position, long id) {
super.onListItemClick(list, view, position, id);
view.getLayoutParams().height = 200;
view.requestLayout();
TextView desc = (TextView) view.findViewById(R.id.description);
desc.setVisibility(View.VISIBLE);
}
Note: Code is stripped to the most basic
The above code works fine, except that it expands both the pressed row as well as the 10th row above or below (next unloaded view?). The row expansion will also change place when list is flinged.
Background:
The listview data is retrieved from a SQLite Database through a managed cursor and set by a custom CursorAdapter. The managed cursor is sorted by checkbox value.
private void updateList() {
todoCursor = managedQuery(TaskContentProvider.CONTENT_URI, projection, null, null, TaskSQLDatabase.COL_DONE + " ASC");
startManagingCursor(todoCursor);
adapter = new TaskListAdapter(this, todoCursor);
taskList.setAdapter(adapter);
}
The CursorAdapter consists of the basic newView() and bindView().
Question:
I require some system which keeps track of which rows are expanded. I have tried storing the cursor id's in arrays and then checking in the adapter if row should be expanded, but I can't seem to get it working. Any suggestions would be much appreciated!

The ListView will recycle views as you scroll it up and down, when it needs a new child View to show, it will first see if it doesn't already have one(if it finds one it will use it). If you modify the children of a ListView like you did(in the onListItemClick() method) and then scroll the list, the ListView will eventually end up reusing that child View that you modified and you'll end up with certain views in position that you don't want(if you continue to scroll the ListView you'll see random position changing because of the View recycling).
One way to prevent this is to remember those positions that the user clicked and in the adapter change the layout of that particular row but only for the position that you want. You can store those ids in a HashMap(a field in your class):
private HashMap<Long, Boolean> status = new HashMap<Long, Boolean>();
I used a HashMap but you can use other containers(in the code bellow will see why I choose a HashMap). Next in the onListItemClick() method you'll change the clicked row, but also store that row id so the adapter will know(and take measures so you don't end up with wrong recycled views):
#Override
protected void onListItemClick(ListView l, View v, int position, long id) {
// check and see if this row id isn't already in the status container,
// if it is then the row is already set, if it isn't we setup the row and put the id
// in the status container so the adapter will know what to do
// with this particular row
if (status.get(id) == null) {
status.put(id, true);
v.getLayoutParams().height = 200;
v.requestLayout();
TextView d = (TextView) v.findViewById(R.id.description);
d.setVisibility(View.VISIBLE);
}
}
Then in the adapter use the status container with all the ids to setup the rows correctly and prevent the recycling to mess with our rows:
private class CustomAdapter extends CursorAdapter {
private LayoutInflater mInflater;
public CustomAdapter(Context context, Cursor c) {
super(context, c);
mInflater = LayoutInflater.from(context);
}
#Override
public void bindView(View view, Context context, Cursor cursor) {
TextView title = (TextView) view.findViewById(R.id.title);
title.setText(cursor.getString(cursor.getColumnIndex("name")));
TextView description = (TextView) view
.findViewById(R.id.description);
description.setText(cursor.getString(cursor
.getColumnIndex("description")));
// get the id for this row from the cursor
long rowId = cursor.getLong(cursor.getColumnIndex("_id"));
// if we don't have this rowId in the status container then we explicitly
// hide the TextView and setup the row to the default
if (status.get(rowId) == null) {
description.setVisibility(View.GONE);
// this is required because you could have a recycled row that has its
// height set to 200 and the description TextView visible
view.setLayoutParams(new AbsListView.LayoutParams(
AbsListView.LayoutParams.MATCH_PARENT,
AbsListView.LayoutParams.MATCH_PARENT));
} else {
// if we have the id in the status container then the row was clicked and
// we setup the row with the TextView visible and the height we want
description.setVisibility(View.VISIBLE);
view.getLayoutParams().height = 200;
view.requestLayout();
// this part is required because you did show the row in the onListItemClick
// but it will be lost if you scroll the list and then come back
}
}
#Override
public View newView(Context context, Cursor cursor, ViewGroup parent) {
View v = mInflater.inflate(R.layout.adapters_showingviews, null);
return v;
}
}
If you want to toggle the row clicked(and something tells me that you want this), show the TextView on a click/hide the TextView on another row clicked then simple add a else clause to the onListItemClick() method and remove the clicked row id from the status container and revert the row:
//...
else {
status.remove(id);
v.setLayoutParams(new AbsListView.LayoutParams(
AbsListView.LayoutParams.MATCH_PARENT,
AbsListView.LayoutParams.MATCH_PARENT));
TextView d = (TextView) v.findViewById(R.id.description);
d.setVisibility(View.GONE);
}