treeview.rml 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <rml>
  2. <head>
  3. <link type="text/template" href="../../../assets/window.rml"/>
  4. <title>Tree View</title>
  5. <style>
  6. body {
  7. width: 450dp;
  8. height: 400dp;
  9. margin: auto;
  10. }
  11. /* Hide the window icon. */
  12. div#title_bar div#icon {
  13. display: none;
  14. }
  15. spacer {
  16. display: inline-block;
  17. }
  18. expand {
  19. display: inline-block;
  20. vertical-align: -3dp;
  21. margin-right: 2dp;
  22. }
  23. tbody tr {
  24. height: 1.5em;
  25. }
  26. tbody td
  27. {
  28. padding-top: 0.1em;
  29. height: 1.5em;
  30. text-align: left;
  31. white-space: nowrap;
  32. overflow: hidden;
  33. }
  34. </style>
  35. </head>
  36. <body template="window">
  37. <table data-model="filebrowser">
  38. <thead>
  39. <tr><td style="margin-left: 10dp; margin-right: 10dp;"></td></tr>
  40. </thead>
  41. <tbody>
  42. <tr data-for="file : files" data-if="file.visible">
  43. <td>
  44. <spacer data-style-width="25 * (1 - file.directory + file.depth) + 'dp'"/>
  45. <expand data-if="file.directory" data-class-collapsed="file.collapsed" data-event-click="toggle_expand(it_index)"/>
  46. {{ file.name }}
  47. </td>
  48. </tr>
  49. </tbody>
  50. </table>
  51. </body>
  52. </rml>