Screen Transition Sample
The code that I'm about the share and go through illustrates a slide and a fade transition. When the user opens the application, the first screen appears on the BlackBerry® device and displays a button. When the user clicks the button, a second screen slides onto the display from the right. The second screen automatically fades off of the display after two seconds.
First, let's add the imports:
import net.rim.device.api.ui.*;
import net.rim.device.api.ui.component.*;
import net.rim.device.api.ui.container.*;
import net.rim.device.api.ui.decor.*;
Now, let's continue with the application:
public class ScreenTransitionSample extends UiApplication implements FieldChangeListener {
private Screen secondaryScreen;
private Runnable popRunnable;As you can see, we initialized two local variables. As the official documentation says, you must explicitly initialize local variables in a method. We've initialized the secondaryScreen variable, because Screen is the base class for all screens and popRunnable. The Runnable interface should be implemented by any class whose instances are intended to be executed by a thread. The class must define a method of no arguments called run. We'll implement run later in the code.
Any BlackBerry application that provides a user interface must extend the UiApplication class. Our class also implements FieldChangeListener. This is because Classes that want to handle change events should implement this interface.
public static void main(String[] args) {
ScreenTransitionSample theApp = new ScreenTransitionSample ();
theApp.enterEventDispatcher();
}Class ScreenTransitionSample must have one method: main(String[] args) which is the entry point into our application. We need to create an instance of our application and start it by getting it on the event thread. Next, we will create the secondary screen:
public ScreenTransitionSample () {
secondaryScreen = new FullScreen();
secondaryScreen.setBackground(
BackgroundFactory.createSolidBackground(Color.LIGHTBLUE) );
LabelField labelField = new LabelField("The screen closes automatically in two seconds by using a fade transition");
secondaryScreen.add(labelField);and create the transition object:
TransitionContext transition = new TransitionContext(TransitionContext.TRANSITION_SLIDE);
transition.setIntAttribute(TransitionContext.ATTR_DURATION, 500);
transition.setIntAttribute(TransitionContext.ATTR_DIRECTION, TransitionContext.DIRECTION_RIGHT);
transition.setIntAttribute(TransitionContext.ATTR_STYLE, TransitionContext.STYLE_PUSH);
which helps us create the animation. Next, we create an engine object:
UiEngineInstance engine = Ui.getUiEngineInstance();
As the official documentation says, a UI engine maintains a stack of Screen objects. As it pushes screens onto the stack, it draws them on top of any other screens already on the stack. When the application pops a screen off the stack, it redraws the underlying screens as necessary. Only the screen on the top of the stack receives input events.
Now, apply the transition, create a new one and apply that too onto the secondary screen:
engine.setTransition(null, _secondaryScreen, UiEngineInstance.TRIGGER_PUSH, transition);
transition = new TransitionContext(TransitionContext.TRANSITION_FADE);
transition.setIntAttribute(TransitionContext.ATTR_DURATION, 500);
transition.setIntAttribute(TransitionContext.ATTR_KIND, TransitionContext.KIND_OUT);
engine.setTransition(secondaryScreen, null, UiEngineInstance.TRIGGER_POP, transition);
Now, create the base screen and attach a button:
MainScreen baseScreen = new MainScreen();
baseScreen.setTitle("Screen Transition Sample");
ButtonField buttonField = new ButtonField("View Transition", ButtonField.CONSUME_CLICK) ;
buttonField.setChangeListener(this);
baseScreen.add(buttonField);Push the screen onto the stack and paint it:
pushScreen(baseScreen);
then continue with the run method that we discussed about at the beggining and the rest of the code:
popRunnable = new Runnable() {
public void run() {
popScreen(secondaryScreen);here we remove the base screen from the display stack, and updates the secondary screen.
}
};
}
public void fieldChanged(Field field, int context) {
pushScreen(secondaryScreen);
invokeLater(popRunnable, 2000, false);
}
}We added a listener onto the button and now we took care of the action that needs to be taken on it.
That's about it. Here's the full code sample:
import net.rim.device.api.ui.*;
import net.rim.device.api.ui.component.*;
import net.rim.device.api.ui.container.*;
import net.rim.device.api.ui.decor.*;
public class ScreenTransitionSample extends UiApplication implements FieldChangeListener {
private Screen _secondaryScreen;
private Runnable _popRunnable;
public static void main(String[] args) {
ScreenTransitionSample theApp = new ScreenTransitionSample ();
theApp.enterEventDispatcher();
}
public ScreenTransitionSample () {
secondaryScreen = new FullScreen();
secondaryScreen.setBackground( BackgroundFactory.createSolidBackground(Color.LIGHTBLUE) );
LabelField labelField = new LabelField("The screen closes automatically in two seconds by using a fade transition");
secondaryScreen.add(labelField);
TransitionContext transition = new TransitionContext(TransitionContext.TRANSITION_SLIDE);
transition.setIntAttribute(TransitionContext.ATTR_DURATION, 500);
transition.setIntAttribute(TransitionContext.ATTR_DIRECTION, TransitionContext.DIRECTION_RIGHT);
transition.setIntAttribute(TransitionContext.ATTR_STYLE, TransitionContext.STYLE_PUSH);
UiEngineInstance engine = Ui.getUiEngineInstance();
engine.setTransition(null, _secondaryScreen, UiEngineInstance.TRIGGER_PUSH, transition);
transition = new TransitionContext(TransitionContext.TRANSITION_FADE);
transition.setIntAttribute(TransitionContext.ATTR_DURATION, 500);
transition.setIntAttribute(TransitionContext.ATTR_KIND, TransitionContext.KIND_OUT);
engine.setTransition(_secondaryScreen, null, UiEngineInstance.TRIGGER_POP, transition);
MainScreen baseScreen = new MainScreen();
baseScreen.setTitle("Screen Transition Sample");
ButtonField buttonField = new ButtonField("View Transition", ButtonField.CONSUME_CLICK) ;
buttonField.setChangeListener(this);
baseScreen.add(buttonField);
pushScreen(baseScreen);
}
}
popRunnable = new Runnable() {
public void run() {
popScreen(_secondaryScreen);
}
};
public void fieldChanged(Field field, int context) {
pushScreen(_secondaryScreen);
invokeLater(_popRunnable, 2000, false);
}For more examples you can check out the official documentation on http://docs.blackberry.com/en/developers/subcategories/?userType=21&category=Development+Guides
