B4J Question B4J 3.50 Visual Designer Questions

rwblinn

Well-Known Member
Licensed User
Longtime User
Hi,

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

B4X founder
Staff member
Licensed User
Longtime User
1) Change ColorDrawable to BitmapDrawable:
SS-2015-07-26_09.27.22.png


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):
SS-2015-07-26_09.28.39.png


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:
B4X:
MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "1.css")) 'File name is 1.css

SS-2015-07-26_09.43.31.png


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.
 
Upvote 0

ivan.tellez

Active Member
Licensed User
Longtime User
1) Change ColorDrawable to BitmapDrawable:
SS-2015-07-26_09.27.22.png


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

@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:

B4X:
-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?

Thanks
 

Attachments

  • sample.png
    sample.png
    7.8 KB · Views: 522
Last edited:
Upvote 0

ivan.tellez

Active Member
Licensed User
Longtime User
@Erel

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:

B4X:
  Dim tButton As Button
  tButton.Initialize("RibbonButton")
  tButton.Style = "-fx-background-position: center top;  -fx-background-repeat: no-repeat;  -fx-background-image: url('file:///z:/save.png');"
  tButton.Alignment = "BOTTOM_CENTER"
  tSection.AddNode(tButton, 0, 0, 70, 70)

But, how to use images added to the files tab?

Thanks
 
Upvote 0
Top