Develop Reference

Dynamically added views in cursor adapter stacking on top of each-other

I use bindView() method is custom CursorAdapter implementation to dynamically add text views to a list.
Each list item is represented by list_item layout which contains flow_layout layout from Android Flowlayout
<!--List Item Layout-->
<?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="wrap_content"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#FFFFFF">
<!--Flow Layout-->
<org.apmem.tools.layouts.FlowLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/view_padding"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:id="#+id/hash_tag_layout"
>
</org.apmem.tools.layouts.FlowLayout>
</LinearLayout>
The number of text views added to flow_layout per each instance of list item reflects the number of row values returned in the cursor.
public void bindView(View view, Context context, Cursor cursor) {
// Flow layout wraps new views around the screen.
FlowLayout flowLayout = (FlowLayout) view.findViewById(R.id.flow_Layout);
// getRowValues() puts row values from cursor into an array list.
ArrayList<> rowValues = getRowValues(cursor);
// A new text view is created and inserted into Flow layout
// for each value in rowValues
TextView tv;
for value in rowValues {
tv = = new TextView(ctx);
tv.setText(value);
flowLayout.addView(tv);
}
}
To re-iterate, I want the number of text views inside each flow_layout per each instance of list_item to reflect the number of row values returned by the cursor.
However, every time I re-scroll over a list item, the number of text views in that particular item doubles, and additionaly, binded data sometimes does the reflect symetrically between the position of the cursor and the position of the list item. I think the problem is related to the recycling of old text views.
How can I prevent new text views from stacking onto old textviews? Is it possible to override view recycling in custom cursor adapter for specific child views, and force garbage collection them when they go off screen?
Here is full implemtation of custom cursor adapter
public class DatabaseAdapter extends CursorAdapter {
Context ctx;
public DatabaseAdapter(Context context, Cursor cursor, int flags) {
super(context, cursor, 0);
ctx = context;
}
public View newView(Context context, Cursor cursor, ViewGroup parent) {
View v = LayoutInflater.from(context).inflate(R.layout.list_item, parent, false);
return v;
}
public void bindView(View view, Context context, Cursor cursor) {
// Flow layout wraps new views around the screen.
FlowLayout flowLayout = (FlowLayout) view.findViewById(R.id.flow_Layout);
// getRowValues() puts row values from cursor into an array list.
ArrayList<> rowValues = getRowValues(cursor);
// A new text view is created and inserted into Flow layout
// for each value in rowValues array list
TextView tv;
for value in rowValues {
tv = = new TextView(ctx);
tv.setText(value);
flowLayout.addView(tv);
}
}
}

if(flowLayout.getChildCount() > 0)
flowLayout.removeAllViews();

Check box refresh issue in ListView with custom adaptor

I'm having a list View with each item composed of a collection of Textviews and a CheckBox.
I'm storing the state of the checkbox in the DB and updating it from a on clickListener .It works fine for the controls that are visible.By default all the checkbox's are in the checked state.
If there are 10 items and screen can accommodate 7, then when I Uncheck the first one and scroll to the 10th item and again scroll back to the first one. The first one looses its state( it gets checked again).I checked the DB for the rows state, which is reflected correctly. But the fetch in the BindView always get me the wrong state. I'm not able to pin down where the issues is. I have attached the list adaptor along with this for review...
// List Adaptor code
public class ListAdaptor extends CursorAdapter {
private LayoutInflater mInflater;
Cursor dataCursor;
Context context;
ListView mLv;
private static final String TAG = "Delete";
public ListAdaptor(Context context, Cursor cursor, ListView lv)
{
super(context, cursor);
this.context = context;
mLv = lv;
mInflater = LayoutInflater.from(context);
}
#Override
public void bindView(View view, Context context, final Cursor cursor) {
// Get the stored tag for the view
CheckBox tmp_Chk = (CheckBox)view.findViewById(R.id.chkbox);
String selText = cursor.getString(11);
// Debug Message
int val = cursor.getPosition();
tmp_Chk.setChecked(false);
SparseBooleanArray sba = mLv.getCheckedItemPositions();
if(sba != null)
if(sba.get(cursor.getPosition()))
tmp_Chk.setChecked(true);
}
#Override
public View newView(Context context, Cursor cursor, ViewGroup parent)
{
View newView = mInflater.inflate(R.layout.listviewlyt, null);
return newView;
}
}
// Item layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<CheckBox
android:id="#+id/chkbox"
android:focusable="false"
android:clickable="false"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</CheckBox>
<TextView
android:id="#+id/label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#+id/label"
android:textSize="18sp"
android:textColor="#000000" >
</TextView>
</LinearLayout>
// List control code in the Main Activity
lv.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
int lv_Pos = ListView.INVALID_POSITION;
CheckBox tmp_Chk = (CheckBox)view.findViewById(R.id.chkbox);
if (lv_Pos != ListView.INVALID_POSITION) {
if(tmp_Chk.isChecked()){
Check_Uncheck(Integer.toString(lv_Pos + 1), 1);
}
else if(!tmp_Chk.isChecked()){
Check_Uncheck(Integer.toString(lv_Pos + 1), 0);
}
}
public void Check_Uncheck(String deleteItem , int select)
{
// Initialize database
DB dbAdapters = DB.getDBAdapterInstance(TabActivity.this);
dbAdapters.openDataBase();
ContentValues cv_InitialValues = new ContentValues();
cv_InitialValues.put("Selection", select);
dbAdapters.b_UpdateRecordInDB("Items", cv_InitialValues, "_id=?", new String[] {deleteItem});
dbAdapters.close();
}
});
// List view XML Properties in the Main activity
<ListView
android:id="#+id/LV_Instore_CartTab"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textSize="2px"
android:layout_weight="1"
android:choiceMode="multipleChoice"/>

You will want to override getView in your adapter. This function is called as views come into view when the list is scrolled. The convertView variable is the view that has just gone out of view as you scroll and is being reused. The convertView may be null so you should check if it is null and inflate a new row layout if it is null, otherwise you can use the convertView just like you would if you had inflated it. Now what is happening to you is that the view is being reused but you are not setting the state back to how you want it in the getView function. In this function you should use the position variable passed in to determine which item in your list the view is being connected with. If you store the state of the check in the list of objects you can then use the position to get the correct item out of your list. Use the object you retrieve from the list to either check or uncheck the checkbox in your row.

I am not really aware of CompundButton, but can you try the below code snippet,
tmp_Chk.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
if ( !tmp_Chk.isChecked()) {
tmp_Chk.setChecked(false);
Check_Uncheck();
} else {
Check_Uncheck();
tmp_Chk.setChecked(true);
}
}
});
if (cursor.getInt(11) == 0) {
tmp_Chk.setChecked(false);
} else {
tmp_Chk.setChecked(true);
}

Can I make one ListView item have a different Text Color?

I have the layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ListView
android:id="#+id/ListView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:textColor="#android:color/white"
android:dividerHeight="1px"
android:listSelector="#drawable/highlight_sel"
/>
</LinearLayout>
And the code:
private ListView lv1;
private String lv_arr[]={"Item 1","Item 2","Item 3","Item 4"};
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.newsmenu);
lv1=(ListView)findViewById(R.id.ListView01);
// By using setAdpater method in listview we an add string array in list.
lv1.setAdapter(
new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1,
lv_arr));
}
I want the text color of Item 2 (or 1 or 3 or 4) to appear dynamically as red (denoting a new item) or white (default). Is there a way to do this?
I already have a selector present, which is why I used ListView. I've search the Internet and this site, and I have not seen this question broached.
So is it possible?

Yes everything is possible. you need to write your own adapter implementation basically overriding the getView Method in the adapter. search google and stack you will find many tutorials on how to write an adapter.

Writing a special adapter to override getView in simple adapter is the way to change the text color alternating on the lines of your choice in a listview. I took the example which has been repeated many times on this website and added a way to change the text color. position mod length to select the color position can be replaced with any scheme you like. The text view "business" can be the first line of your layout like mine--or use the android.R.id.text1.
public class SpecialAdapter extends SimpleAdapter {
private int[] colors = new int[] { 0x30FF0000, 0x300000FF };
public SpecialAdapter(Context context, List<HashMap<String, String>> items, int resource, String[] from, int[] to) {
super(context, items, resource, from, to);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = super.getView(position, convertView, parent);
int colorPos = position % colors.length;
//view.setBackgroundColor(colors[colorPos]); //old example
TextView tv1 = (TextView)view.findViewById(R.id.business); //new
tv1.setTextColor(colors[colorPos]); //new
return view;
}
}
Just use SpecialAdapter instead of SimpleAdapter in your app.

Here's an example of a getView method. Note that it's using a viewholder for efficiency. If you want to know more about that, let me know.
public View getView(int position, View convertView, ViewGroup parent) {
tempDeal = exampleBoxArrayList.get(position);
ViewHolder holder;
if (convertView == null) {
convertView = inflator.inflate(R.layout.list_item_example_box, null);
holder = new ViewHolder();
holder.divider = (RelativeLayout) convertView.findViewById(R.id.example_box_divider);
holder.merchantName = (TextView) convertView.findViewById(R.id.example_box_merchant_name);
holder.expireDate = (TextView) convertView.findViewById(R.id.example_box_expire_date);
holder.description = (TextView) convertView.findViewById(R.id.example_box_description);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
if (tempDeal.isDivider()) {
holder.divider.setVisibility(View.VISIBLE);
} else {
holder.divider.setVisibility(View.GONE);
}
holder.merchantName.setText(tempDeal.getMerchantName());
holder.expireDate.setText(tempDeal.getExpiryDateString());
holder.description.setText(tempDeal.getPriceOption().getDescription());
return convertView;
}
As you can see, I call the isDivider() method on my custom object (this method looks at a boolean set on data load). This method is used to turn the visibility of part of the layout on or off.
Alternatively, you could load a completely new layout based on this same concept.

Android: Add event listeners to every item in a ListView

I have an Android app with a ListView, and each row in the list has a TextView and a Button. What I want to do is add an OnClickListener to each Button in the ListView, but I can't figure out how to get some sort of reference to every Button... Can anyone please give me a hint?
Here's my XML that's bound to the ListAdapter:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/row_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textSize="18sp">
</TextView>
<Button
android:id="#+id/row_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true" />
</RelativeLayout>
And I tried something like this, but it doesn't work:
SimpleCursorAdapter rows = new SimpleCursorAdapter(this, R.layout.row_layout, cursor, from, to);
setListAdapter(rows);
Button button = (Button) getListAdapter().getView(0, null, getListAdapter()).findViewById(R.id.row_button);
button.setOnClickListener(new View.OnClickListener() {
#Override public void onClick(View v) {
Log.i(TAG, "clicked");
}
});

It's not possible using SimpleCursorAdapter... you will have to create your own adapter. If you don't want to write a custom Adapter, at least try to enhance the SimpleCursorAdapter with new capabilities. For instance:
public class YourAdapter extends SimpleCursorAdapter{
public YourAdapter(Context context, int layout, Cursor c, String[] from, int[] to) {
super(context, layout, c, from, to);
}
public View getView(int position, View convertView, ViewGroup parent){
View view = super.getView(position, convertView, parent);
Button button = (Button)view.findViewById(R.id.row_button);
button.setOnClickListener(new View.OnClickListener() {
#Override public void onClick(View v) {
Log.i(TAG, "clicked");
}
});
return view;
}
}
Then, you can do:
SimpleCursorAdapter rows = new YourAdapter(this, R.layout.row_layout, cursor, from, to);
setListAdapter(rows);

Regarding Cristian's answer, one thing I discovered is that getView is called many times, not just when the view is created. So, you will be executing your getView code more frequently than you might think.
If the attributes (e.g. the OnClick listener) you are adding are invariant across all elements in the list, you can override newView instead. It will be called exactly once for each displayed row in the ListView. However, be warned that ListView recycles views, so as you scroll, the ones that drop off one end of the view are reused on the other, but with new data from the cursor. Again, as long as your attributes are invariant, this will work great.

Multiple choice list with custom view?

I've seen example com.example.android.apis.view.List11 from ApiDemos. In that example, each row takes the view android.R.simple_list_item_multiple_choice. Each such view has a TextView and a CheckBox.
Now I want each view to have 2 TextViews and 1 CheckBox, somewhat similar to the List3 example. I tried creating a custom layout file row.xml like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<CheckBox
android:id="#+id/checkbox"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
android:layout_height="fill_parent" />
<TextView
android:id="#+id/text_name"
android:textSize="13px"
android:textStyle="bold"
android:layout_toLeftOf="#id/checkbox"
android:layout_alignParentLeft="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/text_phone"
android:textSize="9px"
android:layout_toLeftOf="#id/checkbox"
android:layout_below="#id/text_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
Then in Activity's onCreate(), I do like this:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Query the contacts
mCursor = getContentResolver().query(Phones.CONTENT_URI, null, null, null, null);
startManagingCursor(mCursor);
ListAdapter adapter = new SimpleCursorAdapter(this,
R.layout.row,
mCursor,
new String[] { Phones.NAME, Phones.NUMBER},
new int[] { R.id.text_name, R.id.text_phone });
setListAdapter(adapter);
getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
}
The result kind of looks like what I want, but it looks like the list doesn't know which item of it is selected. Also, I need to click exactly on the CheckBox. In the List11 example, I only need to click on the item row.
So what do I need to do to make a multiple choice list with my custom view for each row? Many thanks.

You have to make your own RelativeLayout that implements the Checkable interface and have a reference to the CheckBox or to the CheckedTextView (or a list if it's multiple choice mode).
Look at this post:
http://www.marvinlabs.com/2010/10/29/custom-listview-ability-check-items/

The answer of Rahul Garg is good for the first time the list is loaded, if you want some rows to be checked depending on the model data, but after that you have to handle the check/uncheck events by yourself.
You can override the onListItemCLick() of the ListActivity to check/uncheck the rows
#Override
protected void onListItemClick(ListView l, View v, int position, long id) {
super.onListItemClick(l, v, position, id);
ViewGroup row = (ViewGroup)v;
CheckBox check = (CheckBox) row.findViewById(R.id.checkbox);
check.toggle();
}
If you do so, do not set the ListView to CHOICE_MODE_MULTIPLE, because it makes strange things when calling the function.
To retrieve the list of checked rows, you have to implement a method yourself, calling getCheckItemIds() on the ListView does not work:
ListView l = getListView();
int count = l.getCount();
for(int i=0; i<count; ++i) {
ViewGroup row = (ViewGroup)l.getChildAt(i);
CheckBox check = (Checked) row.findViewById(R.id.ck1);
if( check.isChecked() ) {
// do something
}
}

Each such view has a TextView and a
CheckBox.
No, it doesn't. It has a CheckedTextView.
So what do I need to do to make a
multiple choice list with my custom
view for each row?
Try making the CheckBox android:id value be "#android:id/text1" and see if that helps. That is the ID used by Android for the CheckedTextView in simple_list_item_multiple_choice.

The solution is to create a custom View that implements the Clickable interface.
public class OneLineCheckableListItem extends LinearLayout implements Checkable {
public OneLineCheckableListItem(Context context, AttributeSet attrs) {
super(context, attrs);
}
private boolean checked;
#Override
public boolean isChecked() {
return checked;
}
#Override
public void setChecked(boolean checked) {
this.checked = checked;
ImageView iv = (ImageView) findViewById(R.id.SelectImageView);
iv.setImageResource(checked ? R.drawable.button_up : R.drawable.button_down);
}
#Override
public void toggle() {
this.checked = !this.checked;
}
}
And create a custom layout for the list items using the new widget.
<?xml version="1.0" encoding="utf-8"?>
<ax.wordster.OneLineCheckableListItem xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:background="#drawable/selector_listitem"
android:orientation="horizontal" >
<ImageView
android:id="#+id/SelectImageView"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/button_friends_down" />
<TextView
android:id="#+id/ItemTextView"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:gravity="center"
android:text="#string/___"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/text_item" />
</ax.wordster.OneLineCheckableListItem>
Then create a new custom Adapter using the layout above.

It is possible by some trick
in your ListActivtyClass in method
protected void onListItemClick(ListView l, View v, int position, long id) {
//just set
<your_model>.setSelected(true);
}
now in you custom Adapter
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = inflater.inflate(textViewResourceId, parent, false);
}
if (<your_model>.isSelected()) {
convertView.setBackgroundColor(Color.BLUE);
} else {
convertView.setBackgroundColor(Color.BLACK);
}
return convertView;
}
this way you can customize the view in adapter when the item is selected in the list.

Simple example how to get a custom layout to work as custom checkbox:
private class FriendsAdapter extends ArrayAdapter<WordsterUser> {
private Context context;
public FriendsAdapter(Context context) {
super(context, R.layout.listitem_oneline);
this.context = context;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
final int pos = position;
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View rv = inflater.inflate(R.layout.listitem_oneline, parent, false);
rv.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
boolean checked = friendsListView.isItemChecked(pos);
friendsListView.setItemChecked(pos, !checked);
}
});
WordsterUser u = getItem(position);
TextView itw = (TextView) rv.findViewById(R.id.ItemTextView);
itw.setText(u.userName + " (" + u.loginName + ")");
ImageView iv = (ImageView) rv.findViewById(R.id.SelectButton);
if (friendsListView.isItemChecked(position)) {
iv.setImageResource(R.drawable.downbutton);
} else {
iv.setImageResource(R.drawable.upbutton);
}
return rv;
}
}

I found it very useful this little code: http://alvinalexander.com/java/jwarehouse/apps-for-android/RingsExtended/src/com/example/android/rings_extended/CheckableRelativeLayout.java.shtml
It is a great addition to #ferdy182 's http://www.marvinlabs.com/2010/10/29/custom-listview-ability-check-items/ content.

Got the solution ... You can get the clicks on the views (like checkboxes in custom layouts of row) by adding listener to each of them in the adapter itself while you return the converted view in getView(). You may possibly have to pass a reference of list object if you intent to get any list specific info. like row id.

I want to confirm that the Pritam's answer is correct. You need an onClickListener on each list's item (define it in the adapter's getView()).
You can create a new onClickListener() for each item, or have the adapter implement onClickListener() - in this case the items must be tagged for the listener to know, which item it is operating on.
Relying on the list onItemClickListener() - as someone advised in another thread - will not work as the CheckBox will intercept the click event so the list will not get it.
And finally #Rahul and JVitella:
The situation is that the CheckBox on a list item must be clickable and checkable independently from the list item itself. Therefore the solution is as I just described above.