codenameone

Form setSafeArea(true) Affects Status Bar


Setting form.setSafeArea enables components to fit at the bottom without being overlayed by Android navigation buttons.

But this seems to push Toolbar downwards affecting background color of the status bar.

This can even be reproduced on iPhoneX simulator.

The following code can be used to reproduce this.

    Form form = new Form("Hi World", BoxLayout.y());
    Button helloButton = new Button("Hello World");
    form.add(helloButton);
    helloButton.addActionListener(e -> hello());
    form.getToolbar().addMaterialCommandToSideMenu("Hello Command",
            FontImage.MATERIAL_CHECK, 4, e -> hello());

    Toolbar toolbar = form.getToolbar();
    toolbar.setUIID("toolbar");
    form.setSafeArea(true);

    form.show();

CSS code

toolbar { border: none; padding: 0mm; margin: 0mm; background: #6200EE; }

Screenshot when setSafeArea is set false

enter image description here

Screenshot when setSafeArea is set true

enter image description here


Solution

  • This is solved by changing

    form.setSafeArea(true)

    to

    form.getContentPane().setSafeArea(true)