how to create a list field as same style as BlackBerry facebook ?

Question

how to create a list field as same style as Black Berry facebook ? the RIM list field contains only text, i want to create list field that can contains other fields such as image, text area and href link .

I managed to create it ,and it works fine but the the fields inside the list item never gain focus , any idea how do it ?

public class RichListField extends ListField implements ListFieldCallback {
private Vector rows;


public RichListField(String emtpyString, RichListItem[] items) {
    super(0, ListField.MULTI_SELECT);
    setRowHeight(80);
    setEmptyString(emtpyString, DrawStyle.HCENTER);
    setCallback(this);

    rows = new Vector();

    for (int i = 0; i < items.length; i++) {
        TableRowManager row = new TableRowManager();

        row.add(new BitmapField(items[i].getBitmap()));

        LabelField itemLabel = new LabelField(items[i].getLabel(),
                DrawStyle.ELLIPSIS);
        // mark selected
        // itemLabel.setFont(Font.getDefault().derive(
        // Font.BOLD | Font.UNDERLINED));

        itemLabel.setFont(Font.getDefault().derive(Font.BOLD));
        row.add(itemLabel);

        // SET THE LIST Item description
        row.add(new LabelField(items[i].getDescription(),
                DrawStyle.ELLIPSIS) {
            protected void paint(Graphics graphics) {
                graphics.setColor(0x00878787);
                super.paint(graphics);
            }
        });


        row.add(items[i].getLink());
        rows.addElement(row);
    }
    setSize(rows.size());

}


public void drawListRow(ListField listField, Graphics g, int index, int y,
        int width) {
    RichListField list = (RichListField) listField;
    TableRowManager rowManager = (TableRowManager) list.rows
            .elementAt(index);
    rowManager.drawRow(g, 0, y, width, list.getRowHeight());
}

private class TableRowManager extends Manager {
    public TableRowManager() {
        super(0);
    }


    public void drawRow(Graphics g, int x, int y, int width, int height) {
        // Arrange the cell fields within this row manager.
        layout(width, height);

        setPosition(x, y);


        g.pushRegion(getExtent());

        subpaint(g);

        g.setColor(0x00CACACA);
        g.drawLine(0, 0, getPreferredWidth(), 0);

        // Restore the graphics context.
        g.popContext();
    }



    protected void sublayout(int width, int height) {
        // set the size and position of each field.
        int fontHeight = Font.getDefault().getHeight();
        int preferredWidth = getPreferredWidth();

        // start with the Bitmap Field of the priority icon
        Field field = getField(0);
        layoutChild(field, 32, 32);
        setPositionChild(field, 0, 0);

        // set the   label field
        field = getField(1);
        layoutChild(field, preferredWidth - 16, fontHeight + 1);
        setPositionChild(field, 34, 3);

        // set the description label field
        field = getField(2);
        layoutChild(field, preferredWidth, fontHeight + 1);
        setPositionChild(field, 34, fontHeight + 6);

        // set the Href field
        field = getField(3);
        layoutChild(field, 150, fontHeight + 1);
        setPositionChild(field, preferredWidth - 152, fontHeight + 6);

        //To set the required dimensions for the field
        setExtent(preferredWidth, getPreferredHeight());
    }


    public int getPreferredWidth() {
        return Display.getWidth();
    }

    public int getPreferredHeight() {
        return getRowHeight();
    }
}

public Object get(ListField listField, int index) {

    return null;
}

public int getPreferredWidth(ListField listField) {

    return 0;
}

public int indexOfList(ListField listField, String prefix, int start) {

    return 0;
}

}

public class RichListItem { private String label; private Bitmap bitmap; private String description; private HrefField link;

public String getLabel() {
    return label;
}

public void setLabel(String label) {
    this.label = label;
}

public Bitmap getBitmap() {
    return bitmap;
}

public void setBitmap(Bitmap bitmap) {
    this.bitmap = bitmap;
}

public String getDescription() {
    return description;
}

public void setDescription(String description) {
    this.description = description;
}

public HrefField getLink() {
    return link;
}

public void setLink(HrefField link) {
    this.link = link;
}

public RichListItem(String label, Bitmap bitmap, String description,
        HrefField link) {
    super();
    this.label = label;
    this.bitmap = bitmap;
    this.description = description;
    this.link = link;
}

}

Answer 1

Hi All, Need lil help regarding paint method in MainScreen. Using the code above, I was trying to render some lists. It works fine. But it hides all my status bar icons i added using setStatus() method. When I remove the paint method , my buttons in status bar shows up. Also I have tried using setRe g.pushRegion() , but no luck.

Here is sample code :

private void addStatusBar(){ manager = new HorizontalFieldManager();
manager.add(new BitmapField(ImageUtility.loadBitMap("ask.jpg"))); manager.add(new BitmapField(ImageUtility.loadBitMap("experts.jpg"))); manager.add(new BitmapField(ImageUtility.loadBitMap("search.jpg"))); manager.add(new BitmapField(ImageUtility.loadBitMap("my_profile.jpg"))); manager.add(new BitmapField(ImageUtility.loadBitMap("groups.jpg"))); manager.add(new BitmapField(ImageUtility.loadBitMap("analitics.jpg")));

    setStatus(manager);

}

protected void paint(Graphics graphics) {
//graphics.pushRegion(new XYRect(0, 0, getPreferredWidth(), getPreferredHeight())); Bitmap image = ImageUtility.loadBitMap("header2.jpg"); graphics.drawBitmap(0, 0, 500, image.getHeight(), image, 0, 0);

    for(int i =0; i < 5; i++ ){
        fieldList.drawListRow(fieldList, graphics, i, 50 + (i*50), 20);         
    }
}