Going Virtual

  • 442 views
Uploaded on

First ideas of a frame work for virtual widgets in qooxdoo.

First ideas of a frame work for virtual widgets in qooxdoo.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
442
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
18
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide







































Transcript

  • 1. colorstrip.gifT THE NEW ERA OF WEB DEVELOPMENT Going Virtual Virtual Widget Framework for qooxdoo Fabian Jakobs Jonathan Weiß
  • 2. Table in qooxdoo 0.8
  • 3. Virtual Widget Use Cases
  • 4. Design Principles
  • 5. Design Principles • Low dependencies
  • 6. Design Principles • Low dependencies • No policies
  • 7. Design Principles • Low dependencies • No policies • No implicit actions
  • 8. Design Principles • Low dependencies • No policies • No implicit actions • Small API
  • 9. Design Principles • Low dependencies • No policies • No implicit actions • Small API • Pluggable components
  • 10. Design Principles • Low dependencies • No policies • No implicit actions • Small API • Pluggable components
  • 11. Design Principles • Low dependencies • No policies • No implicit actions • Small API • Pluggable components • Customized widgets on top
  • 12. Core: Virtual Pane
  • 13. Core: Virtual Pane virtual scrolling
  • 14. Core: Virtual Pane virtual scrolling
  • 15. Core: Virtual Pane virtual variable scrolling cell sizes
  • 16. Pane Architecture Pane Layer Container Layer #1 Layer #2 Layer #3
  • 17. Pane Pane • Renders window of Layer Container Layer #1 virtual grid Layer #2 • variable row/column Layer #3 sizes • Layers are widgets
  • 18. Axis • Converts virtual pixel coordinates into: • Cell indexes • Cell Offsets • Allows custom cell sizes
  • 19. Layer Examples • Row Color • Grid Line • HTML Cell • Widget Cell
  • 20. Layer Examples • Row Color • Grid Line • HTML Cell • Widget Cell
  • 21. Layer Examples • Row Color • Grid Line • HTML Cell • Widget Cell
  • 22. Layer Examples • Row Color • Grid Line • HTML Cell • Widget Cell
  • 23. Row Layer
  • 24. Scroller • Provides scroll bars for the pane • Extends qx.ui.core.AbstractScrollArea
  • 25. Wish list
  • 26. Wish list Selection
  • 27. Wish list Selection Focus
  • 28. Wish list Selection Cell Renderer Focus
  • 29. Wish list Selection Cell Renderer Focus Cell Editor
  • 30. Wish list Selection Cell Renderer Focus Cell Editor Header
  • 31. Wish list Selection Cell Renderer Focus Cell Editor Header Grouping
  • 32. Wish list Selection Cell Renderer Focus Cell Editor Row/Column Grouping Header span
  • 33. Wish list Column Selection Sorting Cell Renderer Focus Cell Editor Row/Column Grouping Header span
  • 34. Wish list Column Selection Sorting Cell Renderer Focus Cell Editor Row/Column Grouping Header span Column Resizing
  • 35. Wish list Column Selection Sorting Cell Renderer Focus Cell Editor Row/Column Grouping Header span Frozen Column Columns Resizing
  • 36. Wish list Column Selection Sorting Cell Renderer Focus Cell Editor Row/Column Grouping Header span Frozen Column ... Resizing Columns
  • 37. DEMO