Styling Vaadin Tree component

Flow
1

Hi all,

I have a problem with styling Tree component. How can I add CSS to get a border around single object in my Tree ?

Thanks a lot,
D

2

Hi Dominik,

you can use
https://vaadin.com/api/com/vaadin/ui/Tree.ItemStyleGenerator.html
 to define individual styles for your tree nodes.

For more information about ItemStyleGenerator take a look at this thread
https://vaadin.com/forum#!/thread/1243051
 .

Please consider using google or the forum search next time before creating your own forum thread.
click here
http://lmgtfy.com/?q=Styling+Vaadin+Tree+component

example:

JAVA

[code]
tree.setItemStyleGenerator(new ItemStyleGenerator() {

        @Override
        public String getStyle(Tree source, Object itemId) {
            if (itemId.equals("example")) {
                return "blue";
            }
            return "";
        }
    });

[/code]CSS

.v-tree-node-blue{
   color: blue;
}

best regards

Johannes

20912.png

3

Hi !
At first, thanks for your reply.

Now I’m able to set color etc but…unfortunately I can’t set :
border: 5px
on my tree Item,

why ?

Thanks !

4

Hey Dominik,

Is the style overriden or simply not present? Use your brower’s inspector/dev tools to see what styles are being applied.

5

Hi,

would it be possible to style the tree altougether to look something like
this
 ?

Cheers

6

That would probably be quite the task. Not sure I’d recommend it.