Remove + (Plus sign) next to GWT Tree's Root Item
I wondered if anyone knew whether it was possible to remove the '+' Sign that appears next to the root item in a GWT Tree? I didn't see a CSS rule to handle it. Can one replace the + sign with say, a GIF?
(Adapted code from GWT manual below, for illustrative purposes)
TreeItem root = new TreeItem("root"); // Wish to remove + sign from next to thi开发者_运维百科s item
root.addItem("item0");
root.addItem("item1");
root.addItem("item2");
root.setState(true, true);
// Add a CheckBox to the tree
TreeItem item = new TreeItem(new CheckBox("item3"));
root.addItem(item);
Tree t = new Tree();
t.addItem(root);
// Add it to the root panel.
RootPanel.get().add(t);
CSS styling does not apply to this at all. Rather, it requires using a different constructor for tree.. If you set spacer.png to a 1x1 transparent PNG it will remove the + signs. Here is the full code I used.
The correct way to do it is as follows:
public interface MyResources extends ClientBundle {
public static final MyResources INSTANCE = GWT.create(MyResources.class);
@Source("spacer.png")
public ImageResource leaf();
}
public class TreeImagesExample implements Tree.Resources
{
@Override
public ImageResource treeClosed() {
// TODO Auto-generated method stub
return MyResources.INSTANCE.leaf();
}
@Override
public ImageResource treeLeaf() {
// TODO Auto-generated method stub
return MyResources.INSTANCE.leaf();
}
@Override
public ImageResource treeOpen() {
// TODO Auto-generated method stub
return MyResources.INSTANCE.leaf();
}
}
Main Function:
TreeImagesExample tx= new TreeImagesExample();
Tree t = new Tree(tx);
t.addItem(root);
For this to work properly, we will also need a SelectionHandler, of course, so that we can register tree clicks on the tree items rather than the (now non-existent) + signs.
You'll have to use CSS to override the plus icon image, which is set as the background image of the item with a left-margin to move the text off of it.
The root item doesn't have its own specific style so you'll have to add a style name (i.e., CSS class) on the tree item yourself and remove the background image yourself, in CSS.
精彩评论