Unwanted swipe left on swipeable container when swiping another - codenameone

I have a number of swipeable containers added to a page. The swipeable containers have buttons left and right and the top component is a multibutton that takes the user to another page. When the user goes back to the page with the swipeable containers and swipes left (only left) on a different swipeable container then the first container also opens to the left. Images and sample code below:-
//Swipeable containers bugs
public void SwipeableContainerPage(Form mainForm){
Form formSC = new Form("Swipeable Container", new BorderLayout());
formSC.getToolbar().setBackCommand("", e -> mainForm.showBack());
Container northcnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
Container centercnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
Container southcnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
MultiButton mb_1 = new MultiButton("MB1");
Button b_l1 = new Button("LB1");
Button b_r1 = new Button("RB1");
MultiButton mb_2 = new MultiButton("MB2");
Button b_l2 = new Button("LB2");
Button b_r2 = new Button("RB2");
MultiButton mb_3 = new MultiButton("MB3");
Button b_l3 = new Button("LB3");
Button b_r3 = new Button("RB3");
SwipeableContainer sc_1 = new SwipeableContainer(b_l1, b_r1, mb_1);
SwipeableContainer sc_2 = new SwipeableContainer(b_l2, b_r2, mb_2);
SwipeableContainer sc_3 = new SwipeableContainer(b_l3, b_r3, mb_3);
mb_1.addActionListener(new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
GoToAndBackPage(formSC);
}
});
mb_2.addActionListener(new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
GoToAndBackPage(formSC);
}
});
mb_3.addActionListener(new ActionListener() {
#Override
public void actionPerformed(ActionEvent e) {
GoToAndBackPage(formSC);
}
});
centercnt.add(sc_1);
centercnt.add(sc_2);
centercnt.add(sc_3);
formSC.add(BorderLayout.NORTH, northcnt).add(BorderLayout.CENTER, centercnt).add(BorderLayout.SOUTH, southcnt);
formSC.show();
}
//page for SC to go to
public void GoToAndBackPage(Form mainForm){
Form formGoTo = new Form("Go To Page", new BorderLayout());
formGoTo.getToolbar().setBackCommand("", e -> mainForm.showBack());
Container northcnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
Container centercnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
Container southcnt = new Container(new BoxLayout(BoxLayout.Y_AXIS));
Label l_welcome = new Label("Welcome to the Go To Page");
centercnt.add(l_welcome);
formGoTo.add(BorderLayout.NORTH, northcnt).add(BorderLayout.CENTER, centercnt).add(BorderLayout.SOUTH, southcnt);
formGoTo.show();
}

This sounds like a bug and ideally you should file an issue with a test case. But try this for a workaround.
Wrap the code that handles the navigation to a different form in a call serially. E.g. if the code looks like:
myMultiButton.addActionListener(e -> showOtherForm(...));
Then do this:
myMultiButton.addActionListener(e -> callSerially(showOtherForm(...)));
My theory is that the press brings the swipable component to a state that "could" be dragging. But because the navigation event happens to soon the release event isn't received by the button (we're on a different form now) and everything is lost.
So when you get back to the form you now have two "charged" buttons. By using a callSerially you effectively flush the event queue and make sure the release event is processed by everyone on the current Form before moving to the next Form.

Related

How to add image in west and buttons in east side in container of codenameone

I would like to create a screen as shown in image.
I have tried the following code, it works fine in simulator but when on device it dont show images it just shows button.So, May I know whats the reason? or Am I doing anything wrong ?
public class PhotoExample extends com.codename1.ui.Form {
Container commandBar = null;
public PhotoAnnotatorScreen(String title) {
setTitle(title);
// give this form a border layout
setLayout(new BorderLayout());
getTitleArea().setPreferredH(0);
drawableArea = new AnnotatingArea(graffitiModel);
addComponent(BorderLayout.CENTER, drawableArea);
buildCommandBar();
getStyle().setBgColor(0x323232);
}
protected void buildCommandBar() {
Container c = new Container();
c.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
c.getStyle().setPadding(Component.TOP, 40);
Button palletteCommand = new Button();
Image im = Image.createImage("/sun.png");
palletteCommand.setIcon(im);
c.addComponent(palletteCommand);
Button cancelCommand = new Button();
Image im = Image.createImage("/Cancel-64-ltgrey.png");
cancelCommand.setIcon(im);
c.addComponent(cancelCommand);
Button okCommand = new Button();
Image im = Image.createImage("/Checked-64-ltgrey.png");
okCommand.setIcon(im);
c.addComponent(okCommand);
addComponent(BorderLayout.EAST, c);
commandBar = c;
}
}
In this case the drawableArea is nothing but the captured image or any image that need to be placed in container.
Please help me out on this. Thanks.

JAVAFX: Buttons with actions (open files)

I am fairly new to Javafx and I would like to be able to add "Actions" to my toolbar buttons for example "Tutorial" to open a PDF from the project root.
Im a bit stumped and I wonder, is there an easy to way add buttons with actions to this code?
#Override
public void start(Stage primaryStage) throws Exception {
Button btnNewGame = new Button("New Game");
Button btnConcede = new Button("Concede");
Button btnNetwork = new Button("Network");
Button btnTutorial = new Button("Tutorial");
ToolBar toolBar = new ToolBar();
toolBar.getItems().addAll( new Separator(), btnNewGame, btnConcede, btnNetwork, btnTutorial);
BorderPane pane = new BorderPane();
pane.setTop(toolBar);
pane.setCenter(createContent());
Scene scene = new Scene(pane, 640, 675);
primaryStage.setTitle("Dam spill - OBJ2000 Eksamen 2016");
primaryStage.setScene(scene);
primaryStage.show();
}
try this:
button.setOnAction(event -> {
System.out.println("button pressed");
} );

Fade animation not working properly when used with other animation

I combine the a component sliding component with other component fade animation. But the component appears for a second before it fades in. Here the form is in Layered layout. Since there are other components as well that overlap each other. All works fine but the ones i apply fade in have the same issue. I have attached the gif of how it looks below.
beforeSplash(Form f) :
f.setLayout(new LayeredLayout());
Container bottomContainer = new Container(new BoxLayout(BoxLayout.X_AXIS));
f.add(FlowLayout.encloseBottom(bottomContainer));
Container appleContainer = new Container(new FlowLayout(Component.CENTER, Component.BOTTOM));
appleLabel = new Label(apple);
appleLabel.setVisible(false);
appleContainer.add(appleLabel);
bottleLabel = new Label(bottle);
bottomContainer.add(appleContainer);
bottomContainer.add(bottleLabel);
bottleLabel.setVisible(false);
postSplash(Form f) :
bottleLabel.setVisible(true);
arrangeForSlide(bottleLabel);
bottleLabel.getParent().animateLayoutAndWait(2000);
appleLabel.setVisible(false);
appleLabel.setVisible(true);
appleLabel.getParent().animateLayoutFadeAndWait(2500, 0);
f.revalidate();
Slide animation:
private void arrangeForSlide(Label c) {
c.setX(-c.getWidth());
}
Update:
bottleLabel.setVisible(true);
arrangeForSlide(bottleLabel);
bottleLabel.getParent().animateLayoutAndWait(2000);
new Thread() {
public void run() {
Display.getInstance().callSerially(new Runnable() {
public void run() {
appleContainer.setVisible(true);
appleContainer.animateLayoutFadeAndWait(2000, 0);
}
});
}
}.start();
Now i need to add other components animation after above applecontainer animation finishes and so on. eg:
questionBg.setVisible(true);
questionBg.getParent().animateLayoutFadeAndWait(3000, 20);
Update 2:
I added only one component appleLabel and applied fade effect and the result is the same. so may be it is not EDT issue. I have tried it in barebone template too.
Container appleContainer = new Container(new FlowLayout(Component.CENTER, Component.BOTTOM));
appleLabel = new Label(apple);
appleContainer.add(appleLabel);
appleLabel.setVisible(false);
f.add(appleContainer);
f.show();
appleLabel.setVisible(true);
appleLabel.getParent().animateLayoutFadeAndWait(5000, 0);
It doesnt work so I have tried in callSerially but it gives same issue as well
Display.getInstance().callSerially(new Runnable() {
#Override
public void run() {
appleLabel.setVisible(true);
appleLabel.getParent().animateLayoutFadeAndWait(5000, 0);
}
Try setting the appleContainer to visible false too and see if this helps.

Codenameone - list component run slowly on real-phone

Im a newbie codenameone.
I have a "Customer List - FORM". It has a List(com.​codename1.​ui.​List) with setRenderer my model(Customer):
public class CustRow extends Container implements ListCellRenderer {
private Label lblfocus = new Label("");
private Label lblname = new Label("");
private Label lblphone = new Label("");
private GuLabel lblnotes = new GuLabel("");
public CustRow() {
this.setUIID("LISTITEM");
this.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
Container mcselect = new Container(new FlowLayout());
CheckBox chkselect = new CheckBox();
chkselect.setUIID("LABEL");
mcselect.addComponent(chkselect);
this.addComponent(mcselect);
Container leftcol = new Container(new BorderLayout());
leftcol.addComponent(BorderLayout.WEST, lblname);
leftcol.addComponent(BorderLayout.EAST, lblphone);
this.addComponent(leftcol);
lblname.setUIID("LABEL");
lblphone.setUIID("LABEL");
lblnotes.setUIID("LBLNOTES");
this.addComponent(lblnotes);
}
public Component getListCellRendererComponent(List list, Customer value, int index, boolean isSelected) {
lblname.setText(value.getName());
lblphone.setText(value.getPhone());
lblnotes.setText(value.getNotes());
return this;
}
public Component getListFocusComponent(List list) {
return lblfocus;
}
}
I have 2 problem following:
http://i.stack.imgur.com/kuOhD.jpg -
http://i.stack.imgur.com/e8GpP.jpg
1. When I ran app on myPhone (android 4.2), next to scroll to choose item, it Slowly.
2. When I make one checkbox on ListItem checked, All checkbox is checked.
Help me! Please.
List is difficult I suggest avoiding the renderer paradigm if you are a beginner to Codename One and just using the GenericListCellRenderer instead or better yet just using MultiList.
Both effectively solve the issue of working with checkboxes & perform well.
I would guess your model is causing some of the performance issues you are seeing.

HTML and webbrowser

I tried to use html page in my code for that i found way from kichensink application, i am using same code and same page.html file applicatin working on simulator but not working on devices. Ondevices i got a blank screen. Below is my code. Please help me on this.
void ShowForm()
{
Form f = new Form("testweb");
Container cnt = new Container(new BorderLayout());
cnt = createDemo();
f.setLayout(new BorderLayout());
f.addComponent(BorderLayout.CENTER, cnt);
f.show();
}
public Container createDemo() {
Container cnt = new Container(new BorderLayout());
final WebBrowser wb = new WebBrowser();
if(wb.getInternal() instanceof BrowserComponent) {
Button btn = new Button("Add");
final TextArea content = new TextArea();
Container north = new Container(new BorderLayout());
north.addComponent(BorderLayout.CENTER, content);
north.addComponent(BorderLayout.EAST, btn);
cnt.addComponent(BorderLayout.NORTH, north);
content.setHint("Add to web document");
btn.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent evt) {
((BrowserComponent)wb.getInternal()).execute("fnc('" + content.getText() + "');");
}
});
((BrowserComponent)wb.getInternal()).setBrowserNavigationCallback(new BrowserNavigationCallback() {
public boolean shouldNavigate(String url) {
if(url.startsWith("http://sayhello")) {
// warning!!! This is not on the EDT and this method MUST return immediately!
Display.getInstance().callSerially(new Runnable() {
public void run() {
((BrowserComponent)wb.getInternal()).execute("fnc('this was written by Java code!');");
}
});
return false;
}
return true;
}
});
}
cnt.addComponent(BorderLayout.CENTER, wb);
wb.setURL("jar:///page.html");
return cnt;
}
Hi,I did few changes setlayout for container and add to another cotainer with scrollable true for container and scrollable false for form but now it's giving me error on devices and error is: "web page not available" page.html not found. Whereas page.html is already placed in src with .res file and application on simulator working fine.
Regards,
Jeny
You can't make a border layout scrollable, including nested scrollables and scrolling native+Codename One widgets in sync is probably not a good idea.
Which device are you having a problem on? There was an issue with browser component on Android for some use cases, its fixed now.

Resources