attractive listview with images

Question

i want to build an application with a listview or whatever.. that looks very attractive and have some images and many more.But i cant find a good way to have that. I exactly want my application's UI like this images:

_{(source: coenraets.org)}

_{(source: coenraets.org)}

i want to display my app like this images please suggest me how can i do this? please if u know some tutorials then give the links.

Answer 1

You need to build the layout you want in a XML file, the same way you would do for an Activity. Then just inflate the XML layout for each row in your ListView and set its values and images.

Example of one ArrayAdapter that I've inflated with my own view (picture, text and checkbox):

private class FriendListAdapter extends ArrayAdapter<User> {

    public FriendListAdapter(Activity a, int textViewResourceId, List<User> items) {
        super(a, textViewResourceId, items);
    }

    public class ViewHolder{
        public TextView username;
        public ImageView image;
        public CheckedTextView ctv;
    }

    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {
        View v = convertView;
        ViewHolder holder;

        if (v == null) {
            LayoutInflater vi = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = vi.inflate(R.layout.invite_friend_row, null);
            holder = new ViewHolder();
            holder.username = (TextView) v.findViewById(R.id.username);
            holder.username.setTypeface(tf);
            holder.image = (ImageView) v.findViewById(R.id.image);
            holder.ctv = (CheckedTextView) v.findViewById(R.id.checked);
            v.setTag(holder);
        }
        else{
            holder = (ViewHolder) v.getTag();
        }

        final User user = getItem(position);
        if(user != null){
            holder.username.setText(user.getName());
            holder.ctv.setChecked(user.isChecked());
            holder.image.setImageView(user.getImage());
        }

        return v;       
    }
}

You get the idea!

Answer 2

Yes. Just place one ImageView and TextView in one xml layout. And, inflate this layout into one layout which is having the ListView And, do the process there for getting images from webservice or locally stored

Here i provide some example links that may very useful to you -

1. Lazy load of images in ListView

2. ListView with images

3. How to display a list of images in a ListView in Android?