I have a simple blackberry app that changes the LED settings (color, blinking, pattern).
My current testing environment consists of a live Blackberry Bold (9000), and I have been running into an problem which I am not sure how to proceed.
Assume that my current Blackberry setup (LED wise) is to not flash unless there is a missed call, new message (of all varieties). The program I wrote will change the LED, which is fine, but the problem lies in closing the program. Closing the program causes a save/discard/cancel dialog to appear. For now, that isn't a problem since I'm only testing the application, the current problem is that even if you Discard the changes made, the light will continue flashing. I demoed the program to a friend and it kept flashing, I also noticed that when I received a new message and the light changes to red and kept flashing (instead of being Green, the last color i showed in the demo).
How do I reset the LED to it's previous state when exiting the program? Should or can I copy the existing settings (like flashing or not flashing when network is available) then on exit reset to saved defaults? Or is there a better way of resetting LED?
Code is pretty simple; view:
public HomeScreen(boolean error) {
redLED = new CustomButtonField("RED", Color.RED, Color.BLACK, Color.BLACK,
Color.WHITE, Field.FOCUSABLE);
add(redLED);
blueLED = new CustomButtonField("BLUE", Color.RED, Color.BLACK, Color.BLACK,
Color.WHITE, Field.FOCUSABLE);
add(blueLED);
whiteLED = new CustomButtonField("WHITE", Color.RED, Color.BLACK, Color.BLACK,
Color.WHITE, Field.FOCUSABLE);
add(whiteLED);
greenLED = new CustomButtonField("GREEN", Color.RED, Color.BLACK, Color.BLACK,
Color.WHITE, Field.FOCUSABLE);
add(greenLED);
redLED.setChangeListener(this);
blueLED.setChangeListener(this);
whiteLED.setChangeListener(this);
greenLED.setChangeListener(this);
}
public HomeScreen(long arg0)
{
super(arg0);
// TODO Auto-generated constructor stub
}
public void fieldChanged(Field field, int context)
{
LED.setState(LED.LED_TYPE_STATUS, LED.STATE_BLINKING);
if(field == redLED) {
LED.setColorConfiguration(500,5000,Color.RED);
}
if(field == blueLED) {
LED.setColorConfiguration(500,5000,Color.BLUE);
}
if(field == whiteLED) {
LED.setColorConfiguration(500,5000,Color.WHITE);
}
if(field == greenLED) {
LED.setColorConfiguration(500,5000,Color.GREEN);
}
}
To get rid of the save/discard/cancel dialog when you exit the screen, you need to override the onSavePrompt() method on the Screen. You can also put some code in here that you'd like to execute when the user is leaving the screen. For example, you might want to try:
protected boolean onSavePrompt() {
LED.setState(LED.STATE_OFF);
return true;
}
Related
I'm currently developing a mobile application with JavaFX, using GluonHQ and JavaFXPorts. One of my screens contains a listview as you can see from the screenshot below, which was taken from my iPhone 6.
I have noticed the following problems with the scrollbar in mobile devices:
The first time i touch the screen the scroll bar appears a bit off place and then moves to the correct right position. This just happens quickly only the first time. (Screenshot)
I noticed that the scrollbar appears every time i touch the screen and not only when I touch and drag. On native iOS applications the scrollbar appears only when you touch and drag. If you keep your finger on screen and then remove it the scrollbar does not appear.
The scrollbar always takes some time to disappear when I remove my finger from the screen, whilst in native apps it disappears instantly.
Can anyone help me on fixing these issues. How can you define the time the scrollbar appears before it hides again?
You can experience this situation by just creating a ListView and load it with some items.
UPDATE
Thanks to the answer of Jose Pereda below, I have managed to overcome all three problems described above. Here is the code I used to reach the desired results. Watch this short video to get a quick idea of how the new scrolling bar appears and behaves. Again, Jose, you are the boss! Please go ahead with any comments for improvement.
public class ScrollBarView {
public static void changeView(ListView<?> listView) {
listView.skinProperty().addListener(new ChangeListener<Object>() {
private StackPane thumb;
private ScrollBar scrollBar;
boolean touchReleased = true, inertia = false;
#Override
public void changed(ObservableValue<? extends Object> observable, Object oldValue, Object newValue) {
scrollBar = (ScrollBar) listView.lookup(".scroll-bar");
// "hide" thumb as soon as the scroll ends
listView.setOnScrollFinished(e -> {
if (thumb != null) {
touchReleased = true;
playAnimation();
} // if
});
// Fix for 1. When user touches first time, the bar is set invisible so that user cannot see it is
// placed in the wrong position.
listView.setOnTouchPressed(e -> {
if (thumb == null) {
thumb = (StackPane) scrollBar.lookup(".thumb");
thumb.setOpacity(0);
initHideBarAnimation();
} // if
});
// Try to play animation whenever an inertia scroll takes place
listView.addEventFilter(ScrollEvent.SCROLL, e -> {
inertia = e.isInertia();
playAnimation();
});
// As soon as the scrolling starts the thumb become visible.
listView.setOnScrollStarted(e -> {
sbTouchTimeline.stop();
thumb.setOpacity(1);
touchReleased = false;
});
} // changed
private Timeline sbTouchTimeline;
private KeyFrame sbTouchKF1, sbTouchKF2;
// Initialize the animation that hides the thumb when no scrolling takes place.
private void initHideBarAnimation() {
if (sbTouchTimeline == null) {
sbTouchTimeline = new Timeline();
sbTouchKF1 = new KeyFrame(Duration.millis(50), new KeyValue(thumb.opacityProperty(), 1));
sbTouchKF2 = new KeyFrame(Duration.millis(200), (e) -> inertia = false, new KeyValue(thumb.opacityProperty(), 0));
sbTouchTimeline.getKeyFrames().addAll(sbTouchKF1, sbTouchKF2);
} // if
} // initHideBarAnimation
// Play animation whenever touch is released, and when an inertia scroll is running but thumb reached its bounds.
private void playAnimation() {
if(touchReleased)
if(!inertia || (scrollBar.getValue() != 0.0 && scrollBar.getValue() != 1))
sbTouchTimeline.playFromStart();
} // playAnimation()
});
} // changeView
} // ScrollBarView
As mentioned in the comments, the first issue is known, and for now it hasn't been fixed. The problem seems to be related to the initial width of the scrollbar (20 pixels as in desktop), and then is set to 8 pixels (as in touch enabled devices), and moved to its final position with this visible shift of 12 pixels to the right.
As for the second and third issues, if you don't want to patch and build the JDK yourself, it is possible to override the default behavior, as the ScrollBar control is part of the VirtualFlow control of a ListView, and both can be found on runtime via lookups.
Once you have the control, you can play with its visibility according to your needs. The only problem with this property is that it is already bound and constantly called from the layoutChildren method.
This is quite a hacky solution, but it works for both 2) and 3):
public class BasicView extends View {
private final ListView<String> listView;
private ScrollBar scrollbar;
private StackPane thumb;
public BasicView(String name) {
super(name);
listView = new ListView<>();
// add your items
final InvalidationListener skinListener = new InvalidationListener() {
#Override
public void invalidated(Observable observable) {
if (listView.getSkin() != null) {
listView.skinProperty().removeListener(this);
scrollbar = (ScrollBar) listView.lookup(".scroll-bar");
listView.setOnScrollFinished(e -> {
if (thumb != null) {
// "hide" thumb as soon as scroll/drag ends
thumb.setStyle("-fx-background-color: transparent;");
}
});
listView.setOnScrollStarted(e -> {
if (thumb == null) {
thumb = (StackPane) scrollbar.lookup(".thumb");
}
if (thumb != null) {
// "show" thumb again only when scroll/drag starts
thumb.setStyle("-fx-background-color: #898989;");
}
});
}
}
};
listView.skinProperty().addListener(skinListener);
setCenter(listView);
}
}
I have added a popup window to my main UI as follows:
Window component = new Window();
UI.getCurrent().addWindow(component);
Now, I want my popup to be centered horizontally and e.g. 40 pixels from the top of the screen. As far as I can see Vaadin has 4 methods for positioning my window.
component.center()
component.setPosition(x, y)
component.setPositionX(x)
component.setPositionY(y)
None of these are really what I want. I was hoping at first that setPositionY might help me. This does allow me to get the right distance from the top, but the x-position is now set to 0, where I wanted it to be centered.
The setPosition might have helped if I was able to calculate what the x-position should be, but this would require me to know the width of the component in pixels, but component.getWidth just tells me 100%.
Next I tried to use CSS styling on the component, writing and explicit css rule and adding it to the component with addStyleName. It seems though that Vaadin overrides whatever I wrote in my css with its own defaults...
Any ideas how to get my Window component positioned correctly?
I used the methods getBrowserWindowWidth() and getBrowserWindowHeight() from the com.vaadin.server.Page class for this.
I centered my "log" window horizontally in the lower part of the browser window with
myWindow.setHeight("30%");
myWindow.setWidth("96%");
myWindow.setPosition(
(int) (Page.getCurrent().getBrowserWindowWidth() * 0.02),
(int) (Page.getCurrent().getBrowserWindowHeight() * 0.65)
);
Solution 1: Use SizeReporter
Indeed, setPositionY() will reset the window's centered property to false. As the width of your pop-up and that of your browser window are not know before they appear on the screen, the only way I know to get those values is to use the SizeReporter add-on. Its use is quite straightforward:
public class MyUI extends UI {
private Window popUp;
private SizeReporter popUpSizeReporter;
private SizeReporter windowSizeReporter;
#Override
protected void init(VaadinRequest request) {
Button button = new Button("Content button");
VerticalLayout layout = new VerticalLayout(button);
layout.setMargin(true);
popUp = new Window("Pop-up", layout);
popUp.setPositionY(40);
addWindow(popUp);
popUpSizeReporter = new SizeReporter(popUp);
popUpSizeReporter.addResizeListenerOnce(this::centerPopUp);
windowSizeReporter = new SizeReporter(this);
windowSizeReporter.addResizeListenerOnce(this::centerPopUp);
}
private void centerPopUp(ComponentResizeEvent event) {
int popUpWidth = popUpSizeReporter.getWidth();
int windowWidth = windowSizeReporter.getWidth();
if (popUpWidth == -1 || windowWidth == -1) {
return;
}
popUp.setPositionX((windowWidth - popUpWidth) / 2);
}
}
This piece of code will be okay as long as you don't resize the pop-up. If you do, it will not be automatically recentered. If you replace addResizeListenerOnce() by addResizeListener() then it will automatically recenter the pop-up but you'll get some "UI glitches" as the add-on sends resize events almost continually while you're resizing your pop-up...
You could try to do it using CSS, but I personally avoid CSS as much as I can with Vaadin :).
You'll need to recompile the widgetset after you've added the add-on as a dependency.
Solution 2: Use com.vaadin.ui.JavaScript
I won't vouch for the portability of this solution but I guess it will work on most modern browsers.
public class MyUI extends UI {
private Window popUp;
#Override
protected void init(VaadinRequest request) {
Button button = new Button("Content button");
VerticalLayout layout = new VerticalLayout(button);
layout.setMargin(true);
popUp = new Window("Pop-up", layout);
popUp.setPositionY(40);
popUp.addStyleName("window-center");
addWindow(popUp);
// Add a JS function that can be called from the client.
JavaScript.getCurrent().addFunction("centerWindow", args -> {
popUp.setPositionX((int) ((args.getNumber(1) - args.getNumber(0)) / 2));
});
// Execute the function now. In real code you might want to execute the function just after the window is displayed, probably in your enter() method.
JavaScript.getCurrent().execute("centerWindow(document.getElementsByClassName('window-center')[0].offsetWidth, window.innerWidth)");
}
}
I have a custom ImageButton in which I have placed a png and the hover Image which is transparent from some parts. So when It gets focused it also takes it self with a blue focus. I want to remove that focus blue color but at the same time I want my hoverImage to work!
This is my ImageButton Class: http://codepad.org/mjtIUKLR
A solution that works for me is to add this functionality to the paint method and track whether focus has been gained:
boolean hasFocus = false;
public void onFocus(int direction) {
invalidate();
hasFocus = true;
}
public void onUnfocus() {
hasFocus = false;
invalidate();
super.onUnfocus();
}
And then use this in your paint method:
public void paint(Graphics graphics) {
if (hasFocus){
graphics.drawShadedFilledPath(xPositions, yPositions, null,
HIGHLIGHTED_GRADIENT, null);
}else{
graphics.drawShadedFilledPath(xPositions, yPositions, null,
GRADIENT, null);
}
super.paint(graphics);
}
In my example above, I am using a custom gradient for highlighting that overrides the default blue colour. In your case you will obviously want to change your image or something.
I'm beginner in BB dev. I create a CustomListField and when I click on a row, the background color of this row must change and a new screen must be displayed (it's done!).
Could any one please help me to get this done?
thx
Below is the code:
protected boolean navigationClick(int status, int time)
{Field field = this.getLeafFieldWithFocus();
if(field instanceof ListField)
{
// listValues is String[] where you store your list elements.
// listField is the ListField instance you are using
UiApplication.getUiApplication().pushScreen(new ReadMsgScreen());
int index= getIndex();
if(index== this.getSelectedIndex())
{
**// I think the code to change the row's background color must be set here!**
}
return true;
}
return super.navigationClick(status, time);
}
use this it will definately work...
int tmpcolor = graphics.getColor();
graphics.setColor(Color.CYAN);
graphics.fillRect(0, y, width, getRowHeight());
graphics.setColor(tmpcolor);
thanks...
onerride the paint() method in blackberry as showed the code below..
_specialNumbers = new LabelField(Constants.SPECIAL_NUMBERS,LabelField.USE_ALL_WIDTH) {
protected void paintBackground(Graphics arg0) {
int color = arg0.getBackgroundColor();
arg0.setBackgroundColor(Color.LIGHTGREY);
arg0.clear();
arg0.setBackgroundColor(color);
}
};
In the drawListRow() method of the ListFieldCallback for your CustomListField draw that selected line differently and call a Transition to display the other Screen slowly.
I have a screen with a background image being rendered like so:
bg = new VerticalFieldManager(
VerticalFieldManager.USE_ALL_WIDTH |
VerticalFieldManager.USE_ALL_HEIGHT |
VerticalFieldManager.NO_HORIZONTAL_SCROLLBAR |
VerticalFieldManager.NO_VERTICAL_SCROLLBAR |
VerticalFieldManager.NO_HORIZONTAL_SCROLL |
VerticalFieldManager.NO_VERTICAL_SCROLL) {
//Override the paint method to draw the background image.
public void paint(Graphics graphics) {
//Draw the background image and then call paint.
graphics.drawBitmap(Graphics.getScreenWidth()/2 - bgBitmap.getWidth()/2,
Graphics.getScreenHeight()/2 - bgBitmap.getHeight()/2,
bgBitmap.getWidth(), bgBitmap.getHeight(), bgBitmap, 0, 0);
super.paint(graphics);
}
};
add(bg);
Then I'm adding any fields for the screen to this manager. I have a ListField that I'd like to see the background through. When the screen is first rendered, all is well. I can see the image. As soon as I scroll down, select something and unselect it, the background disappears (turns white).
Do I need to do something special when drawing my list rows in order to make them truly transparent after the selection color is gone?
NOTE: I've found that this happens no matter what field is drawn on top of the background. It displays correctly until the selection color is drawn for a given focusable field and then you select something else. All the area that was filled with the selection color turns to the default white after unselecting it.
use invalidate() function within onfocus() and onunfocus() method.
For example if you use LabelField then use:
LabelField l=new LabelField("Hello",FOCUSABLE)
{
protected void onFocus(int direction)
{
invalidate();
super.onFocus(direction);
}
protected void onUnfocus()
{
invalidate();
super.onUnfocus();
}
};
I ended up overriding moveFocus() in my custom ListField.
public int moveFocus(int amount, int status, int time) {
invalidate(getSelectedIndex());
return super.moveFocus(amount, status, time);
}
Vivek's method works well for single fields outside of a ListField row though.