### Create Transparent ListView

To create a transparent ListView, make use of an external stylesheet which is stored in the files folder and added to the B4J IDE Files Manager.
Example
/*
Stylesheet main.css
*/
.list-view {
-fx-font: bold 12pt "Comic Sans MS";
-fx-text-fill: black;
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view:focused {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-cell {
-fx-background-color: transparent;
-fx-padding: 10 10 10 10;
}
.list-cell:odd {
-fx-background-color: null;
}
.list-view *.scroll-bar:horizontal {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
}
.list-view *.scroll-bar:vertical {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
}
.list-view *.scroll-bar:horizontal *.thumb {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar:vertical *.thumb {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar:horizontal *.track {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar:vertical *.track {
-fx-background-color: transparent;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar *.increment-button {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar *.decrement-button {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0;
}
.list-view *.scroll-bar:horizontal *.increment-arrow {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
-fx-shape: null;
}
.list-view *.scroll-bar:vertical *.increment-arrow {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
-fx-shape: null;
}
.list-view *.scroll-bar:horizontal *.decrement-arrow {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
-fx-shape: null;
}
.list-view *.scroll-bar:vertical *.decrement-arrow {
-fx-background-color: null;
-fx-background-radius: 0;
-fx-background-insets: 0;
-fx-padding: 0 0 0 0;
-fx-shape: null;
}
B4J code snipped adding the stylesheet
' Ensure to add the file main.css, stored in files folder, to the B4J IDE Files Manager
MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "main.css"))
B4J Full Code Example
`Sub Process_Globals
Private fx As JFX
Private MainForm As Form
Private lv As ListView
End Sub`
`Sub AppStart (Form1 As Form, Args() As String)
MainForm = Form1
MainForm.Show
lv.Initialize("lv")
For i = 1 To 100
lv.Items.Add(i)
Next
lv.SelectedIndex = 0
MainForm.Stylesheets.Add(File.GetUri(File.DirAssets, "main.css"))
MainForm.RootPane.AddNode(lv, 0, 0, -1, -1)
End Sub`

Changed: , Category: ListView, File: T6C216M1579.htm, ID: 1579