ListView add message from bottom to top?

Question

I created a chat following this example: http://warting.se/2012/06/04/chat-bubbles-in-android/ works fine but I want when I add a new message the message displayed on bottom of ListView instead added on top, like whatsapp.

I did

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>

<ListView
    android:id="@+id/listView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="80dp"
    android:divider="@android:color/transparent"
    android:dividerHeight="0dp">
</ListView>

<RelativeLayout
    android:id="@+id/form"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:orientation="vertical">

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="textMultiLine"
        android:ems="10"
        android:id="@+id/chatText"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_toLeftOf="@+id/buttonSend"
        />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Enviar"
        android:id="@+id/buttonSend"
        android:layout_alignBottom="@+id/chatText"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:background="@color/action_bar"
        android:textColor="#FFF"/>
</RelativeLayout>

ListAdapter

public class DiscussArrayAdapter extends ArrayAdapter<OneComment> {

    private TextView countryName;
    private List<OneComment> countries = new ArrayList<OneComment>();
    private LinearLayout wrapper;

    public DiscussArrayAdapter(Context context, int resource) {
        super(context, resource);
    }

    @Override
    public void add(OneComment object) {
        countries.add(object);
        super.add(object);
    }



    public int getCount() {
        return this.countries.size();
    }

    public OneComment getItem(int index) {
        return this.countries.get(index);
    }

    public View getView(int position, View convertView, ViewGroup parent) {
        View row = convertView;
        if (row == null) {
            LayoutInflater inflater = (LayoutInflater) this.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            row = inflater.inflate(R.layout.listitem_discuss, parent, false);
        }

        wrapper = (LinearLayout) row.findViewById(R.id.wrapper);

        OneComment coment = getItem(position);

        countryName = (TextView) row.findViewById(R.id.comment);

        countryName.setText(coment.comment);

        countryName.setBackgroundResource(coment.left ? R.drawable.bubble_yellow : R.drawable.bubble_green);
        wrapper.setGravity(coment.left ? Gravity.LEFT : Gravity.RIGHT);


        return row;
    }

    public Bitmap decodeToBitmap(byte[] decodedByte) {
        return BitmapFactory.decodeByteArray(decodedByte, 0, decodedByte.length);
    }

}

Answer 1

Instead of this:

countries.add(object);
super.add(object);

Use this:

countries.add(0,object);
super.insert(0,object);

The 0 indicates the position in the array, namely the beginning.

Answer 2

You have to add the object in the first position. Try this:

@Override
    public void add(OneComment object) {
        countries.add(0, object);
        super.insert(0, object);
    }

You call "add" from the ArrayList, and "insert" from the ArrayAdapter.

I hope it helps.

Answer 3

I encountered the same problem some times ago. I re ordered the List (in your case should be a List<OneComment> ) before passing it to the Adapter .
For Java order reference here .

Answer 4

<ListView 
    android:stackFromBottom="true"
...
></ListView>

Add this line in ListView.

Answer 5

Use a LinearLayout inside a ScrollView . Set height of ScrollView as MATCH_PARENT and set height of LinearLayout as WRAP_CONTENT . Set gravity of ScrollView to BOTTOM . Set orientation of LinearLayout to VERTICAL . Create another XML layout for your chat_message_item and inflate this layout while popping up new messages. Inflate and add new items in LinearLayout as mLinearLayout.addView(chatMessageItem) .

This will work.