Dynamically change the row layout of a ListView

Question

I'm working on a chat module in an app, where I want the messages from two participants on opposing alignment (other user left-aligned and my own msg right-aligned). Right now, my row layout is passed in through a static layout xml (with msg and avatar left-aligned). Is there a way to modify the view dynamically, or is there a way to pass an alternative row layout for the UI system to pick at runtime?

Answer 1

You can do that inside the getView() method of your ArrayAdapter class (assuming you are defining your own ArrayAdapter).

You could have something like this:

private class YourAdapter extends ArrayAdapter<Message> {
        private final LayoutInflater mLayoutInflater;

    YourAdapter(YourListActivity activity) {
        super(mContext, 0);
        mLayoutInflater = LayoutInflater.from(activity);
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            // Inflate your view
            convertView = mLayoutInflater.inflate(R.layout.list_view_item, parent, false);
            mViewHolder = new ViewHolder();
            mViewHolder.avatar = (ImageView) convertView.findViewById(R.id.placeholder);
            mViewHolder.message = (TextView) convertView.findViewById(R.id.message);

            convertView.setTag(mViewHolder);
        } else {
            mViewHolder = (ViewHolder) convertView.getTag();
        }

        final Message message = getItem(position);

        mViewHolder.message.setText(message.getMessage());
        // etc. Manipulate your views as you wish


        return convertView;
    }
}


   private static class ViewHolder {
        TextView message;
        ImageView avatar;
   }

getView will get called each time you the ListView is modified (like when you scroll or when new elements are added to it), so you can manipulate each row as you want there. Don't forget to set the array adapter of the ListView to an instance of this class.

listView.setListAdapter(new mYourAdapter);