B4J Question CSSUtils and .css

tdocs2

Well-Known Member
Licensed User
Longtime User
Greetings.

Please refer to CSSUtils thread by Erel.

I modified Erel's example using CSSUtils and also used a css file to obtain the results shown below. The code and the actual css file are also included. With the css file, I am able to set the background color and text color of a listview (without the use of a pane).

QUESTION
How can I accomplish what the css file does using Erel's CSSUtils?

Thank you in advance for your replies.

Sandy

upload_2016-1-1_17-7-40.png


B4X:
Sub Process_Globals
    Private fx As JFX
    Private MainForm As Form
    Private Pane1 As Pane
    Private ListView1 As ListView
End Sub

Sub AppStart (Form1 As Form, Args() As String)
    MainForm = Form1
    MainForm.SetFormStyle("UNIFIED")
    MainForm.RootPane.LoadLayout("1") 'Load the layout file.
    MainForm.Show
    '@@@@@
    MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "LV.css"))
    '@@@@@
    CSSUtils.SetStyleProperty (Pane1, "-fx-background-color", "springgreen")
    CSSUtils.SetStyleProperty (Pane1, "-fx-border-color", "red")
    CSSUtils.SetStyleProperty (Pane1, "-fx-border-width", "10")
    For i=1 To 20
        ListView1.Items.Add("Item # "&i)
    Next

End Sub

css file:
B4X:
.list-cell { -fx-background-color: black; /* 1 */ }
.list-cell { -fx-background-color: black; /* For information */ }
.list-cell { -fx-text-fill: white; /* 5 */ }
.list-cell:filled:hover {
    -fx-background-color: cadetblue; /* 2 */
    -fx-text-fill: white; /* 5 */
}
 

LucaMs

Expert
Licensed User
Longtime User
I think you can't, if Erel does not change that class.

Could you create a CSS file at run-time?
B4X:
 CreateListviewCSS("black", "white", "cadetblue", "white", File.DirApp, "LV.css")
MainForm.Stylesheets.Add(File.GetUri(File.DirApp, "LV.css"))



Sub CreateListviewCSS(ItemBGColor As String, ItemTXTColor As String, ItemHoverBGColor As String, ItemHoverTXTColor As String, Dir As String, FileName As String)
     Dim lstCSS As List
     lstCSS.Initialize
     lstCSS.Add(".list-cell { -fx-background-color: " & ItemBGColor & "; /* 1 */ }")
     lstCSS.Add(".list-cell { -fx-background-color: " & ItemBGColor & "; /* For information */ }")
     lstCSS.Add(".list-cell { -fx-text-fill: " & ItemTXTColor & "; /* 5 */ }")
     lstCSS.Add(".list-cell:filled:hover {")
     lstCSS.Add("    -fx-background-color: " & ItemHoverBGColor & "; /* 2 */")
     lstCSS.Add("    -fx-text-fill: " & ItemHoverTXTColor & "; /* 5 */")
     lstCSS.Add("}")
     File.WriteList(Dir, FileName, lstCSS)
End Sub
 
Upvote 0

tdocs2

Well-Known Member
Licensed User
Longtime User
Grazie, Luca.

I would like the Listview scrollbar to behave more like the one in Android. Would you know how to accomplish that?
(Something like ScrollViewer.VerticalScrollBarVisibility="Hidden" in WPF)


BTW, I will look back into @stevel05 Cell Factory here

Felice anno nuovo.

Sandy
 
Upvote 0

LucaMs

Expert
Licensed User
Longtime User
I searched everywhere (!) and now I think you cannot hide-resize the scrollbar.
I found only a way to set the "bar position" (just for fun? :D):
B4X:
 Dim joListView1 As JavaObject
 joListView1 = ListView1
 joListView1.RunMethod("setOrientation", Array As Object("HORIZONTAL"))
 
Upvote 0

LucaMs

Expert
Licensed User
Longtime User
If you "load into the ListView" the third css file attached to that web page (#8), the scrollbar width will be smaller but I'm not able to set its width to zero (we need some guru of CSS).
B4X:
MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "3.txt"))
ListView1.Style = MainForm.Stylesheets.Get(0)

3.txt attached.
 

Attachments

  • 3.zip
    649 bytes · Views: 334
Last edited:
Upvote 0
Top