JavaFX 8 has 2 controls (=dialogs) to browse the filesystem
who create native resource dialogs but if you want to integrate a directory view in your application and/or you want custom features like a file preview those dialogs are of no help.
I had just this use case and so I implemented 3 different controls:
org.eclipse.fx.ui.controls.filesystem.DirectoryTreeView
: Display a directory structure as a treeorg.eclipse.fx.ui.controls.filesystem.DirectoryView
: Display the contents of a directory – currently only a list view is availableorg.eclipse.fx.ui.controls.filesystem.ResourcePreview
: Display preview informations of a file e.g. a thumb for images
If you combine them you get a nice file browser you can integration just anywhere
Usage is straight forward:
package org.eclipse.fx.ui.controls.sample; import java.nio.file.Paths; import javafx.application.Application; import javafx.beans.Observable; import javafx.collections.FXCollections; import javafx.scene.Scene; import javafx.scene.control.SplitPane; import javafx.stage.Stage; import org.eclipse.fx.ui.controls.filesystem.DirectoryTreeView; import org.eclipse.fx.ui.controls.filesystem.DirectoryView; import org.eclipse.fx.ui.controls.filesystem.IconSize; import org.eclipse.fx.ui.controls.filesystem.ResourceItem; import org.eclipse.fx.ui.controls.filesystem.ResourcePreview; import org.eclipse.fx.ui.controls.filesystem.RootDirItem; public class DirectoryViewSample extends Application { private static RootDirItem rootDirItem; @Override public void start(Stage primaryStage) throws Exception { rootDirItem = ResourceItem.createObservedPath( Paths.get("/Users/tomschindl/Desktop")); DirectoryTreeView tv = new DirectoryTreeView(); tv.setIconSize(IconSize.MEDIUM); tv.setRootDirectories( FXCollections.observableArrayList(rootDirItem)); DirectoryView v = new DirectoryView(); v.setIconSize(IconSize.MEDIUM); tv.getSelectedItems().addListener( (Observable o) -> { if( ! tv.getSelectedItems().isEmpty() ) { v.setDir(tv.getSelectedItems().get(0)); } else { v.setDir(null); } }); ResourcePreview prev = new ResourcePreview(); v.getSelectedItems().addListener((Observable o) -> { if( v.getSelectedItems().size() == 1 ) { prev.setItem(v.getSelectedItems().get(0)); } else { prev.setItem(null); } }); SplitPane p = new SplitPane(tv,v, prev); p.setDividerPositions(0.3,0.8); Scene s = new Scene(p,500,500); primaryStage.setScene(s); primaryStage.show(); } public static void main(String[] args) { Application.launch(args); rootDirItem.dispose(); } }
As a user, I would much prefer the native file dialog to this version. The original native dialog that you show has a list of common folders on the left side (e.g. Downloads, Documents), different views (including Column View which already includes a preview thumbnail), tags, and a search bar. All of those are lacking in the new dialog. Moreover, it just looks odd and is likely to confuse end users who would be much more comfortable with a native dialog.A
While I suppose it’s good to know all of the options that are available, I think that it would be better to just stick with the native dialog in any apps.
I can see your point but maybe I was not clear enough the viewer and the dialogs solve very different problems and there’s always a need to browse a file system inside applications whereas I’d also use the native dialogs e.g. to open files.
Pingback: JavaFX links of the week, January 19 // JavaFX News, Demos and Insight // FX Experience
nice work! will that be open source?
Yes sources are under EPL and available from the efxclipse git-repo
how to use this tutorial in Netbeans JavaFx
Not sure what you mean – there is no tutorial – this is just a library
I also want to integrate file explorer in my application and i am using Netbeans. I only find this resource useful. So I am actually asking how can i use this type of code in JAVAFX using netbeans
You should be able to get the needed binaries from our nightly build zip (http://download.eclipse.org/efxclipse/runtime-nightly/site_assembly.zip) and you’ll needed:
* org.eclipse.fx.core
* org.eclipse.fx.ui.panes
* org.eclipse.fx.ui.animation
* org.eclipse.fx.ui.controls
Thank you very much !
Interesting job but I have NPE when I select some folder which contains hidden folder (like AppData for example):
Exception in thread “JavaFX Application Thread” java.lang.NullPointerException
at org.eclipse.fx.ui.controls.filesystem.skin.DirectoryTreeViewSkin.handleDirLabel(DirectoryTreeViewSkin.java:83)
at org.eclipse.fx.ui.controls.filesystem.skin.DirectoryTreeViewSkin$$Lambda$288/1139353194.apply(Unknown Source)
at org.eclipse.fx.ui.controls.tree.SimpleTreeCell.updateItem(SimpleTreeCell.java:67)
File a bug report
Thank you…Perfect Solution
Nice work. Your component is more valuable than the native one because yours shows directory and files, not only directory.
Thanks.
Nice work, but can’t get it up and running.
Is this library compatible with the latest version of Java and OpenJFX?
I’m constantly getting errors like:
JavaDSServiceProcessor – Unable to load component ‘jar:file:/lib/org.eclipse.fx.ui.controls-2.2.0.jar!/OSGI-INF/services/org.eclipse.fx.ui.controls.styledtext.UnderlineStrategyFactory.xml’
JavaDSServiceProcessor – java.lang.NoClassDefFoundError: javax/xml/bind/JAXBContext
On Java-11+ you need to add javax.xml as a custom module as it has been removed from the jdk
Thank you so much. This is really neat. I have a question regarding the table headers though. I am implementing DirectoryView this in a UI that has Japanese language support, so text such as “File Name”, “Change Date”, and “Size” will be in Japanese. Is there a way to modify these?
please ask questions at https://www.eclipse.org/forums/index.php/f/259/