Changing the font colour of TreeNode in GXT 3

Question

How do I change the font colour of a TreeNode in GXT 3?

I've tried returning SafeHtml from the ValueProvider, but that just seems to call toString() on the SafeHtml object. I've also tried to get hold of the Element in ValueProvider.getValue() but it always returns null.

In GXT 2 we were using a ModelStringProvider and returning HTML, but I can't find anything similar that exists.

Here's some example code I've tried:

        tree=new Tree<NavigableModel<Integer>, String>(treeStore, new ValueProvider<NavigableModel<Integer>, String>() {
            public String getValue(NavigableModel<Integer> _model) {
                TreeNode<NavigableModel<Integer>> treeNode=tree.findNode(_model);
                StringBuilder sb=new StringBuilder();
                if (!_model.getActive()) {
                    // All elements return null
                    XElement elem=tree.getView().getElement(treeNode);
                    if(elem!=null) {
                        elem.getStyle().setColor("red");
                    }
//                  treeNode.getElement().getStyle().setColor("red");
//                  treeNode.getTextElement().getStyle().setColor("red");
//                  sb.appendHtmlConstant("<span class=\"item-deleted\">");
                }

                sb.append(_model.get("name"));
                if (idsCheckBox.getValue()) {
                    sb.append(" ("+_model.get("id")+")");
                }

//              if (!_model.getActive()) {
//                  sb.appendHtmlConstant("</span>");
//              }

                return(sb.toString());
            }
            public String getPath() {
                return("name");
            }
            public void setValue(NavigableModel<Integer> object, String value) {
            }
        });

score 0 · Answer 1 · answered Mar 31 '15 at 13:53

Figured it out!

I needed to use SafeHtml for the ValueProvider and set the Tree cell to a SafeHtmlCell e.g.

tree=new Tree<NavigableModel<Integer>, SafeHtml>(treeStore, new ValueProvider<NavigableModel<Integer>, SafeHtml>() {
  public SafeHtml getValue(NavigableModel<Integer> _model) {
    SafeHtmlBuilder sb=new SafeHtmlBuilder();
    if(_model==null) return sb.toSafeHtml();

    if (!_model.getActive()) {
      // My class to make the text red if this model isn't active
      sb.appendHtmlConstant("<span class=\"item-deleted\">");
    }

    sb.appendEscaped((String)_model.get("name"));

    if (!_model.getActive()) {
      sb.appendHtmlConstant("</span>");
    }
    return(sb.toSafeHtml());
  }
  public void setValue(NavigableModel<Integer> object, SafeHtml value) {
  }
  public String getPath() {
    return("name");
  }
});

// Set the cell to SafeHtmlCell to use the SafeHtml returned by ValueProvider
tree.setCell(new SafeHtmlCell());

Hopefully this will help someone else.

Changing the font colour of TreeNode in GXT 3

1 Answers1