DragAndDrop with TreeViewItem


I’m a new user of juce and I want to make a file browser with a TreeView. I want to be able to drag the file in my window.
I’ve read in that I should use the createItemComponent() fonction and the DragAndDropContainer class but I don’t know how to use these.

Could you help me please.


I give some more explanation of my pb.
I have a DocumentWindow with a file browser on the left (the tree). I want to drag&drop a file from this tree into a target in the center of the window.
So my ContentComp class inherit from DragAndDropContainer and I have an object of DragAndDropTarget in my “current” Component.
Where (and How) must I use the createItemComponent() function. I’ve read that if I use this function, I don’t have to uses the paintItem() function. But in tihs case how are shown the item.
If somebody has the response of any of my questions.

ps:Sorry for my bad english I’m a french guy :? :?


Haven’t got any examples of that, but if you wait for the next release I’ve added some quick methods for doing easy drag and drop with treeviews.


thx for the answer but I’ve not very much time. It’s for my end study project wich ends in 1 month so I’ll try to succed it. If not I will stop with my idea of doing a file browser.


A quick search reveals an example of a custom tree comp in the KeyMappingEditorComponent - have a look at that.


thx I will. :wink:


I’ve read the API and I think I have to inherit my TreeItemClass from KeyMappingEditorComponent instead of TreeViewItem. But I’ve a pb with the constructor, the first parameter is a KeyPressMappingSet (I suppose it should represente the current file or folder) and it’s writen in the doc that :
"Normally, you won’t actually create a KeyPressMappingSet directly, because each ApplicationCommandManager contains its own KeyPressMappingSet"
So my question is do you think I’m on the good way or did you think something completely different when you show me that.
I’ll try what I said this week end and I tell you my results monday (I won’t be connected this weekend).

One more time THX



Oh goody. I held off on ‘fixing’ my late night patch tree, so that will be great.That will make the tree system very powerful, and boy do users like them right now.

Good add Jules, thanks.



I tried during the week end and I didn’t achieve. I’m going to leave this idea of a drag&dropable tree and make a simple filechooser. :wink:
And I will put the tree when it will be easier.
THX for your help.


this is probably too late to help you, but for anyone else:

Note that this is based on some old code that I have lying around. JUCE may well have new methods to simplify some of this, but at least if you can get it working, you can work out how to improve it yourself…

basically, what you need to do is simply create a treeview class, and treeitem class, and component class, as such:

class MyTreeViewItemComponent()
  MyTreeViewItemComponent(TreeViewItem& creatorItem);
  virtual void mouseDrag(const MouseEvent& e);
  virtual void mouseDown(const MouseEvent& e);
  virtual void paint(Graphics& g);

  TreeViewItem* _creatorItem;

In your ctor, assign the reference to the creator tree view item to the _creatorItem pointer.

In the mouseDown() simply call _creatorItem->setSelected(true, true) to let the creator item know that the user has selected this item.

Your mouse down will be used to build your drag and drop behaviour, so we’ll look at that later.

The paint method should simply paint your item. You can call _creatorItem->getUniqueName() to get the text for the item. For a file list, the uinque name will most likely be the fully qualified file path of the item.

Now implement your TreeViewItem sub class as normal, but override the method createItemComponent() as follows:

Component* MyTreeViewItem::createItemComponent()
	MyTreeViewComponent* newComp = new MyTreeViewComponent(this);
	return newComp;

In addition to this, you’ll probably find yourself burying at least some of the logic for building the tree list into your TreeViewItem subclass.

Because Windows can have multiple drives, you may find it best to leave the root node as an empty string, and create your drives and directories as children of the root.

OK, so the last thing you need to do, other than implement your TreeView subclass, is to implement the mousedrag method in your custom tree view item component.

As long as one of your higher level components derives from DragAndDropContainer, you simpky need to make the mouseDrag() method look something like:

void MyTreeViewComponent::mouseDrag(const MouseEvent& e)
	DragAndDropContainer* dragC = DragAndDropContainer::findParentDragContainerFor(this);
	if (!dragC->isDragAndDropActive()) 
		dragC->startDragging(_creatorItem->getUniqueName(), this);

Because you are passing a string that describes the DnD operation, you can do put any kind of data in there that you want. In this instance we are just passing the unique name of the TreeView item.

omissions and errors are likely as I did that from memory, and it was a long time ago that I last did this.


thx :wink:
I’ll take a look at this when I finish the other part of my project