Android Iconified List

Iconified List
I’ve had a lot of fun hacking on Android applications recently and I’m really looking forward to seeing the future of Android unfold. My first project was the the password safe I mentioned in my last post and while working on some features for it I was looking for an example of a composite view that allowed you have cute little icons next to each entry in a list, I found a few examples that did similar things, but nothing was quite what I was looking for so I threw together the view you see here last night. I’m sure someone is else is looking to do something similar so I thought I would post about it and make it available to everyone.

Most of the magic happens by in the BulletedText View class. I basically just extend LinearLayout and create a composite view that contains an ImageView and TextView object: (Sorry if the code is a little cramped, I need to figure out how to keep wordpress from eating blank lines)

public class BulletedTextView extends LinearLayout {

    private TextView mText;
    private ImageView mBullet;

    public BulletedTextView(Context context, String text, Drawable bullet) {
            super(context);

            this.setOrientation(HORIZONTAL);

            mBullet = new ImageView(context);
            mBullet.setImageDrawable(bullet);
            // left, top, right, bottom
            mBullet.setPadding(0, 2, 5, 0);
            addView(mBullet,  new LinearLayout.LayoutParams(
                 LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));

            mText = new TextView(context);
            mText.setText(text);
            addView(mText, new LinearLayout.LayoutParams(
                 LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
    }

    public void setText(String words) {
        mText.setText(words);
    }

    public void setBullet(Drawable bullet) {
        mBullet.setImageDrawable(bullet);
    }
}

Then I created a custom list adapter for my view.

public class BulletedTextListAdapter extends BaseAdapter {

    /**
    * Remember our context so we can use it when constructing views.
    */
    private Context mContext;

    private List mItems;

    public BulletedTextListAdapter(Context context) {
        mContext = context;
        mItems  = new ArrayList();
    }

    public void addItem(BulletedText bt) {
        mItems.add(bt);
    }

    public void setListItems(List bti) {
        mItems = bti;
    }

    public int getCount() {
        return mItems.size();
    }

    public Object getItem(int position) {
        return mItems.get(position);
    }

    public boolean areAllItemsSelectable() {
        return false;
    }

    public boolean isSelectable(int position) {
        return mItems.get(position).isSelectable();
    }

    public long getItemId(int position) {
        return position;
    }

    /**
    * Make a BulletedTextView to hold each row.
    */
    public View getView(int position, View convertView, ViewGroup parent) {
        BulletedTextView btv;
        if (convertView == null) {
            btv = new BulletedTextView(mContext,
                mItems.get(position).getText(),
            mItems.get(position).getBullet());
        } else {
            btv = (BulletedTextView) convertView;
            btv.setText(mItems.get(position).getText());
            btv.setBullet(mItems.get(position).getBullet());
        }

        return btv;
    }
}

That’s pretty much all there is to it! The full source code is available if you would like to download it. It is licensed under the Apache 2 open source license. I welcome any ideas for improvements!

About these ads