Mastering universal theme
9 likes3,897 views
The document discusses the overhaul of Oracle Application Express (APEX) version 5.0, which aims to enhance developer productivity and create visually appealing applications across devices. It highlights the improvements in template management, focusing on simplifying the creation of consistent themes and the introduction of a 'page designer' for efficient application changes. The old themes' complexity is critiqued, emphasizing the need for fewer, more versatile templates to streamline development.
Mastering universal theme
- 1. Copyright © 2015 APEX Consulting Mastering the APEX Universal Theme Roel Hartman
- 2. 2
- 6. Copyright © 2015 APEX Consulting Themes
- 7. Copyright © 2015 APEX Consulting What are Themes?
- 8. Copyright © 2015 APEX Consulting What was wrong with the old Themes? Templates Table Based CSS tuning
- 9. Copyright © 2015 APEX Consulting The answer of the APEX Dev Team: 42
- 11. Copyright © 2015 APEX Consulting Managing Templates Less is more âŠ
- 12. Managing Templates âą Just a few templates per type âą Fine tune using Template Options
- 13. Managing Templates Options âą Declarative âą One click magic âą No additional template âą No CSS
- 14. Managing Templates Options âą And you can create your own! âą Example: Set an item to uppercase / lowercase
- 15. DEMONSTRATION Copyright © 2015 APEX Consulting Create a Template Option Group
- 17. DEMONSTRATION Copyright © 2015 APEX Consulting Create Template Options
- 19. DEMONSTRATION Copyright © 2015 APEX Consulting Use Template Options
- 21. DEMONSTRATION Copyright © 2015 APEX Consulting Running the Page
- 23. Make It Work .Ukoug--Uppercase input { text-transform: uppercase } âą Now it can be used by all other developers without knowing any CSS Note: This CSS wonât change the actual value !!!
- 24. Copyright © 2015 APEX Consulting What was wrong with the old Themes? Templates Table Based CSS tuning
- 25. Grids âą Fluid âą Nested âą Regions, Items and Labels
- 26. Fluid? âą adaptive âą pixel based âą use different pixel sizes for different screen sizes âą ïŹuid âą maximum size ïŹxed âą columns based on percentages
- 27. Fluid? <div class="container"> <div class="row"> <div class="col col-7â> #CONTENT# </div> <div class="col col-5â> #CONTENT# </div> </div> </div>
- 28. Grid != Responsive âą reducing screen size > reduce columns widths âą so you need more âŠ
- 29. Responsive Grid âą media queries - just one major breakpoint deïŹned @media (max-width:640px){ .col-1,.col-10,.col-11,.col-12, .col-2,.col-3,.col-4,.col-5, .col-6,.col-7,.col-8,.col-9 { width:100%; } }
- 30. Regions, Items And Labels âą Column 8 = start on 8th âą Column Span 3 = â.col-3â
- 31. Regions, Items And Labels âą Label Column Span
- 33. Copyright © 2015 APEX Consulting What was wrong with the old Themes? Templates Table Based CSS tuning
- 34. DEMONSTRATION Copyright © 2015 APEX Consulting Theme Roller
- 36. DEMONSTRATION Copyright © 2015 APEX Consulting Theme Roller - Theme Styles
- 38. DEMONSTRATION Copyright © 2015 APEX Consulting Theme Roller - Copy Theme Styles
- 40. Copyright © 2015 APEX Consulting What was wrong with the old Themes? Templates Table Based CSS tuning
- 41. downside is, you need a lot of templates for each and every building block: one for a region with a border and one for a region without a border; one for a report with a header and one for a report without one. So you end up with an impressive number of templates, and making general changes, e.g. a change that applies to all region templates, is a lot of work. So that should be made simpler. Mastering the In the spring of this year the long awaited version 5.0 of Oracle Application Express (APEX) was released. This version was not just another update, but a major overhaul with two goals: increase developer productivity and create better-looking applications on every device. Roel Hartman, Director & Senior APEX Developer, APEX Consulting APEX Universal Theme Although APEX was already well known for its speed of development, the developer still needed to click around quite a lot when making changes to his application. Thatâs totally changed with the appearance of the âPage Designerâ. In one view you can see all the details of your page, a graphical representation of what your page looks like and the properties of the current selected item (see ïŹgure 1). Just like in good old Oracle Forms you can select multiple items at once and make changes to common attributes with just one click. Next to Page Designer there are dozens of other new features that makes APEX one of the most productive, if not the most productive, Oracle development environments. The Issues With The Old Templates The second goal of APEX 5.0 was to make it easier to create good-looking applications on every device. In APEX, templates deïŹne the look of an application. There are templates for every type of building block, like pages, regions, buttons etc and a set of templates is grouped into a theme. So youâll get a uniform look across your application when youâve picked a theme. The www.ukoug.org 17 APEX & Database Development FIGURE 1: PAGE DESIGNER See the latest issue of Oracle Scene Sign up for our training (tomorrow !!).âš Special price: GBP xxx
- 43. Copyright © 2015 APEX Consulting Q& Aroel@apexconsulting.nl http://www.apexconsulting.nl