Click Event on ImageButton not dispatched immediately - android

I'm having a weird problem, in my rather complex view layout. (I will try to simplify it a bit in my explanation)
Basically I have a ListView, where each item consists of a TextView and an ImageButton. I am able to either click the list item (on the textview), or the button (I set the ImageButton to non-focusable, otherwise it wouldn't work)
Now it seems to work fine, until I open another window and return to the listview.
From that point on, I can click the ImageButton without anything happening (not even the background changes during the click). But when I click on the TextView again, all the click events from the ImageButton are dispatched at once.
Why is that?
EDIT:
The List Item:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0px"
android:minHeight="40dp"
android:orientation="horizontal"
android:paddingLeft="2px"
android:paddingRight="2px"
>
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Text"
android:textSize="19dp"
android:paddingTop="4px"
android:paddingBottom="4px"
android:layout_gravity="center_vertical"/>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/open_subtree_layout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="0px"
android:orientation="horizontal"
android:padding="0px">
<View
android:layout_width="1px"
android:layout_height="match_parent"
android:background="#drawable/separator_line" />
<com.treeviewer.leveldisplay.DontPressWithParentImageButton
android:id="#+id/btn_right"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:background="#drawable/list_selector_background"
android:focusable="false"
android:focusableInTouchMode="false"
android:padding="10dp"
android:src="#drawable/arrow_right" />
</LinearLayout>
</LinearLayout>
That's how it is inflated:
[...]
LayoutInflater inflater = (LayoutInflater)mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
mView = inflater.inflate(R.layout.tree_row, null, false);
TextView textView = (TextView)mView.findViewById(R.id.text1);
LinearLayout nextNodeButtonContainer = (LinearLayout)mView.findViewById(R.id.open_subtree_layout);
if(childCount >= 0) {
titleBuilder.append(" (" + childCount + ")");
nextNodeButtonContainer.setVisibility(View.VISIBLE);
View button = nextNodeButtonContainer.findViewById(R.id.btn_right);
button.setFocusable(false);
button.setFocusableInTouchMode(false);
//button.setClickable(true);
button.setOnClickListener(clickListener);
button.setTag(tagValue);
} else {
nextNodeButtonContainer.setVisibility(View.GONE);
}
textView.setText(titleBuilder);
Let me know, if you need more code.

Ok, I finally solved this problem.
Unfortunately, in my question I didn't provide the necessary information to solve it, as the problem was somewhere I didn't expect it:
I have a ListAdapter where the getView method looks like this:
public View getView(int position, View convertView, ViewGroup parent) {
return mNodes.get(position).getView(mNodeArrowClickListener, position);
}
And the getView method of the nodes (TreeLevelElements) looked like:
public class TreeLevelElement {
private final Context mContext;
private View mView = null;
//[...] other methods
View getView(OnClickListener clickListener, final int tagValue) {
if(mView == null) {
//[...] produce a new View from XML
}
return mView;
}
}
The problem was, that I stored the Views in my elements, so I guess that conflicted somehow with android strategy to reuse old views for new items.
I don't know what exactly happened, but now that I removed mView and create a new one every time, it works.
I will also change it to reuse the convertView instead.

Related

How to tell which of multiple getView results is visible?

I need to add custom button objects to each row in a ListView. Here's a simplified row layout:
<LinearLayout android:id="#+id/table_cell"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView android:id="#+id/label"
android:textSize="19dp"
android:textStyle="bold"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:lines="1"
/>
<LinearLayout android:id="#+id/button_wrapper"
android:layout_width="100dp"
android:layout_height="match_parent"
/>
</LinearLayout>
In my custom ArrayAdapter, I place the button into the cell in getView():
#Override
public View getView(int position, View convertView, ViewGroup parent) {
// recycle the cell if possible
View cell = null;
if (convertView == null) {
LayoutInflater inflater = (LayoutInflater) this.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
cell = inflater.inflate(R.layout.table_cell, parent, false);
} else {
cell = convertView;
}
MyButton button = (MyButton) this.buttons.get(position);
if (button != null) {
// remove the button from the previous instance of this cell
ViewGroup parent = (ViewGroup)button.getParent();
if (parent != null) {
parent.removeView(button);
}
// add the button to the new instance of this cell
ViewGroup buttonWrapper = (ViewGroup)cell.findViewById(R.id.button_wrapper);
buttonWrapper.addView(button);
}
}
I know that getView() is called multiple times for each table row as I scroll the table or click buttons or do other things, so the code above removes the button from the previous view before adding it to the new view to avoid a "view already has a parent" exception.
The problem is that this assumes the latest view generated from getView is the one that's visible on the screen, but this is often not the case. Sometimes getView() generates new views, but an older view remains on the screen. In that situation, my button disappears because getView() moves it to a new view that is not visible. I discovered that behavior by initializing an int variable named repeatRowTest and then adding this code inside getView():
if (position == 0) {
Log.d("getView", "repeat row count: " + repeatRowCountTest);
TextView label = (TextView)cell.findViewById(R.id.label);
label.setText(String.format("%d %s", repeatRowCountTest, label.getText()));
repeatRowCountTest++;
}
This shows me how many times a given row has been generated, and which instance is currently displayed. I might see a row being generated 10 times, while only the 5th one is displayed. But my buttons will only be visible if the latest instance of the row is displayed.
So the question is, how can I tell whether a row generated in getView() is actually going to be displayed, so I know whether to move my button into it, or leave my button where it is? Or more generally, how can I add a button to a row and make sure it remains visible as getView is repeated for a given position?
I've inspected all the properties of a displayed row versus an extra, non-displayed row, and couldn't find any differences. I also tried calling notifyDataSetChanged on the array adapter after my buttons disappear, and that refreshes the list with all the latest views that contain the buttons -- but it's not clear which events trigger getView to repeat itself, so I wouldn't know when I need to call notifyDataSetChanged to make things right again. I suppose I could clone the button and add a new instance of the button to each new instance of the row, but that seems more resource-intensive than is necessary, and will create other problems since other objects have references to these buttons. I haven't found any code examples showing the best way to do this, but it seems like a common requirement, so hopefully I'm missing something simple!
UPDATE: Is there a method of the ArrayAdapter I can override that is called after the getView() methods are called? If so, I could check the parents of all the recently created rows to see if they are actually displayed in the ListView, and refresh the ListView at that point if they aren't.
You don't need to create your custom button by code, you can insert it inside the row layout xml like a normal android button. In this way you can remove the button wrapper layout and the add/remove logic from getView.
<LinearLayout android:id="#+id/table_cell"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView android:id="#+id/label"
android:textSize="19dp"
android:textStyle="bold"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:lines="1"
/>
<yourpackagename.MyButton
android:id="#+id/button"
android:layout_width="100dp"
android:layout_height="match_parent"
/>
</LinearLayout>
Is simpler to understand with code, but maybe you have to adapt it.
XML:
<LinearLayout android:id="#+id/table_cell"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView android:id="#+id/label"
android:textSize="19dp"
android:textStyle="bold"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:lines="1"
/>
<yourpackagename.MyButton
android:id="#+id/button1"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button2"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button3"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button4"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button5"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button6"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button7"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
<yourpackagename.MyButton
android:id="#+id/button8"
android:layout_width="12dp"
android:layout_height="match_parent"
/>
</LinearLayout>
Model class that you pass to the Adapter:
public class MyRowModel
{
public boolean isButton1Visible;
public boolean isButton2Visible;
public boolean isButton3Visible;
public boolean isButton4Visible;
public boolean isButton5Visible;
public boolean isButton6Visible;
public boolean isButton7Visible;
public boolean isButton8Visible;
}
ViewHolder:
private class ViewHolder {
public MyButton b1;
public MyButton b2;
public MyButton b3;
public MyButton b4;
public MyButton b5;
public MyButton b6;
public MyButton b7;
public MyButton b8;
}
getView method:
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
if (convertView == null) {
LayoutInflater inflater = (LayoutInflater) this.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = inflater.inflate(R.layout.table_cell, parent, false);
viewHolder = new ViewHolder();
viewHolder.b1 = (MyButton)convertView.findViewById(R.id.button1);
viewHolder.b2 = (MyButton)convertView.findViewById(R.id.button2);
viewHolder.b3 = (MyButton)convertView.findViewById(R.id.button3);
viewHolder.b4 = (MyButton)convertView.findViewById(R.id.button4);
viewHolder.b5 = (MyButton)convertView.findViewById(R.id.button5);
viewHolder.b6 = (MyButton)convertView.findViewById(R.id.button6);
viewHolder.b7 = (MyButton)convertView.findViewById(R.id.button7);
viewHolder.b8 = (MyButton)convertView.findViewById(R.id.button8);
convertView.setTag(viewHolder);
} else {
viewHolder = convertView.getTag();
}
MyRowModel myRowModel = getItem(position);
if(myRowModel.isButton1Visible)
{
viewHolder.b1.setVisibility(View.VISIBLE);
}
else
{
viewHolder.b1.setVisibility(View.INVISIBLE);
}
if(myRowModel.isButton2Visible)
{
viewHolder.b2.setVisibility(View.VISIBLE);
}
else
{
viewHolder.b2.setVisibility(View.INVISIBLE);
}
//and so on
return convertView;
}
I noticed that if I scroll the ListView after the problem occurs, all the rows redraw with the buttons showing, so apparently Android intends to display the latest view for each row, but it isn't always refreshing the view.
Then I tried to figure out what is causing getView to run repeatedly for the currently visible rows (normally it would only run when new rows come into view). Unfortunately, lots of things that are happening elsewhere in this activity are triggering the ListView to regenerate its views, like a ProgressBar that moves as audio plays, an animation that shortens and lengthens the ListView to show another view next to it, and the buttons inside the table rows updating with different graphics to show the status of different things the app is tracking. I was able to eliminate some of this, for example by checking to see if a button is already in the desired state before updating its state, but I can't eliminate all of it.
Since the most frequent action that triggers getView is updating the audio ProgressBar, I added a line to call invalidateViews() on the ListView whenever I update the ProgressBar. That keeps the ListView refreshed so that the latest views always remain visible and therefore my views always remain visible. When running in the debugger, that slows the app down quite a bit, but when running on a standalone device, the performance change isn't noticeable.
Perhaps a better question to ask at this point is why a ProgressBar that isn't related to the ListView causes the ListView to constantly regenerate its views. If I have time or I run into more problems with this, I'll post that as a separate question.

convertView loses onitemClick after the listView is scrolled

I'm having a slightly weird error here on my adapter.
The view the adapter is creating is a thumbnail on the left side and a table with a few rows. Each row have two textviews.
One of the textviews have the android:autoLink="web" property set and the listview have an onItemClickListener on it.
the problem is that every time a TextView auto-links it's content, next time its parent view is converted, it doesn't receive clicks from the onItemClickListener anymore.
Let me clarify with an example:
view1, view2, view3 and view4 are on the list view on the screen.
view2 have a link and it appears, and onClick the link opens.
the item click works normally for view1, view 3 and view4.
scroll the listview and view1 is converted to position5 and then view2 is converted to position6.
the item at position6 does not contain a link, but the onItemClick is also not fired for the position6 element.
the autolink feature of the textview is certainly changing something with my layout, but I don't know what. There must a property I can reset for every call to getView on my adapter, but which?
thanks for any help.
edit
let's see some code, it's pretty standard/good practices.
the getView from my adapter is:
#Override
public View getView(int position, View convertView, ViewGroup parent) {
// Inflate a new layout if needed
if (convertView == null)
convertView = createNewView();
// Gets the item from my array
AGplus item = (AGplus) getItem(position);
// Gets the holder pointing to the views
Holder h = (Holder) convertView.getTag();
// That's a test version, I won't be using date.toString() later on
h.date.setText(new Date(item.getDate()).toString());
// This guys is giving me a headache,
// If it parses the link, I can't never click on this convertView anymore,
// event re-converting them for a text that does not contain links
h.txt.setText(item.getTitle());
// some image download stuff that doesn't matter for this code
return convertView;
}
that layouts used is a image and table and the amount of rows I inflate and insert on the table varies for each adapter. The table layout is a horizontal linear layout with a imageview and the table layout with some margin stuff and here is the row layout:
<?xml version="1.0" encoding="utf-8"?>
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/text" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:text=""
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/text" />
</TableRow>
if I completely remove the android:autoLink="web" I get all the clicks, but as stated before, once a view gets "auto-linked" and then I recycle that view, I can't get clicks on that view again.
edit
and here is the layout inflation:
private View createNewView() {
// Instantiate view
View v = getLayoutInflater().inflate(R.layout.expandable_child_view, null);
TableLayout table = (TableLayout) v.findViewById(R.id.table);
Holder h = new Holder();
v.setTag(h);
// Instantiate rows
h.thumb = (ImageView) v.findViewById(R.id.img);
h.date = (TextView) createNewRow(table, "Date: ");
h.txt = (TextView) createNewRow(table, "Text: ");
return v;
}
private View createNewRow(ViewGroup group, String title) {
View row;
row = getLayoutInflater().inflate(R.layout.item_table_row, null);
((TextView) row.findViewById(R.id.title)).setText(title);
group.addView(row);
return row.findViewById(R.id.text);
}
and before someone else asks, that's the expandable_child_view layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical" >
<ImageView
android:id="#+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="5dp"
android:layout_marginTop="20dp"
android:src="#drawable/ic_launcher" />
<TableLayout
android:id="#+id/table"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</TableLayout>
</LinearLayout>
as I said before, just a linear layout with a imageview and a table and a few margins.
According to Romain Guy here, this is done by design to support trackball/dpad navigation. Comment 27 has a workaround to it, by setting descendant focusability on each listview item:
setDescendantFocusability(FOCUS_BLOCK_DESCENDANTS);
or
android:descendantFocusability="blocksDescendants"
I think I know what may be going on. When you do setText(), sometimes it'll wipe out a lot of stuff. You may have to use a ClickableSpan to put the link action back into the textview.

Android ExpandableListView Parent with Button

I am trying to achieve something like this.
The Expandable List consists of the names of certain categories and when a parent is clicked, it shows the list of all the children in that category.
Now, suppose I want dynamically add a child to any category ?
How do I do that ?
Do I keep a button with every parent in the list clicking on which would add a new child under it ?
But looking around in different forums, I came to realize that it is not really easy to set a button click handler inside every parent. But if that is the only way, can anyone give me some sample code please ?
I found this thread but wasn't able to implement it in my code.
Android Row becomes Unclickable with Button
Adding a button to the group view shouldn't be that difficult.
I believe the below should work (although I don't have a project using an array backed ExpandableListView to test on).
I don't know your group row layout, so I'll make one up here for reference purposes.
group_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/test"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="35dp"
android:focusable="false"
android:focusableInTouchMode="false"
android:gravity="center_vertical"
android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/addbutton"
android:layout_width="wrap_content"
android:layout_height="35dp"
android:focusable="false"
android:focusableInTouchMode="false"
android:text="Add"
android:textSize="12dp" />
</LinearLayout>
Then in your getGroupView method from your adapter:
public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
if (convertView == null) {
View convertView = View.inflate(getApplicationContext(), R.layout.group_layout, null);
Button addButton = (Button)convertView.findViewById(R.id.addButton);
addButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
// your code to add to the child list
}
});
}
TextView textView = (TextView)convertView.findViewById(R.id.text1);
textView.setText(getGroup(groupPosition).toString());
return convertView;
}

Delete button on ListView items (like for iPhone)

I have a ListView (with an Adapter of my own) where I'd like to add a delete button by swaping an item on the ListView (like on iPhones).
I really don't know how to do it and where to start ...
Could you please give me some hints ?
Thanks
What you want to implement is a custom ListView. You need a layout for your row, here's an example
res/layout/row.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent">
<TextView android:id="#+id/Browse_DateTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent" />
<ImageButton android:id="#+id/delete"
android:layout_width="wrap_content"
android:layout_height="fill_parent" />
</LinearLayout>
Then you need to overide the getView() method of your adapter, a little like this:
setListAdapter(new ArrayAdapter<Object>(this, R.layout.row, R.id.Browse_DateTime, ourRows) {
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
if (v == null) {
LayoutInflater vi = (LayoutInflater)BrowseActivity.this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
v = vi.inflate(R.layout.row, null);
}
TextView time = (TextView) v.findViewById (R.id.Browse_DateTime);
time.setText(ourRows[position].dateTime);
ImageButton delete = (ImageButton) v.findViewById(R.id.delete);
delete.setFocusable(false);
delete.setImageDrawable(BrowseActivity.this.getResources().getDrawable(R.drawable.deletebutton));
delete.setOnClickListener(BrowseActivity.this);
delete.setId(position);
return v;
}
};)
Best regards.
PS: this is cut&paste from my code, BrowseActivity is just the name of the activity this code resides in, R.layout.row is my row.xml file, you name it any which way, just put it in /res/layout/, and if your delete button is an imagebutton, you DO need the delete.setFocusable(false); (try it without and see why).

Add a new item to a listview

I am not quite sure my question really has something to do with listview.There is an app named Gleeo Time Tracker ,and here has a screenview of it.When you press the symbol "+",a new item will be created,and you can delete one item by pressing the "-".More is that when I click the record button on the left of the item,the background will change.
My question is,what is it in the end,a listview? How can I achieve such thing?Thank you all!
What you want to do, is build a custom ListView.
This is done by providing a layout file, for example
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent">
<ImageView android:id="#+id/Plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent" />
<TextView android:id="#+id/Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent" />
</LinearLayout>
This layout is then applied to each row of your ListView by overriding its Adapter's getView() method, for example something like this:
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
if (v == null) {
LayoutInflater vi = (LayoutInflater) MyActivity.this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
v = vi.inflate(R.layout.row, null);
}
ImageView plus = (ImageView) v.findViewById(R.id.plus);
icon.setImageDrawable(BrowseActivity.this.getResources().getDrawable(R.drawable.plus));
TextView title = (TextView) v.findViewById (R.id.Browse_FileName);
// add a listener to your button and you're done
return v;
}
read about list view in developer docs and here is an example

Categories

Resources