B4J Question Transparent button that changes color when clicked.

[Gary Miyakawa]

I'm not familiar with Java and I'm trying to build a button that is transparent until clicked. I've done this with B4A/Designer with no issue. Trying to use the JavaFX Scene builder and I've found the transparency property but when I build my B4J code, I don't see any way to "change" the Alpha property so that when it's clicked, it's visible..

Thoughts ?

Gary Miyakawa

 

[Erel]

I'm not familiar with Java

You don't need to...

Create a css file named 1.css:

.TransparentButton {
  -fx-background-color: transparent;
}
.TransparentButton:pressed {
  -fx-background-color: blue;
}

The code:

Sub Process_Globals
   Private fx As JFX
   Private MainForm As Form
   Private button1 As Button
End Sub

Sub AppStart (Form1 As Form, Args() As String)
   MainForm = Form1
   button1.Initialize("button1")
   button1.StyleClasses.Add("TransparentButton")
   button1.Text = "abc"
   MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "1.css"))
   MainForm.RootPane.AddNode(button1, 10, 10, 300, 300)
   MainForm.Show
End Sub

Sub Button1_Action
   Log("clicked")
End Sub

 

[Gary Miyakawa]

Thank you so much! I'll make it work from here (hopefully!)..

Gary M

 

[Gary Miyakawa]

Works great but now I'm trying to round the corners (basically, make a round button)... I've added the following code but it's not makeing any change on the corners....

.TransparentButton {
    -fx-moz-border-radius: 60 ;
    -fx-webkit-border-radius: 60 ;
    -fx-border-radius: 60px ;
    -fx-background-color: pink;
}
.TransparentButton:pressed {
    -fx-background-color: blue;
    -fx-border-radius: 60px;
}

Any .css experts out there that can tell me what I'm missing (sorry for extending this post)..

**UPDATE**

Figured out that you have to radius the background.
-fx-background-radius: 60;
That makes it work. Enjoy !


Gary M