Whether your are new to Oracle APEX or not it has never been easier to deliver responsive and modern applications to your customers using single Universal theme based application.
This is the session delivered at Perth and Melbourne Connect 2018 conference events.
If you have any questions please don't hesitate.
1 of 20
Download to read offline
More Related Content
Ausoug Connect 2018 - Modern APEX application
2. November 2018
Modern apps -
Universal Theme
AUSOUG 2018 Connect Perth and Melbourne
lschilde.blogspot.com
@LinoSchilde
lschilde@apexRnD.co.nz
3. Who am I?
13+ years Oracle development experience
APEX Blogger and enthusiast
NZ APEX meetup organizer
Conference speaker
AUSOUG APEX webinar series organizer
ODTUG 2018 Leadership academy graduate
#6: Inspired by https://apex.oracle.com/en/ look and feel and trying to build something that is not typically a backend app only.
Mention application preparation
app Vita dark
upload static files
Change navigation to bar menu
Home -> fa-home
About us -> fa-info-circle -> no parent
Sign out -> no parent
User interface
--navigation menu
Display NO
Logo
select Logo type: image
Logo: #APP_IMAGES#ausoug-logo-trans.png
Copy list from Page 0 footer list
create new report card template as a copy
<li class="t-Cards-item #CARD_MODIFIERS#">
<div class="t-Card">
<div class="t-Card-wrap">
<div class="#CARD_IMAGE_CLASS#"><img src="#CARD_ICON#" class="sb-450x150" /></div>
<div class="t-Card-titleWrap"><h3 class="t-Card-title u-textUpper">#CARD_TITLE#</h3></div>
<div class="t-Card-body">
<div class="t-Card-desc u-textUpper">#CARD_TEXT#</div>
<div class="t-Card-info u-textUpper">#CARD_SUBTEXT#</div>
</div>
<span class="t-Card-colorFill u-color #CARD_COLOR#"></span>
</div>
</div>
</li>
Explain page 0 steps prepared
3 regions containing footer info and CSS
Explore it
See what happened when you run with not CSS
---PAGE 1 start building blocks following your notes
#7: -- APEX modern apps
-- history
-- with Jquery mobile
-- many universal themes
-- 4.2 and responsive start with grid layouts
-- Universal theme apex.oracle.com/ut
-- introduction
-- changes
-- font APEX normal and large style specifically designed for business apps by DEV team
-- open source to be used whenever you want free of charge
-- mobile touch events
-- building for mobile
-- navigation top as menu or side tree navigation
-- navigation for all screen now allows bottom screen anchoring-> navigation top nabigation tabs how to behave in desktop or mobile
-- sticking fixed header and stick bottom buttons container template option
-- floating labels
lot closer looking in application builder
-- template options
cards -> getting better all time
radio button and check boxes
display as pill button
-- region icons
-- classic reports hide when all option shown
-- anything that is in breadcrumb region can be sticked for mobile screens
apps using UT
ORACLE Aria people
apex.oracle.com/pls/apex/f?p=144
#15: What is Font APEX?
Font APEX is the icon library for Oracle APEX and Universal Theme. It was originally designed as a replacement for Font Awesome 4.*, the web's leading icon library, and therefore contains almost all of the Font Awesome icons, re-drawn originally on a 16x16 grid as line-icons. We wanted to make it a seamless switch to go from Font Awesome to Font APEX, and therefore use the same "fa" prefix for the icons, making it easier than ever to move to entirely new icon library.
What's new in Font APEX 2?
Font APEX 2 expands upon the original Font APEX by providing the complete set of Font APEX icons at a larger size. There are now two families of icons in Font APEX: small and large. Small icons are based on a 16x16 grid and ideally suited for buttons and menus. Large icons are based on a 32x32 grid and well suited for places where you need to provide a larger graphic, such as cards, media lists, and hero regions.
Many APEX components will automatically use the large or small icons based on the context (such as Template Options), so all you need to do is focus on the icon you want. For example, when using Cards, the Block and Featured template option will automatically show the larger versions of icons where the Basic and Compact template options will use icons from the smaller set.
There are over 1150 icons in Font APEX, and there are 25 modifiers you can place on top of any existing icons so you can customize any icon to fit your needs.