How to create a custom drop down in blackberry - blackberry

Question

Can anyone please help me to create a custom drop down similar to the image attached in blackberry 5.0. I have used object choice field but it is coming along with label. Guide me to create custom drop down as show in image below

Answer 1

I have created my customized ChoiceField, using popup Screen. Here is the below code sample
package com.src.java.rim.ui;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.DrawStyle;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.XYEdges;
import net.rim.device.api.ui.component.ListField;
import net.rim.device.api.ui.component.ListFieldCallback;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.container.PopupScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;
import net.rim.device.api.ui.decor.BackgroundFactory;
import net.rim.device.api.ui.decor.Border;
import net.rim.device.api.ui.decor.BorderFactory;
public class FWCustomChoiceField extends HorizontalFieldManager {
/*space between text and icon*/
final int padding = 10;
String arrowBitmapName = "arrow_state_grey_right.png";
Object choice[] = null;
int index = -1;
String text = "Please select one option";
ListField choiceField = null;
public FWCustomChoiceField(final Object choice[]) {
this.choice = new Object[choice.length];
this.choice = choice;
choiceField = new ListField(){
protected boolean navigationClick(int status, int time) {
Field focus = UiApplication.getUiApplication().getActiveScreen() .getLeafFieldWithFocus();
if (focus instanceof ListField) {
ChoicePopupScreen popup = new ChoicePopupScreen(10, 80, choice);
popup.setChoice(choice);
UiApplication.getUiApplication().pushScreen(popup);
}
return super.navigationClick(status, time);
}
};
choiceField.setSize(1);
choiceField.setCallback(new TestListCallback());
add(choiceField);
}
public void setSelIndex(int index){
this.index = index;
this.text = choice[index].toString();
choiceField.invalidate();
}
public int getSelectedIndex(){
return index;
}
final class TestListCallback implements ListFieldCallback {
TestListCallback() {
}
public void drawListRow(ListField list, Graphics g, int index, int y, int w) {
Bitmap bitmap = Bitmap.getBitmapResource(arrowBitmapName);
int fontWidth = getFont().getAdvance(text);
int width = Display.getWidth() ;
int posX = (width-(fontWidth + padding + bitmap.getWidth()))/2;
int height = list.getRowHeight();
int posY = (height - bitmap.getHeight())/2;
g.drawText(text, posX, y, 0, w);
g.drawBitmap(posX+fontWidth+padding,posY, bitmap.getWidth(), bitmap.getHeight(), bitmap, 0, 0);
}
public Object get(ListField listField, int index) {
return null;
}
public int getPreferredWidth(ListField listField) {
return Graphics.getScreenWidth();
}
public int indexOfList(ListField listField, String prefix, int start) {
return listField.indexOfList(prefix, start);
}
}
public class ChoicePopupScreen extends PopupScreen {
Object []choice = null;
/*holds the position for popup screen*/
private int _posX = 0;
private int _posY = 0;
public ChoicePopupScreen(int posx,int posy, Object[] choice) {
/*calling super class constructor*/
super(new VerticalFieldManager(), Field.FOCUSABLE);
this.setMargin(new XYEdges(1,1,1,1));
this.choice = new Object[choice.length];
this.choice = choice;
/*Setting position for popup screen*/
_posX = posx;
_posY = posy;
/*list field customized to display as choice picker*/
ListField choiceList = new ListField(){
/*list field event handling using navigation click*/
protected boolean navigationClick(int status, int time) {
/*getting the selected list index value*/
int index = this.getSelectedIndex();
/*returning the selected index to the main field*/
setSelIndex(index);
/*removing the popup screen from the screen stack*/
UiApplication.getUiApplication().popScreen(UiApplication.getUiApplication().getActiveScreen());
/*required for event handling*/
return super.navigationClick(status, time);
}
};
/*displays the message when list is empty*/
choiceList.setEmptyString("List is empty", DrawStyle.LEFT);
choiceList.setSize(choice.length);
choiceList.setCallback(new PopUpListCallback());
add(choiceList);
Border border = BorderFactory.createSimpleBorder( new XYEdges(), Border.STYLE_TRANSPARENT);
this.setBorder(border);
}
protected void setChoice(Object []choice) {
this.choice = new Object[choice.length];
this.choice = choice;
}
protected void sublayout(int width, int height) {
super.sublayout(width, height);
/*setting the position for the popup screen*/
setPosition(_posX , _posY);
}
}
private class PopUpListCallback implements ListFieldCallback {
PopUpListCallback() {
}
public void drawListRow(ListField list, Graphics g, int index, int y, int w) {
String text = choice[index].toString();
g.drawText(text, padding, y, 0, w);
}
public Object get(ListField listField, int index) {
return null;
}
public int getPreferredWidth(ListField listField) {
return Graphics.getScreenWidth();
}
public int indexOfList(ListField listField, String prefix, int start) {
return listField.indexOfList(prefix, start);
}
}
}
To use the above class
String choicestrs[] = {"Opt 1", "Opt 2", "Opt 3"};
add(new FWCustomChoiceField(choicestrs));