B4J Library B4j TreePane & TreeNode Class

The Treeview of the B4j is nice but lacks some style possibilities.
I took my B4A Treeview & Treenode class and adapted them for B4j to get these additions:
1. Text of the node can be in colors
2. Indent of the nodes is controlable
3. you can change the symbol for node opening and closing (not just a triangle).
4. Y position can be controlled, not only by the picture size
5. I couldn't implement the scroll by bars so I made it by dragging the mouse - more convenient.
6. In B4j Treeview you add a map if you need to put some data into a tag. Here there is a flexible Type which can hold all kinds of data items to pass to and from a node.

The class has two modules, TreePane and TreeNode, but the interface with the calling module is with TreePane only.
The Class is independent from the data items of the specific application, everything is defind in the calling module "GetData" and "NodeClicked" subs.
An example to the Data Type flexibility: In my Family tree application I pass the ID number and it is used to get the picture from a directory of pictures with the names of the files as Id & ".jpg"
In the attached example I changed it and pass the image itself in the Type.

The attached example has the two ways of treeview - the formal and the new class, with very simplified way of getting the data.

Edit: See post #8 for additional method, tree.OpenAllNodes.

 

[magoandroid]

Hi Derez,
thanks for your sharing.
I will try to use it.

MAgo

 

[derez]

Replacing the label in TreeNode with WebView I managed to create nodes with two colors text.
I don't know how to get rid of the scroll bars in the right of the webview, I'll appreciate if anyone knows and tell me.

 

[Erel]

Try the answer here: http://stackoverflow.com/questions/15498287/remove-the-scrollbar-in-the-webview-javafx

 

[derez]

I tried to put style = "-fx-overflow-x: hidden;-fx-overflow-y: hidden;" but it is still there.
I tried to add "overflow-y: hidden;" to the html string but no.
Maybe there is a place to put it which I have not tried yet:

text1 = "<html><body style=background-color:#bbbbbb;><font color='red' size='" & 5 & "'>" & txt & "</font><br /></p></body></html> "

Maybe the problem is elsewhere: I added .prefheight because if I don't the webview takes the whole form height. Still altough I put the height like the other elements in the node, the height of the webview is about one and a half of the supplied height, and it can scroll a little.
If the height would be exact maybe there will be no scrollbar, but how to do it ?
If I decrease the height the text is cut !.

Of course I can extend the width to fall over the right side of the screen but that doesn't count as a SW solution...

 

[Erel]

You will need to use JavaObject to set the css file.

Something like:

Dim jWeb As JavaObject = WebView1
Dim jEngine As JavaObject = jWeb.RunMethod("getEngine", null)
jEngine.RunMethod("setUserStyleSheetLocation", Array As Object(File.GetUri(File.DirAssets, "style.css")))

 

[derez]

I'm doing something wrong but I don't know what:
I put the code above with the name of the webview of the node instead of WebView1.
I made a file "style.css" once with ""-fx-overflow-y: hidden;" and once with "overflow-y: hidden;".
Commented the original "= style" but the scrollbar is still there.

Anyway - I covered it with another label and it does not show anymore.

 

[derez]

Following a request to enable the opening of all the nodes by code I aded some code to the tree & node classes of B4A, so I made an addition here as well to enable it in b4j.
You have to add the following 2 subs to TreePane class:

public Sub OpenAllNodes
For Each v As Node In rootnode.anc.GetAllViewsRecursive
        If v.Id = "btn" Then
            Dim iv As ImageView = v
            iv.tag = False
            iv.SetImage(minus)
        End If
    Next
     Node_open(rootnode)
    OpenAll(rootnode)
End Sub

Private Sub OpenAll(tnn As TreeNode)
    For Each tnn As TreeNode In tnn.TN.children
         If tnn.TN.tag1 Then
            For Each v As Node In tnn.anc.GetAllViewsRecursive
                If v.Id = "btn" Then
                    Dim iv As ImageView = v
                    iv.tag = False
                    iv.SetImage(minus)
                  
                End If
            Next
             Node_open(tnn)
        End If
        OpenAll(tnn)
    Next
End Sub

Also add

Private minus As Image

to globals and

minus.Initialize(File.DirAssets,"minus.png")

to initialize.
In TreeNode change anc definition in globals to public.

This method should be used after setroot method and when the rootnode is the only one on the tree.

 

[derez]

Improved method - enables you to define the depth of tree opening:

public Sub OpenAllNodes(depth As Int)
For Each v As Node In rootnode.anc.GetAllViewsRecursive
        If v.Id = "btn" Then
            Dim iv As ImageView = v
            iv.tag = False
            iv.SetImage(minus)
        End If
    Next
     Node_open(rootnode)
    OpenAll(rootnode,depth)
End Sub

Private Sub OpenAll(tnn As TreeNode, depth As Int)
    If tnn.TN.level > depth Then Return
    For Each tnn As TreeNode In tnn.TN.children
         If tnn.TN.tag1 Then
            For Each v As Node In tnn.anc.GetAllViewsRecursive
                If v.Id = "btn" Then
                    Dim iv As ImageView = v
                    iv.tag = False
                    iv.SetImage(minus)
                End If
            Next
             Node_open(tnn)
        End If
        OpenAll(tnn,depth)
    Next
End Sub