Blackberry Development 4: Create an User Interface
January 27, 2012 1 Comment
There are three types of UI components from RIM API:
Screens (net.rim.device.api.ui.Screen): There’s one active screen per application at any time. Screens handle field layout through a delegate manager and provide additional functionality like menus.
Managers (net.rim.device.api.ui.Manager): These arrange fields on the screen. Each field must belong to one and only one manager. Each manager is also a field, meaning managers can contain other managers, allowing for some pretty intricate UI layouts.
Fields (net.rim.device.api.ui.Field): These are the basic building blocks of the UI. Generally, each control, such as a button or text field, corresponds to an instance of a field. The Field class draws the control and handles user input.
Please refer to Blackberry Smartphone UI Guide from RIM.
UiTest.java(Project: UiTest)
package com.henry416.UiTest;
import net.rim.device.api.ui.UiApplication;
public class UiTest extends UiApplication {
public UiTest () {
UiTestMainScreen mainScreen = new UiTestMainScreen();
pushScreen(mainScreen);
}
public static void main(String[] args) {
UiTest app = new UiTest();
app.enterEventDispatcher();
}
}
UiTestMainScreen.java:
package com.henry416.UiTest;
import net.rim.device.api.ui
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.component.EditField;
import net.rim.device.api.ui.component.PasswordEditField;
import net.rim.device.api.ui.component.CheckboxField;
import net.rim.device.api.ui.component.ObjectChoiceField;
import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.container.HorizontalFieldManager;
import net.rim.device.api.ui.FieldChangeListener;
import net.rim.device.api.ui.component.Dialog;
public class UiTestMainScreen extends MainScreen implements FieldChangeListener {
BitmapField bitmapField;
EditField usernameField;
PasswordEditField passwordField;
ObjectChoiceField domainField;
CheckboxField rememberCheckbox;
ButtonField clearButton;
ButtonField loginButton;
public UiTestMainScreen() {
// add a logo at top, also put it under rsc folder of the project
Bitmap logoBitmap = Bitmap.getBitmapResource("UiTest_logo.png");
bitmapField = new BitmapField(logoBitmap, Field.FIELD_HCENTER);
add(bitmapField);
add(new SeparatorField());
add(new LabelField("Please enter your credentials:"));
// add two fields
usernameField = new EditField("Username:", "");
passwordField = new PasswordEditField("Password:", "");
add(usernameField);
add(passwordField);
// add a domain field
domainField = new ObjectChoiceField("Domain:", new String[] {"Prod", "Dev"});
add(domainField);
// add a checkbox
rememberCheckbox = new CheckboxField("Remember password", false);
add(rememberCheckbox);
add(new SeparatorField());
// create two buttons
clearButton = new ButtonField("Clear", ButtonField.CONSUME_CLICK);
loginButton = new ButtonField("Login", ButtonField.CONSUME_CLICK);
// using HorizontalFieldManager to add two buttons
HorizontalFieldManager buttonManager = new HorizontalFieldManager(Field.FIELD_RIGHT);
buttonManager.add(clearButton);
buttonManager.add(loginButton);
add(buttonManager);
// hook the events
clearButton.setChangeListener(this);
loginButton.setChangeListener(this);
}
public void fieldChanged(Field field, int context) {
if (field == clearButton) {
clearTextFields();
//Dialog.inform("Clear Button Pressed!");
}
else if (field == loginButton) {
login();
}
}
private void clearTextFields() {
usernameField.setText("");
passwordField.setText("");
}
private void login() {
if (usernameField.getTextLength() == 0 || passwordField.getTextLength() == 0) {
Dialog.alert("You must enter a username and password");
}
else {
String username = usernameField.getText();
String selectedDomain =
(String)domainField.getChoice(domainField.getSelectedIndex());
LoginSuccessScreen loginSuccessScreen =
new LoginSuccessScreen(username, selectedDomain);
UiApplication.getUiApplication().pushScreen(loginSuccessScreen);
}
}
}
LoginSuccessScreen.java
package com.henry416.UiTest;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.container.MainScreen;
public class LoginSuccessScreen extends MainScreen {
public LoginSuccessScreen(String username, String domain) {
add(new LabelField("Logged in!"));
add(new LabelField("Username: " + username));
add(new LabelField("Domain: " + domain));
}
}
