ListView row height and another interesting issue of selective focus (when the parent is scrolled)

Question

First of all, excuse me if it sounds duplicate. I have visited so many threads but couldn't find a suitable answer of my problem. I have tried ScrollingMovementMethod, android:scrollbar, wrap_content in the parent and many other things suggested in those threads but nothing worked for me. Feel free to edit the title as I couldn't find a better one.

Problem Description I have a list view and each row of the listview has three controls 1. Image View (to Show the contact image) 2. TextView (to show the Contact name) 3. TextView (to show the status message of the contact (if available)).

What I have tried:- 1. XML layout ,

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="22dp"
        android:layout_height="50dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="15dp"
        android:contentDescription="@string/strBuddyImage" >
    </ImageView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:minHeight="56dp" >

        <TextView
            android:id="@+id/uNameTxt"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_above="@+id/customMsg"
            android:minHeight="?android:attr/listPreferredItemHeight"
            android:singleLine="true"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="@dimen/fontSizeListRowHeader" />

        <TextView
            android:id="@+id/customMsg"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:maxLines="4"
            android:textSize="@dimen/fontSizeListRowText"
            android:textStyle="italic" />
    </RelativeLayout>

</LinearLayout>

2. Adapter Which extends ArrayAdapter (which only overrides the getView method)

   static class ViewHolder { public ImageView imageView; public TextView uNameTxtView; public TextView custMsgTxtView; }

   @Override
   public View getView(int position, View convertView, ViewGroup parent) {
     View rowView = convertView;
     // Log.d("BuddyListAdapter", "Inside getView() " + position);
     if ( rowView == null ) {
       LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
       rowView = inflater.inflate(R.layout.buddy_listview_row_layout, parent, false);
       viewHolder = new ViewHolder();
       viewHolder.uNameTxtView = (TextView) rowView.findViewById(R.id.uNameTxt);
       viewHolder.imageView = (ImageView) rowView.findViewById(R.id.icon);
       viewHolder.custMsgTxtView = (TextView) rowView.findViewById(R.id.customMsg);
       rowView.setTag(viewHolder);
     }
     viewHolder = (ViewHolder) rowView.getTag();
   
     synchronized (buddyList) {
       buddy = buddyList.get(position);
     }
     viewHolder.uNameTxtView.setText(buddy.getDisplayName());
     viewHolder.custMsgTxtView.setText(buddy.getCustomMessage());
   
     // Change the icon for users who are offline
     if ( buddy.getState() == 0 ) {
       viewHolder.imageView.setImageResource(R.drawable.offline);
     } else {
       viewHolder.imageView.setImageResource(R.drawable.online);
     }
     //      rowView.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT));
     return rowView;
   }
   

What I get

Desired I want to show all the rows of list view of same size and if someone has a bigger Status message (Which needs multiple lines) I would like to show the name of the person and first few lines (say 4) of the status message. No matter how big the status message is name should be always visible to the user.. How can I do that ?

Please point if any other mistake you find in the code.

Answer 1

I agree with sokie on the use of wrap_content. I tend to use LinearLayout a lot since it provides a consistent layout on various display sizes. One way of implementation is as follows. By replacing your inner RelativeLayout to LinearLayout, your text view containing the name will always be displayed and the message text view will display the maximum possibles lines (or can be limited by specifying the maxLines) with the available remaining/space. If you would like to display the whole status message, then you can achieve this by changing the parent LinearLayout height parameter to wrap_content.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="56dp" 
android:minHeight="?android:attr/listPreferredItemHeight">

<ImageView
    android:id="@+id/icon"
    android:layout_width="22dp"
    android:layout_height="50dp"
    android:layout_marginLeft="4dp"
    android:layout_marginRight="15dp" >
</ImageView>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/uNameTxt"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:textAppearance="?android:attr/textAppearanceMedium" 
        />

    <TextView
        android:id="@+id/customMsg"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:maxLines="4"
        android:textStyle="italic"
       />
</LinearLayout>

</LinearLayout>

Answer 2

One thing i noticed is you use a lot of hardcoded dimensions,is that really necesary? using wrap_content would be better practice on most layouts,that way you let android handle it. As far as your question is concerned you can do two things: 1)Your two EditTexts are inside a relative layout,and if customMsg is 4 lines long,it will get scrolled ,and you'll loose your uNameTxt so you should limit customMsg more,to something like two lines,or less. OR if you are ok with loosing some parts of the code you could adapt your layout this way

 <TextView
        android:id="@+id/uNameTxt"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        layout_alignParentTop="true"
        android:minHeight="?android:attr/listPreferredItemHeight"
        android:singleLine="true"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textSize="@dimen/fontSizeListRowHeader" />

    <TextView
        android:id="@+id/customMsg"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/uNameTxt"
        android:maxLines="4"
        android:textSize="@dimen/fontSizeListRowText"
        android:textStyle="italic" />

it should scroll down no more and you should see Name and a part of customMsg

2)Edit your layout to something more efficient like:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" 
 android:minHeight="56dp">

 <ImageView
    android:id="@+id/icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="4dp"
    android:layout_marginRight="15dp"
    android:contentDescription="sasd" >
</ImageView>

<TextView
        android:id="@+id/uNameTxt"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:singleLine="true"
        android:layout_toRightOf="@+id/icon"
        android:textSize="@dimen/fontSizeListRowHeader"
        android:textAppearance="?android:attr/textAppearanceMedium"
    />

 <TextView
        android:id="@+id/customMsg"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/uNameTxt"
        android:maxLines="2"
        android:layout_toRightOf="@+id/icon"
        android:textSize="@dimen/fontSizeListRowText"
        android:textStyle="italic" />

</RelativeLayout>