Looking for a tree (or nested list) UI component that would work for a hybrid mobile app and would have the following properties:
- drag-and drop
- animations (visual feedback) for insert/delete/update and expand/collapse and drag/hover/drop
- good performance on mobile
- open-source (I would accept paid open-source, dual-licensing, etc.)
- modern, clean look
- "modern" implementation, for example aligning itself with philosophies like AngularJS, ReactJS, Ionic or whatever are the recent cool kids on the block
My research so far has found the following ones:
- https://angular-ui-tree.github.io/angular-ui-tree/#/cloning (no animations)
- https://www.jstree.com/demo/ (drag and drop problems on mobile)
- many others on http://www.jqueryrain.com/demo/jquery-treeview/ but I haven't found anything that would look designed for mobile
None of them really seems to work well in mobile browser (I'm testing on Android 4.x, 5.x, 6.x). Following issues seem to occur:
- drag events seem to not be interpreted properly, instead unexpected things happen, like scrolling or text selection (subjectively: does not "seem right" to me as a user to manipulate the tree)
- choppy animations
- clickable elements too small for tapping via finger
- about half of the solutions sadly look like windows 95 Explorer tree, which is not good on the eyes and does not seem modern and clean
Can you advise such a UI component that would work or at least would be a good starting point for my own enhancements?
Are the mobile browsers ready to host such a sophisticated component, in terms of input events, layout, performance, animations, etc.?
Full disclosure: I come from a Java+Android background, expanding into hybrid mobile apps, so my paradigm might not yet be fully adjusted.
The backend (e.g. Firebase) part is here: Using firebase tree structure to represent a "document outline" structure directly