How can I add a Field that is just an image ? I;ve being try to override paint in LabelField but its not working -
import net.rim.device.api.system.EncodedImage;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.component.LabelField;
public class CustomLabelField extends LabelField{
private EncodedImage image;
public CustomLabelField (EncodedImage image){
super("",HCENTER | ELLIPSIS );
this.image = image;
}
public void paint(Graphics graphics){
graphics.drawImage(0, 0, image.getWidth(), image.getHeight(), image, 0, 0, 0);
}
Thanks
Have you tried using the BitmapField? If you only need an image this is the object to use.
Related
Horizontally, I want to display two custom buttons, and between them display a label field in a BlackBerry app. I looked at "BlackBerry HorizontalFieldManager alignment", but did not achieve any success.
Here is a screenshot that I want to create in BlackBerry.
Here is the code that I created for this screen:
package mypackage;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.Font;
import net.rim.device.api.ui.Manager;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.XYEdges;
import net.rim.device.api.ui.component.BasicEditField;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.component.Dialog;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.component.PasswordEditField;
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.Background;
import net.rim.device.api.ui.decor.BackgroundFactory;
import net.rim.device.api.ui.decor.Border;
import net.rim.device.api.ui.decor.BorderFactory;
/**
* A class extending the MainScreen class, which provides default standard * behavior for BlackBerry GUI applications. */ public final class HelloBlackBerryScreen extends MainScreen { BasicEditField username; PasswordEditField password;
/**
* Creates a new MyScreen object
*/ public HelloBlackBerryScreen() { // Set the linear background. this.getMainManager().setBackground(BackgroundFactory.createLinearGradientBackground(0x91e7ff,0x0099CCFF,0x00336699,0x91e7ff));
// SET HEADER OF SCREEN VerticalFieldManager vfm = new
VerticalFieldManager(Manager.USE_ALL_WIDTH); BitmapField header = new
BitmapField(Bitmap.getBitmapResource("header.png"),FIELD_HCENTER);
HorizontalFieldManager hfm = new
HorizontalFieldManager(Field.FIELD_VCENTER |Manager.USE_ALL_WIDTH);
setTitle(header);
hfm.add(vfm); add(hfm);
//SET Container
LabelField usernameTxt = new LabelField("Username:",LabelField.FIELD_TOP);
usernameTxt.setFont(Font.getDefault().derive(Font.PLAIN, 30));
usernameTxt.setMargin(20, 0, 0, 160);
LabelField passwordTxt = new LabelField("Password :",LabelField.FIELD_BOTTOM);
passwordTxt.setFont(Font.getDefault().derive(Font.PLAIN, 30));
passwordTxt.setMargin(10, 0, 0, 160);
username = new BasicEditField(BasicEditField.FIELD_BOTTOM);username.setMargin(10, 110, 0, 160); //username.setMaxSize(getHeight());
username.setBorder(BorderFactory.createRoundedBorder(new XYEdges(3, 3,3, 3), 0x999999, Border.STYLE_FILLED));
username.setBackground(BackgroundFactory.createSolidBackground(0xe0e0e0));
password = new PasswordEditField(); password.setMargin(10, 110, 0,160); password.setBorder(BorderFactory.createRoundedBorder(new
XYEdges(3, 3, 3, 3), 0x999999, Border.STYLE_FILLED));
password.setBackground(BackgroundFactory.createSolidBackground(0xe0e0e0));
ButtonField loginBtn = new ButtonField(" Log-In ", ButtonField.CONSUME_CLICK); loginBtn.setMargin(30, 0, 0,240);
ButtonField recoveryBtn = new ButtonField("Forget Password", ButtonField.CONSUME_CLICK); recoveryBtn.setMargin(10, 0, 0,200);
add(usernameTxt); add(username); add(passwordTxt); add(password);
add(loginBtn); add(recoveryBtn);
loginBtn.setChangeListener(btnlistener); } FieldChangeListener
btnlistener = new FieldChangeListener() {
public void fieldChanged(Field field, int context) {
//Open a new screen
String uname = username.getText();
String pwd =password.getText();
//If there is no input if (uname.length() == 0 || pwd.length()==0)
Dialog.alert("One of the textfield is empty!");
else if
(uname.equals("user") && pwd.equals("admin"))
UiApplication.getUiApplication().pushScreen(newwelcome());
//Open a
new Screen else
Dialog.alert("Username or password not found!");
}
};
FieldChangeListener btnlistener2 = new FieldChangeListener() {
public void fieldChanged(Field field, int context) {
screen if variables are not empty
[1]: http://i.stack.imgur.com/PlDRu.png
For that you need to use custom manager like this.
Main Field Manager for this screen
VerticalFieldManager vfm = new VerticalFieldManager(VerticalFieldManager.USE_ALL_HEIGHT
|VerticalFieldManager.USE_ALL_WIDTH|VerticalFieldManager.FIELD_VCENTER|VerticalFieldManager.FIELD_HCENTER){
//Override the paint method to draw the background image.
public void paint(Graphics graphics){
//Draw the background image and then call super.paint
//to paint the rest of the screen.
graphics.setBackgroundColor(Color.DEEPSKYBLUE);
graphics.clear();
super.paint(graphics);
}
};
add(vfm);
and add custom manger like this
//Placing back,home icon and title at particular positions
HorizontalFieldManager customManager = new HorizontalFieldManager(HorizontalFieldManager
.USE_ALL_WIDTH)
{
//Applying background color for that Manager
public void paint(Graphics graphics)
{
graphics.setBackgroundColor(Color.DEEPSKYBLUE);//blue
graphics.clear();
super.paint(graphics);
}
//Placing the Fields
protected void sublayout(int width, int height) {
setPositionChild(
getField(0),
0,
0);
layoutChild(
getField(0),
getField(0).getPreferredWidth(),
getField(0).getPreferredHeight());
setPositionChild(
getField(1),
Display.getWidth()/2 - getField(1).getPreferredWidth()/2,
0);
layoutChild(
getField(1),
getField(1).getPreferredWidth(),
getField(1).getPreferredHeight());
setPositionChild(
getField(2),
Display.getWidth() - getField(2).getPreferredWidth(),
0);
layoutChild(
getField(2),
getField(2).getPreferredWidth(),
getField(2).getPreferredHeight());
setExtent(width, 50);
}
};
//To display Back icon
final Bitmap bmp1 = Bitmap.getBitmapResource("back.png");
BitmapField bmpfield1 = new BitmapField(bmp1,BitmapField.FOCUSABLE|BitmapField.FIELD_LEFT);
//To display Home icon
final Bitmap bmp2 = Bitmap.getBitmapResource("home.png");
BitmapField bmpfield2 = new BitmapField(bmp2,BitmapField.FOCUSABLE |BitmapField.FIELD_RIGHT);
//To display Title
LabelField lbl = new LabelField("Login",LabelField.FIELD_VCENTER);
//To Add Fields
customManager.add(bmpfield1);
customManager.add(lbl);
customManager.add(bmpfield2);
vfm. add(customManager);
If you want to fix your header at the top as I understood from your comments what you can do is create a HorizontalFieldManager and add your back, title and home button to it then you can set that horizontal field manager in your title using setTitle(hfm). Similarly if you also need to fix your footer you may use setStatus(hfm).
ObjectChoiceField not working because the below code:
protected boolean navigationUnclick(int status, int time) {
return true;
}
I have added this code to remove the menus on touchevent. Means I have made a custom bottom tab and adding and deleting verticalfields on screen. When i touch any HorizontalField it shows menu that's why i added the above code.
This is my code contains ObjectChoiceField added in horizontalfield:
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.EncodedImage;
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.Graphics;
import net.rim.device.api.ui.TouchEvent;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.component.ObjectChoiceField;
import net.rim.device.api.ui.container.VerticalFieldManager;
import com.ec.pleasewaitpopup.PleaseWaitPopupScreen;
import com.np.naijapings.ApplicationFont;
import com.np.naijapings.Constant;
import com.np.naijapings.TabControlScreen;
import com.np.naijapings.intermediateclasses.GetUserListIntermediator;
import com.tv.servercommunication.WebServiceDetails;
public class FindUsersScreen extends VerticalFieldManager implements FieldChangeListener{
private VerticalFieldManager _mainVfm;
private VerticalFieldManager _contentVfm;
private BitmapField _headerBmp;
private EncodedImage _bitmap;
private LabelField _gender;
private LabelField _age;
private LabelField _religion;
private ObjectChoiceField _genderChoiceField;
private ObjectChoiceField _ageChoiceField;
private ObjectChoiceField _religionChoiceField;
private ButtonField _findUser;
private static String[] _genderChoices={"Both gender","Male","Female"};
private static String[] _ageChoices={"Any age","18-25","26-30","31-35","36-45","46-50"};
private String[] _religionChoices={"Any religion","Hindu","Muslim"};
public FindUsersScreen(){
//HEADER IMG
_bitmap = EncodedImage.
getEncodedImageResource("find-user_header.png");
_headerBmp = new BitmapField(Constant.sizePic(_bitmap, _bitmap.getHeight(), _bitmap.getWidth()));
//MAIN VFM
_mainVfm=new VerticalFieldManager();
//CONTENT VFM
final Bitmap tabBackGroundImage = Bitmap
.getBitmapResource("finduserscr_bg.png");
_contentVfm=new VerticalFieldManager(){
protected void paint(Graphics graphics) {
int y = FindUsersScreen.this.getManager().getVerticalScroll();
graphics.drawBitmap( 0, y, tabBackGroundImage.getWidth(), tabBackGroundImage.getHeight(), tabBackGroundImage, 0, 0 );
super.paint( graphics );
}
};
//CREATE WIDGETS
_gender=new LabelField("Gender");
_genderChoiceField=new ObjectChoiceField("Gender", _genderChoices,0){
protected boolean touchEvent(TouchEvent message) {
return super.touchEvent(message);
}
};
_age=new LabelField("Age");
_ageChoiceField=new ObjectChoiceField("Age", _ageChoices,0);
_religion=new LabelField("Religion");
_religionChoiceField=new ObjectChoiceField("Religion", _religionChoices,0);
_findUser=new ButtonField(" Find Users ",ButtonField.CONSUME_CLICK);
_findUser.setChangeListener(this);
//SET FONT TYPE
/*_gender.setFont(ApplicationFont.labelFont_16);
_genderChoiceField.setFont(ApplicationFont.labelFont_16);
_ageChoiceField.setFont(ApplicationFont.labelFont_16);
_age.setFont(ApplicationFont.labelFont_20);
_religionChoiceField.setFont(ApplicationFont.labelFont_20);
_religion.setFont(ApplicationFont.labelFont_20);
*/
//SET MARGIN
/*_gender.setMargin(5,20,5,20);
_age.setMargin(5,20,5,20);
_religion.setMargin(5,20,5,20);
*/
_contentVfm.setMargin(15,30,15,0);
_genderChoiceField.setMargin(10,5,5,5);
_religionChoiceField.setMargin(10,5,5,5);
_ageChoiceField.setMargin(10,5,5,5);
_findUser.setMargin(10,80,20,80);
_contentVfm.setMargin(30,10,30,10);
//ADD FIELDS TO CONTENT VFM
//_contentVfm.add(_gender);
_contentVfm.add(_genderChoiceField);
//_contentVfm.add(_age);
_contentVfm.add(_ageChoiceField);
//_contentVfm.add(_religion);
_contentVfm.add(_religionChoiceField);
_contentVfm.add(_findUser);
_mainVfm.add(_headerBmp);
_mainVfm.add(_contentVfm);
add(_mainVfm);
}
public void fieldChanged(Field field, int context) {
if(field==_findUser){
Object obAgeRange = _ageChoiceField.getChoice(_ageChoiceField.getSelectedIndex());
String ageRange = obAgeRange.toString();
Object obgender = _genderChoiceField.getChoice(_genderChoiceField.getSelectedIndex());
String gender = obgender.toString();
Object obReligion = _religionChoiceField.getChoice(_religionChoiceField.getSelectedIndex());
String religion = obReligion.toString();
GetUserListIntermediator getUserListIntermediator=new GetUserListIntermediator(ageRange,gender,religion);
PleaseWaitPopupScreen.showScreenAndWait(getUserListIntermediator, Constant.PLEASE_WAIT_TEXT);
}
}
}
could anyone answer me how to solve this problem.
You don't get drop-down list because the field code does not process unclick event. You have intercepted and consumed this event (via return true;) before your field can process it.
Try this code for your event handler.
protected boolean navigationUnclick(int status, int time) {
super.navigationUnclick(status, time);
return true;
}
Hi, I want to create a Login Screen which has a Username and Password
and a Sign in Button
But when a user fails to enter correct information inside the TextField of Username or Password a pop up like the image chat dialog should pop up from corner of TextField's right side displaying appropriate message How can this Customization be achieved?
i am giving you a simple way. If it is not perfect to your question you just ignore this answer.
Here i made logic like following. i gave you two buttons
1)Login
2)remove
I think you know how to validate your text fields right or wrong; keep one if condition ,write your logic if right no need any field
else wrong then you have three conditions
1)id is wrong
2)password is wrong
or 3)both wrong
according two that condition you can add particular tooltip box on above text field .
I am providing sample for both wrong condition and remove condition also
make it as your requirements
Resources :
chat.png image is required for background
Sample code:
package mypackage;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.XYEdges;
import net.rim.device.api.ui.component.BasicEditField;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;
import net.rim.device.api.ui.decor.Border;
import net.rim.device.api.ui.decor.BorderFactory;
/**
* A class extending the MainScreen class, which provides default standard
* behavior for BlackBerry GUI applications.
*/
public final class MyScreen extends MainScreen implements FieldChangeListener
{
/**
* Creates a new MyScreen object
*/
private BasicEditField id,password;
private ButtonField login,cancel;
private VerticalFieldManager id_mgr,pass_mgr;
private PopupField id_hint,pass_hint;
public static Bitmap img;
public MyScreen()
{
img=Bitmap.getBitmapResource("chat.png");
// Set the displayed title of the screen
setTitle("Login Page");
Border b=BorderFactory.createRoundedBorder(new XYEdges(5, 5, 5, 5), Border.STYLE_SOLID);
id_hint=new PopupField("Wrong Id", img);
pass_hint=new PopupField("Wrong password", img);
id_mgr=new VerticalFieldManager();
id=new BasicEditField(){
protected void layout(int width, int height) {
super.layout(120, 40);
setExtent(120, 40);
}
};
id.setBorder(b);
add(id_mgr);
add(id);
pass_mgr=new VerticalFieldManager();
password=new BasicEditField(){
protected void layout(int width, int height) {
super.layout(120, 40);
setExtent(120, 40);
}
};
password.setBorder(b);
add(pass_mgr);
add(password);
login=new ButtonField("Login");
login.setChangeListener(this);
add(login);
cancel=new ButtonField("Remove");
cancel.setChangeListener(this);
add(cancel);
}
public void fieldChanged(Field field, int context) {
if(field==login)
{
try {
// id_mgr.add(new NullField(Field.FOCUSABLE));
id_mgr.add(id_hint);
id_mgr.setPadding(0, 0, 0, 50);
pass_mgr.add(pass_hint);
pass_mgr.setPadding(0, 0, 0, 50);
id_hint.setFocus();
} catch (IllegalStateException e) {
return;
}
}else if(cancel==field)
{
synchronized (UiApplication.getEventLock()) {
id_mgr.deleteAll();
pass_mgr.deleteAll();
}
}
}
}
and class for PopupField.java is
package mypackage;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.component.BitmapField;
public class PopupField extends BitmapField{
private Bitmap img,scalled_img;
private String message;
private int layout_width;
public PopupField(String message,Bitmap img)
{
this.message=message;
layout_width=this.getFont().getAdvance(message)+40;
scalled_img=new Bitmap(layout_width, img.getHeight());
img.scaleInto(scalled_img, Bitmap.FILTER_BILINEAR);
this.img=scalled_img;
}
protected void layout(int width, int height) {
super.layout(img.getWidth(), img.getHeight());
setExtent(img.getWidth(), img.getHeight());
}
protected void paint(Graphics graphics) {
graphics.drawBitmap(0, 0, img.getWidth(), img.getHeight(), img,0,0);
graphics.setColor(Color.RED);
graphics.drawText(message,20,20);
super.paint(graphics);
}
}
output image :
keep helping to others
Other solution is this link will tell you
http://v4ks1n.wordpress.com/2011/01/28/tooltips-class-for-blackberry/
I have an AbsoluteFieldManager that contains several Fields in a horizontal row, switching the focus works fine. Now i need to add another Field on the same horizontal position as the left field above. When doing so, I can no more focus the first field. The screen should look as this:
________________________
| ____ ____ ____ |
| |_f1_| |_f2_| |_f3_| |
| ____ |
| |_f4_| | with f4 added here, f1 isn't focusable, once it has
|______________________| lost focus.
If you got any Ideas how to fix this, I'd apreciate. Here is my Code so far:
TestScreen:
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.container.AbsoluteFieldManager;
import net.rim.device.api.ui.container.MainScreen;
public class TestScreen extends MainScreen {
int screenY = Display.getWidth();
int screenX = Display.getHeight();
public TestScreen() {
AbsoluteFieldManager manager = new AbsoluteFieldManager();
TestField f1 = new TestField(50, 50, true);
TestField f2 = new TestField(50, 50, true);
TestField f3 = new TestField(50, 50, true);
TestField f4 = new TestField(50, 50, true);
TestField f5 = new TestField(50, 50, false);
manager.add(f1, 0, 0);
manager.add(f2, 60, 0);
manager.add(f3, 120, 0);
manager.add(f4, 180, 0);
// this works fine:
// manager.add(f5, 1, 80);
// this not:
manager.add(f5, 0, 80);
add(manager);
}
}
TestField:
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Graphics;
public class TestField extends Field {
boolean isFocusable;
int width, height;
int bgColorUnfocused, bgColorFocused;
public TestField(int width, int height, boolean isFocusable){
this.width=width;
this.height=height;
this.isFocusable=isFocusable;
bgColorUnfocused= 0xC0C0C0;
bgColorFocused = 0x3956F7;
}
protected void layout(int w, int h) {
setExtent(width, height);
}
public boolean isFocusable() {
return isFocusable;
}
protected void paint(Graphics g) {
g.setColor(isFocus() ? bgColorFocused : bgColorUnfocused);
g.fillRect(0, 0, width, height);
}
}
TestApp:
import net.rim.device.api.ui.UiApplication;
public class TestApp extends UiApplication{
TestScreen screen = new TestScreen();
public static void main(String args[]){
TestApp app = new TestApp();
app.enterEventDispatcher();
}
public TestApp(){
pushScreen(screen);
}
}
Since AbsoluteFieldManager isn't really sure where you're placing items, it doesn't know what order to send focus when using the trackwheel. If you want to manage this, ovveride nextFocus(int, int) of the AFM so you can specify who gets the focus based off of where it is and where the intended movement is.
Take a look at http://www.blackberry.com/developers/docs/5.0.0api/net/rim/device/api/ui/Manager.html#nextFocus(int,%20int) for more details.
i am developing custom toolbar manager, but i want to adjust the fields alignment to be centered not aligned to the left , any advice
below is the code of toolbar
package galaxy.bb.ui.container;
import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.XYEdges;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.decor.Background;
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 ToolBarManager extends HorizontalFieldManager {
private int bgColor = Color.BLACK;
private int borderColor = Color.WHITE;
private int borderStyle= Border.STYLE_FILLED;
public ToolBarManager(){
super(USE_ALL_WIDTH);
}
public ToolBarManager(int bgColor) {
super(USE_ALL_WIDTH);
this.bgColor = bgColor;
}
public ToolBarManager(int bgColor, int borderStyle) {
super(USE_ALL_WIDTH);
this.bgColor = bgColor;
this.borderStyle = borderStyle;
}
public int getBgColor() {
return bgColor;
}
public void setBgColor(int bgColor) {
this.bgColor = bgColor;
}
public int getBorderColor() {
return borderColor;
}
public void setBorderColor(int borderColor) {
this.borderColor = borderColor;
}
public int getBorderStyle() {
return borderStyle;
}
public void setBorderStyle(int borderStyle) {
this.borderStyle = borderStyle;
}
protected void paint(Graphics graphics) {
super.paint(graphics);
XYEdges padding = new XYEdges(5, 5, 5, 5);
Border roundedBorder = BorderFactory.createRoundedBorder(padding,
borderColor, borderStyle);
this.setBorder(roundedBorder);
Background bg = BackgroundFactory.createSolidBackground(bgColor);
this.setBackground(bg);
}
}
You can force the fields to be displayed in the center by specifying FIELD_HCENTER when creating each field. Or by using FIELD_HCENTER when creating the manager. In the latter case, the manager will be center itself, but each fields in it will be left-adjusted. It is mostly the same end results, but under some conditions it may be displayed differently.
You can go ahead with the positioning of the contents at the center position
for eg:
When i want to place any field at the center of screen then i do
(Display.getWidth()-field.getWidth())/2
You can try positioning like this,if it helps in your case.