Блог

Есть ли способ изменить цвет узлов и сделать его курсивным и т.д.?

Я думаю, что этот поток поможет вам, даже несмотря на то, что этот пользователь, похоже, ищет немного больше, чем вы. Из ответов Эдвина:

Если вы переопределите populateTreeItem() метод, вы можете добавить AbstractBehaviour к элементу и переопределить onComponentTag метод. Оттуда вы можете сделать

 tag.put("class", "yourValue")
  

…

вам нужно добавить AbstractBehaviour к каждому элементу. onComponentTag() Метод будет запущен до рендеринга компонента, так что вы можете проверить состояние ваших userObject и добавить / удалить классы, используя tag.put() следующий подход 🙂

Кроме того, вы могли бы изучить onNodeLinkClicked() метод дерева, если хотите выполнять действия при нажатии на элемент. onNodeLinkClicked() Предоставляет вам доступ к AjaxRequestTarget , поэтому вы также можете выполнить произвольный код JavaScript, например:

 protected void onNodeLinkClicked(AjaxRequestTarget target, TreeNode node) {
    MyObject myObject = (MyObject)
      ((DefaultMutableTreeNode) node).getUserObject();
    if (myObject.getMyState())
        target.appendJavascript("targetTheComponentWithAJavascriptMethod("  
          getId()   ");");
}
  

Либо это, либо вы могли бы изменить состояние userObject в onNodeLinkClicked методе и добавить его в AjaxRequestTarget . Затем ваш AbstractBehaviour позаботится о визуализации нового состояния объекта для вас 🙂

Вы хотите расширить, TreeTable а затем переопределить getCss() , чтобы изменить шрифты и цвета текста или фона. Если вы хотите изменить цвета фактических значков узлов, которые вы хотите переопределить getNodeIcon() и добавить ресурсы для ваших собственных файлов PNG.

 public abstract class MyTreeTable extends TreeTable {
    private static ResourceReference CSS = new CompressedResourceReference(
        MyTreeTable.class, "TreeTable.css");
    private static ResourceReference documentIcon = new CompressedResourceReference(
        MyTreeTable.class, "Icon_Document.png");
    private static ResourceReference folderIcon = new CompressedResourceReference(
        MyTreeTable.class, "Icon_Folder.png");

    public MyTreeTable(String id, IColumn[] columns) {
        super(id, columns);
    }

    @Override
    protected ResourceReference getCSS() {
        return CSS;
    }

    @Override
    protected ResourceReference getNodeIcon(TreeNode node) {
        if (node.isLeaf() == true) {
            return documentIcon;
        } else {
            return folderIcon;
        }
    }
}
  

CSS для этого конкретного компонента очень привередлив, потому что они используют одно изображение и смещения изображений для всех линий, соединяющих дерево, поэтому я рекомендую скопировать весь их CSS-файл (вы можете получить его из исходных файлов), а затем настроить его. Или, если вы не хотите вносить обширные изменения, вы можете вообще не переопределять getCSS() и вместо этого добавить свой CSS-ресурс в конструктор.

Действительно, действительно очень неудачная часть заключается в том, что TreeTable вставляет невидимый div в верхней части каждой таблицы, поэтому :first-child псевдокласс не может быть использован для выбора вашего элемента, или, по крайней мере, я, кажется, не могу заставить его работать. Таким образом, вам все равно нужно будет переопределить populateTreeItem() . Что-то вроде:

 boolean first = true;
@Override
protected void populateTreeItem(WebMarkupContainer container, int level) {
    super.populateItem(container, level);
    if(first) {
        container.add(new SimpleAttributeModifer("class", "first"));
        first = false;
    }
}
  

а затем в вашем CSS,

 .first {font-color: red; font-style: italic;}
  

С помощью LinkTree (устарел в Wicket 6.21 или даже более ранней версии) вы можете переопределить newNodeComponent метод для создания компонента с нуля:

 @Override
protected Component newNodeComponent(String id, IModel<Object> model)
{
    Object node = model.getObject();
    if (node instanceof FolderNode)
    {
        FolderNode folderNode = (FolderNode)node;
        return new Label(id, folderNode.getLabel());
    }
    else if (node instanceof FileNode)
    {
        ...
    }
    else if ...
    else
    {
        return null;
    }
}
  

Примечание: исходная реализация создается LinkIconPanel с LinkTree#onNodeLinkClicked() автоматическим вызовом обработчика. Чтобы сохранить эту функцию, вам нужно вызвать onNodeLinkClicked() вручную обработчик вашей пользовательской ссылки.