Customize the iOS VKB toolbar - codenameone

The native iOS VKB can have a toolbar, and this toolbar can have a blue "Done" text.
I would like to be able to translate the "Done" text into the local language of the app (the language bundle used by Codename One does not translate this text), also I would like to change the color of the "Done" text from blue to orange.
I don't know how to do these customizations with Codename One. Thank you for the directions.

The word "done" is used when localizing. Notice the lower case d. So adding "done" = "Localized String" to the resource bundle should work.

Related

Change Device Navigation Bar Color [CODENAME ONE]

How would one go about changing device navigation bar color in Codename one? I recently learned to change the color of the status bar, and I would like to do the same for the device's navigation bar.
This isn't an editable area, I'm sure there are ways to override that but it's probably not what you want. This is a part of the device control. The device determines the colors based on light/dark theme of application.
To make it work as dark you can use the build hint android.theme=Dark otherwise it should take the color based on device mode.
I found the solution by adding a color.xml file to the native android resources folder with the following line of code:
android/src/main/resources/colors.xml
<resources>
<color name="navigationBarColor">#ff000000</color>
</resources>
With this line of code, the navigation bar is rendered "black".
Refernces:
Change the color of the status bar in codenameone
Change navigation bar color

Keyboard always visible in codenameone

I would like to know if it's possible to have the native keyboard always visible. So I don't need to tap to have the text field in focus.
Thanks in advance.
That is the default behavior of Codename One at least on iOS & Android unless a fallback mode happened. This fallback mode happens when components can't be scrolled to e.g. if the text fields weren't in a box layout Y that's scrollable on a Y axis.

How to get Codename One Form feature vertical scroll?

My Codename One app features a Form with 3 SpanLabels containing text and one Container in LayeredLayout with an image and an overlay.
this.add(BorderLayout.NORTH, spanLab1);
this.add(BorderLayout.CENTER, imageCont);
this.add(BorderLayout.SOUTH, BoxLayout.encloseY(spanLab2, spanLabl3));
This yields to the following:
This is not satisfactory as the image (that appears in the center and should be CN1 icon) is not scaled but cut because it is not possible to scroll down.
I tried to force the Form to be scrollable (this.setScrollableY(true)) without success.
Did I make a mistake somewhere, for example should all my content be placed in the BorderLayout.CENTER since according to the documentation the NORTH position is dedicated for the title and the SOUTH one for an optional menu bar (I tried this without success)?
Or should I show a Dialog instead (that offers Y-Scroll out of the box) ? What is actually the proper way to show all my (long) content with no picture cut or text overlaping ?
EDIT December 22nd 2016
As #Tizbn wrote the Form's ContentPane has to be in Vertical BoxLayout. So the call to the parent constructor has to be written :
super(new BoxLayout(BoxLayout.Y_AXIS));
Thank you very much for any help!
Vertical Scroll is disable in BorderLayout . For that BoxLayout with Y-axis can be used and make setScrollableY(true) in the Boxlayout. Hope it will help .

Community Builder platform in Salesforce-Increase space between button and text

I have a very simple assignment but for some reason it is not working. I am using the Community Builder feature in Salesforce. All I want to do is increase the spacing between the text and button(the orange marking). See picture below. I have been clicking to the "Page Editor" icon to make changes to the layout. On the side, where it says "Rich Text," I have pressed enter probably a 1000 times to increase the space but the button is in the same position. Can anyone please help on how I can increase the space between button and text?
Thank you
For Winter '17, simply pressing enter to create a new line break appears to work as you expect.
For non Winter '17, you could try this:
Click on the Rich Content Editor (or Rich Text) Lighting Component in the Community Builder
Click Source
At the very top of the source, you'll see <p>, change this to <p style="padding-bottom: 10px;">
If you want something like this to happen more than once, you could also create a custom Lighting Component that allows you to pick how much padding you want.

Codename One: Command button on top-bar and bottom-bar

I have problem with Command with Codename One.
I want to make a UI like this: Command "Cancel" at top-left, Command "Account", "Images" at bottom bar
To do that, I added 4 command like this:
I added "empty" Command 217 to top-right, and next: Cancel, Account, Images (2 commands used icons)
It showed well on iPhone Simulator. But on Android simulator, it showed:
The "empty" command is showed, it made user confuse
But if I don't add "empty" command, the UI on iPhone will:
It doesn't like my design.
Everybody, can you help me any idea.
Thanks a lot!
You can use the SideMenuBar or the new Toolbar API which will be a part of the new update this week.

Resources