TextView in ListView not selectable on entire row - android

My XMLs are
activity_layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp" >
<ListView
android:id="#+id/categoriesList"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
And the customAdaptor
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp" >
<TextView
android:id="#+id/categoryIDText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible">
</TextView>
<TextView
android:id="#+id/categoryName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="20px" >
</TextView>
</LinearLayout>
So, within each row, I have two textViews. One is hidden, and other is visible.
Now, when I click on any row, the only clickable area is the one where TextView's string ends.
i.e. if my TextView categoryName has one element set as Hello then the listview's row looks like
Hello [BLANK SPACE HERE]
And when i touch the are where it is BLANK SPACE, it does not respond to the touch. But when I touch the area, where it is Hello, then it responds.
What should I do to make the entire row clickable?
Thanks
EDIT
listView.setAdapter(new CategoryAdapter(this, categories));
listView.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// When clicked, show a toast with the TextView text
}
And my custom adaptor
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View rowView = inflater.inflate(R.layout.list_view_category, parent, false);
TextView textViewID = (TextView) rowView.findViewById(R.id.categoryIDText);
TextView textViewName = (TextView) rowView.findViewById(R.id.categoryName);
textViewID.setText(""+data.get(position).getId());
textViewName.setText(data.get(position).getName());
return rowView;
}

Apparently I had to change the android:layout_width root element of my activity.xml file.
That did the trick for me.

The root element of your listview item has android:layout_width="wrap_content" change it to match_parent (in your customAdaptor xml)

Add android:clickable="false" to the TextView. This will make the touch event fall through to your underlying row.

Have you tried setting the visibility to "gone"?
<TextView
android:id="#+id/categoryIDText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone">
</TextView>

Related

How do I add margin values to inflated ListView?

This is my code for how each row looks.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="120dp"
android:id="#+id/recipe_container"
android:layout_margin="12dp"
android:background="#f1f1f1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/recipe_name_text_view"
android:layout_width="match_parent"
android:layout_height="60dp"
android:gravity="center_vertical"
android:textSize="32sp"
android:text="DUMMY TEXT"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/recipe_time_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DUMMY TEXT"/>
<TextView
android:id="#+id/recipe_difficulty_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="DUMMY TEXT"/>
</LinearLayout>
</LinearLayout>
<ImageView
android:id="#+id/recipe_thumbnail_image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/sladice"/>
</LinearLayout>
As you can see I have margin set, if I check preview it is also shown.
I populated with inflate this listivew.
This is activity_sladice.xml.
<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/recipe_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.android.recepti.Sladice"
android:background="#color/colorPrimary">
</ListView>
Now each row is together, there is no spacing between left, right, bottom , top.
If I add margin or padding to listview it only works on the entire list, not on each row.
How to do it? I know I can add divider between each row but I also want spacing right and left.
This is getView method from custom adapter.
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View recipeView = convertView;
ReceptThumbnail recipe = getItem(position);
// Inflate view if to be inflated
if (recipeView == null) {
recipeView = LayoutInflater.from(getContext()).inflate(R.layout.recipe_item, parent, false);
}
TextView recipeName = (TextView) recipeView.findViewById(R.id.recipe_name_text_view);
recipeName.setText(recipe.getName());
TextView recipeTime = (TextView) recipeView.findViewById(R.id.recipe_time_text_view);
recipeTime.setText(recipe.getTime());
TextView recipeDifficulty = (TextView) recipeView.findViewById(R.id.recipe_difficulty_text_view);
recipeDifficulty.setText(recipe.getDifficulty());
ImageView recipeImage = (ImageView) recipeView.findViewById(R.id.recipe_thumbnail_image_view);
recipeImage.setImageResource(recipe.getImageResourceID());
}
If you want to add margins to the ListView, add margns to the listview.
If you want to add margins to the items, add margins to the items.
It is simple.
However, I suggest you to use ConstraintLAyout. And RecyclerView instead of ListView.
Try using padding in the LinearLayout, and create another LinearLayout as a child of the original, and move the background attribute to it.
try setting margin programmatically in getView method using below method.
public static void setMarginLeft(View v, int left) {
ViewGroup.MarginLayoutParams params =
(ViewGroup.MarginLayoutParams)v.getLayoutParams();
params.setMargins(left, params.topMargin,
params.rightMargin, params.bottomMargin);
}

default padding or margin for listview

Is there some sort of built-in default margin or padding for a ListView?
I have a simple LinearLayout with an ImageView and a ListView.
The entire ListView appears to have a slight margin or padding.
<?xml version="1.0" encoding="utf-8"?>
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:src="#drawable/starbuzz_logo"
android:contentDescription="#string/starbuzz_logo"/>
<ListView
android:id="#+id/listView_drinks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:entries="#array/drinks" />
The screenshot is attached. I am not allowed to embed an image. screenshot
The padding or margin probably comes from the default layout for each list item. To get rid or change the size of the padding or margin, create a custom layout for the list items.
item_list_coffee.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
then override getView() in your adapter so that it uses your custom layout
#Override
public View getView(final int position, View convertView, ViewGroup parent) {
if (convertView == null) {
convertView = LayoutInflater.from(getContext()).inflate(R.layout.item_list_coffee, parent, false);
}
final String string = getItem(position);
// find textview and set text to string
return convertView;
}

Android development : Listview with android:onclick attribute on item

I'm beginner in android development and i a have question about Listview and android:onclick attribute.
I try to use attribute android:onclick ="myMethod" on each element of my listview instead of define OnItemClickListener/onItemClick (too much verbose for me)
MyMethod is executed but how can i get clicked element (current context) ?
Thanks in advance
As a beginner, setting an OnItemClickListener might seem a bit scary, but it's really not a big deal at all (and a core concept you should be learning anyway!).
So if you have a simple layout with a ListView in it like this...
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/containerView"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="#+id/myListview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
You can set up an OnItemClickListener with just this code:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_listview_layout);
listView = (ListView)findViewById(R.id.myListview);
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
//Every time an item is clicked, you can handle it right here.
}
});
}
So every time an item in your list is clicked, the onItemClick method is fired, and you can figure out which item was clicked by using the int position argument that comes in.
If i am right your question is about implementing on click listener on each listrow item instead of list row.
If that is correct this is how you should implement:
1.In your adapter of getView() method you might be inflating a layout for list row like below:
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = inflater.inflate(R.layout.list_row_layout, parent, false);
return convertView;
}
In the above code list_row_layout is the xml file i'm inflating.
Go to that layout and add the following line android:descendantFocusability="blocksDescendants" to the root level of the xml layout like below:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_margin="4dp"
android:descendantFocusability="blocksDescendants"<!--This is the line i'm talking about-->
android:background="#drawable/rounded_border_layout"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="40dp"
android:layout_marginRight="10dp"
android:id="#+id/review_main_user_image_layout"
android:layout_marginLeft="10dp"
android:layout_height="54dp">
<ImageView
android:layout_width="40dp"
android:id="#+id/review_main_user_image"
android:background="#drawable/reviews_x_trail_user_image_border"
android:layout_height="40dp"
android:src="#drawable/ic_help_user" />
<TextView
android:typeface="monospace"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Me"
android:textSize="10sp"
android:layout_gravity="center"
android:singleLine="true"
android:id="#+id/review_main_user_name"
android:layout_below="#+id/review_main_user_image" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/review_main_user_image_layout"
android:layout_toEndOf="#+id/review_main_user_image_layout">
<TextView
android:layout_marginLeft="8dp"
android:layout_width="wrap_content"
android:textColor="#color/black"
android:layout_height="wrap_content"
android:singleLine="true"
android:id="#+id/review_main_title"
android:text="Good Product For The Price"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:orientation="horizontal">
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/review_main_rating"
android:progressDrawable="#drawable/apptheme_ratingbar_small_holo_light"
android:numStars="5"
style="?android:attr/ratingBarStyleSmall" />
<TextView
android:layout_marginLeft="8dp"
android:text="12-Jun-1993"
android:id="#+id/review_main_date"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
That't it now in your adapter getView method you can implement on click listener for each widget you have in that layout.
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ReviewsXTrailViewHolder reviewsXTrailViewHolder;
if (convertView == null) {
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = inflater.inflate(R.layout.list_row_review_main, parent, false);
TextView title = (TextView)convertView.findViewById(R.id.review_main_user_image);
//title.setOnclickListener()
return convertView;
}
In that above code i have added on click listener for textview.I hope it will work
Comment below if that doesn't work

How to force AutoCompleteTextView drop down elements to wrap text in three or more lines?

I'm not able to force AutoCompleteTextView drop down elements to wrap text in three or more lines.
As you can see:
The text in the first image (drop-down element) disappears, but I wont it to wrap into more lines.
Edited: This is my xml code for the dropdown item
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
style="?android:attr/dropDownItemStyle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="false"
android:lines="4"
android:minLines="4"
android:textSize="10sp"/>
How can I do this?
Solved!
My layout dropdown_multiline_item.xml code become:
<?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" >
<TextView
android:id="#+id/textContainer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:lines="3"
android:gravity="center_vertical"
android:padding="5dp"
android:textColor="#000"
android:textSize="10sp" />
</LinearLayout>
The secret was on the two methods (into the adapter):
[...]
#Override
public void bindView(View view, Context context, Cursor cursor) {
final String text = convertToString(cursor);
((TextView) view.findViewById(R.id.textContainer)).setText(text);
}
#Override
public View newView(Context context, Cursor cursor, ViewGroup parent) {
final LayoutInflater inflater = LayoutInflater.from(context);
final View view = inflater.inflate(R.layout.dropdown_multiline_item, parent, false);
return view;
}
[...]
Hope this will help someone
Define a TextView as an XML layout with all the properties you need to make it look right (lines, ellipsize, maxLines, minLines, etc). The use the android:completionHintView attribute to set the dropdown to show the textview you defined.

Expandable List GroupView's Arrow needs to be aligned with text not centered in View

I currently have defined a ExpandableListView that will allow my second GroupView list to contain a title above it. However This does not look appealing to the user because the flow of the expansion arrow is not aligned with the text but rather in the center of the view. Does anyone have any subquestions on what I could do to make this look more appealing? I need to have a header after the second group.
This code is what sets up my GroupView in my custom adapter.
public View getGroupView(int groupPosition, boolean isExpanded, View convertView,
ViewGroup parent) {
TextView groupTitle = null;
LayoutInflater layoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = null;
if(groupPosition == 1){
v = layoutInflater.inflate(R.layout.custom_first_major_language_group_row, null);
} else {
v = layoutInflater.inflate(R.layout.custom_language_group_row, null);
}
groupTitle = (TextView) v.findViewById(R.id.text_element);
String myText = this.getGroup(groupPosition).toString();
groupTitle.setText(myText);
return v;
}
custom_language_group_row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/text_element"
android:layout_width="fill_parent"
android:layout_height="48dip"
android:textSize="20sp"
android:textColor="#fff"
android:layout_marginLeft="48dip"
android:gravity="center_vertical"
android:text = "Language Group Name"/>
</RelativeLayout>
custom_first_major_language_group_row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Major Languages"
android:textColor="#000"
android:background="#fff"
android:id="#+id/majorLanguageTitle"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_centerHorizontal="true"></TextView>
<TextView
android:id="#+id/text_element"
android:layout_width="fill_parent"
android:layout_height="48dip"
android:textSize="20sp"
android:textColor="#fff"
android:layout_marginLeft="48dip"
android:gravity="center_vertical"
android:layout_below="#+id/majorLanguageTitle"
android:text = "Language Group Name"/>
</RelativeLayout>
If you have any ideas of how I can get the drop down arrow to align with the text it would be much appreciated.
So my answer is a somewhat lame answer. I had that problem but I noticed that mine text was off centered only by about 4-5 dp's (after testing). So instead of moving the expand/collapse image to be centered correctly, I center the text and then add bottom margin to the text view of 5dp. So now my textview appears to be much closer in line with the expand/collapse image.
Not the preferred solution but it worked for me.

Categories

Resources