Question

I’m struggling with the BrowserField. I would like a screen with a BrowserField at the top, and one at the bottom. I would like to point each one to a URL containing an image (and maybe HTML) – kind of how one might see an AdMob advert.

So I want to define a custom size for the BrowserField. Can that be done?

• At the moment, the BrowserField is taking up the whole screen. (* see update below)
• I have tried to subclass it anonymously – but it is final.

Is this a possible use case, or should I look for a different solution to the problem altogether…?

---

Update:

I have placed the BrowserField within a VerticalFieldManager and sized that accordingly (as per Blackberry BrowserField does not fit to screen).

(re-edit: this was the right idea, but I had made a mistake in my code that made me think it was still broken. Accepted answer below provides perfect code to accomplish exactly what I was hoping for.)

Answer 1

I’ve layouted two BrowserFields. One is aligned to top, the other is aligned to bottom. Their height is defined by TOP_BROWSER_FIELD_HEIGHT and BOTTOM_BROWSER_FIELD_HEIGHT accordingly. In the middle there is another manager that consume all the available height that is left after layouting the BrowserFields.

import net.rim.device.api.browser.field2.BrowserField;
import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;
import net.rim.device.api.ui.decor.BackgroundFactory;

public class BrowserFieldScreen extends MainScreen implements FieldChangeListener {
    private static final int TOP_BROWSER_FIELD_HEIGHT = Display.getHeight() / 3;
    private static final int BOTTOM_BROWSER_FIELD_HEIGHT = Display.getHeight() / 3;

    private BrowserField topBrowserField;
    private BrowserField bottomBrowserField;
    private VerticalFieldManager vfmCenter;
    private ButtonField startButton;

    public BrowserFieldScreen() {
        super(NO_VERTICAL_SCROLL | NO_HORIZONTAL_SCROLL | USE_ALL_WIDTH | USE_ALL_HEIGHT);

        final VerticalFieldManager topVfm = new VerticalFieldManager(USE_ALL_HEIGHT | USE_ALL_WIDTH);
        topBrowserField = new BrowserField();
        topVfm.add(topBrowserField);

        final VerticalFieldManager bottomVfm = new VerticalFieldManager(USE_ALL_HEIGHT | USE_ALL_WIDTH);
        bottomBrowserField = new BrowserField();
        bottomVfm.add(bottomBrowserField);

        vfmCenter = new VerticalFieldManager(USE_ALL_WIDTH);       
        vfmCenter.setBackground(BackgroundFactory.createSolidBackground(Color.GRAY));
        HorizontalFieldManager hfmCenter = new HorizontalFieldManager(USE_ALL_HEIGHT | FIELD_HCENTER);
        startButton = new ButtonField("START", FIELD_VCENTER);
        startButton.setChangeListener(this);
        hfmCenter.add(startButton);
        vfmCenter.add(hfmCenter);

        VerticalFieldManager vfm = new VerticalFieldManager() {
            protected void sublayout(int maxWidth, int maxHeight) {
                setExtent(maxWidth, maxHeight);

                // layout BrowserFields first
                layoutChild(topVfm, maxWidth, TOP_BROWSER_FIELD_HEIGHT);
                layoutChild(bottomVfm, maxWidth, BOTTOM_BROWSER_FIELD_HEIGHT);

                // layout center field manager last to make it occupy all the height left
                int maxCenterHeight = maxHeight - (TOP_BROWSER_FIELD_HEIGHT + BOTTOM_BROWSER_FIELD_HEIGHT);
                layoutChild(vfmCenter, maxWidth, maxCenterHeight);

                int yPos = 0;
                setPositionChild(topVfm, 0, yPos);
                yPos += TOP_BROWSER_FIELD_HEIGHT;
                setPositionChild(vfmCenter, 0, yPos);
                yPos += vfmCenter.getHeight();
                setPositionChild(bottomVfm, 0, yPos);
            };
        };

        vfm.add(topVfm);
        vfm.add(vfmCenter);
        vfm.add(bottomVfm);
        add(vfm);
    }

    public void fieldChanged(Field field, int context) {
        if (field == startButton) {
            topBrowserField.requestContent("http://www.google.com");
            bottomBrowserField.requestContent("http://www.yahoo.com");
        }
    }
}

The result is