B4J Question B4J 3.50 Visual Designer Questions

Discussion in 'B4J Questions' started by rwblinn, Jul 25, 2015.

  1. rwblinn

    rwblinn Well-Known Member Licensed User


    many thanks for the new B4J Visual Designer.
    Collated some first How To Questions while testing:

    • How to add an Icon to a Button?
    • How to fully size a view in a view, like by setting left, top, width, height to -1?
    • When defining a button with height 30 and top 10 in a pane with height 50 the bottom of the button is at the bottom of the pane. It should be a 40.
    • How to generate the menuitems for a menubar. The items are shown the WYSIWYG but not in tools generate members?
    • How to define a contextmenu for a Button. Tried [{"ctxAbout1":"ctxAbout1"}] but in generate members this entry is not listed?
    • How to change the style of Tooltips for views? Tried via Main Properties, Extra css
      .tooltip {-fx-background-radius: 2 2 2 2;-fx-background-color: linear-gradient(#FFFFFF, #DEDEDE);-fx-text-fill: black; -fx-font-size: 16px;} but recieved an error while executing the app (expected RBRACE).

    • Additional Questions
    • Are additional views planned, like Borderpane, Toolbar, DatePicker, SplitPane?
    • Is an import function or conversion utility planned for fxml layout files?

    Erel likes this.
  2. Erel

    Erel Administrator Staff Member Licensed User

    1) Change ColorDrawable to BitmapDrawable:

    Don't forget to add images to the Files tab (in the designer).

    2) With anchors. Set the vertical and horizontal anchors to BOTH (see the small white circles):

    3) JavaFX sets the minimum height based on the font size. Decrease the font size and it will appear as expected.

    4, 5) I will soon write a tutorial about menu items.

    6) You cannot add classes in Extra CSS.
    Instead create a new css file with this css and put it in the files tab.
    Now call:
    MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "1.css")) 'File name is 1.css

    7) Yes. Some of these types are only supported by Java 8. Currently B4J minimum version is Java 7.
    8) Currently no. You can however combine FXML layouts with bjl layouts.
    rwblinn and ellpopeb4a like this.
  3. Erel

    Erel Administrator Staff Member Licensed User

  4. ivan.tellez

    ivan.tellez Active Member Licensed User

    @Erel, For the caption, you can use the text alignment to "Bottom-Center", but for the icon, the gravity should be "Top-Center", but there is only the "Top-Left" option. So, if you want a caption, the icon is not centered in the button.

    How to add an Icon with gravity "Top-Center" to a Button?

    EDIT: Solved with the Extra CSS, just added:

    -fx-background-position: top center
    Could you please add the option to the designer?

    Also, it is possible to add the Stylesheets.Add to forms and containers and StyleClasses.Add to controls?


    Attached Files:

    Last edited: Aug 26, 2015
  5. ivan.tellez

    ivan.tellez Active Member Licensed User


    Its is possible to add an Icon from the Files folder to a button created in code?

    This works with files outside the compiled jar:

    Dim tButton As Button
      tButton.Style = 
    "-fx-background-position: center top;  -fx-background-repeat: no-repeat;  -fx-background-image: url('file:///z:/save.png');"
      tButton.Alignment = 
    But, how to use images added to the files tab?

  6. Erel

    Erel Administrator Staff Member Licensed User

    Please start a new thread for this question (and don't limit it to @Erel).