B4J Question how to customize colors of a custom dialog via CSS ?

[omarruben]

the colors are way to dark for my situation, and the buttons are kind of lost

 

[zed]

Try this

.Dialog{
    -fx-background-color: #f9d900;
}
.Dialog > *.button-bar > *.container{
    -fx-background-color: #a9e200;
}
.Dialog > *.label.content{
    -fx-font-size: 14px;
    -fx-font-weight: bold;
}
.Dialog:header *.header-panel{
    -fx-background-color: #a59c31;
}
.Dialog:header *.header-panel *.label{
    -fx-font-size: 18px;
    -fx-font-style: italic;
    -fx-fill: #292929;
}

 

[omarruben]

@zed thank you, but it did not work, for now this is working, but still not 100%

Dim p As B4XView = xui.CreatePanel("")
    p.SetLayoutAnimated(0, 0, 0, 300dip, 150dip)
    p.LoadLayout("dialogAskString")
    dialog.BlurBackground=True
    dialog.BackgroundColor = xui.Color_LightGray
    dialog.OverlayColor= xui.Color_DarkGray
    dialog.ButtonsColor=xui.Color_Gray
    dialog.Title = "Name"
    dialog.PutAtTop = True 'put the dialog at the top of the screen
    Wait For (dialog.ShowCustom(p, "OK", "", "CANCEL")) Complete (Result As Int)
    If Result = xui.DialogResponse_Positive Then
        DBService.InsertFolder(txtString.Text,0)
        ShowFolders
    End If

 

[zed]

The css works if it's a modal dialog box

.dialog-pane {
    -fx-background-color: #342940;
    -fx-font-family: Impact;
    -fx-font-size: 22px;
}

.dialog-pane .label {
    -fx-text-fill: #a18fb2;
}

.dialog-pane:header .header-panel {
 -fx-background-color: #000000;
}

.dialog-pane:header .header-panel .label {
 -fx-background-color: #ffffff;
}

Ex:

fx.Msgbox(mForm, "This is the message", "This is the title")

I thought it would work on CustomDialogs. I have no other solution. I tried other CSS, but it doesn't work.

 

[William Lancee]

@omarruben
Your method is fine.
To have lighter gray for buttons, change to xui.Color_RGB(180, 180, 180) or anything you want.
If you set it the same as background, you won't see the the button shape but they will still work
You can set the text color of buttons with dialog.ButtonsTextColor.

Give this a try

dialog.BackgroundColor = xui.Color_LightGray
dialog.ButtonsColor=xui.Color_LightGray
dialog.ButtonsTextColor = xui.Color_White

'and maybe bold the text
dialog2.ButtonsFont = xui.CreateDefaultBoldFont(18)

 

[Erel]

Don't use CSS with B4XDialog.

Examples here: https://www.b4x.com/android/forum/t...dialog-templates-theming-code.131243/#content