APEX 5.0: Page Designer. Tobias Strohmeyer Berlin,

Transkript

1 APEX 5.0: Page Designer Tobias Strohmeyer Berlin,

2 Agenda 1. Übersicht 2. Shortcuts 3. Treeview 4. Properties 5. Grid Layout 6. Gallery 7. Toolbar 8. Code Editor 2

3 Übersicht 3

4 Übersicht Page Designer Toolbar Tree View Grid Layout Properties Gallerie 4

5 Shortcuts 5

6 Shortcuts Display From Here Ctrl+Option+D Go to Help Option+F1 Display From Page Ctrl+Option+T Go to Messages Ctrl+F1 Go to Dynamic Actions Option+2 Keyboard Shortcuts Option+Shift+F1 Go to Gallery Buttons Option+9 Page Search Ctrl+Option+F Go to Gallery Items Option+8 Redo Ctrl+Y Go to Gallery Regions Option+7 Restore/Expand Option+F11 Go to Grid Layout Option+5 Save Ctrl+Option+S Go to Shared Components Option+4 Save and Run Page Ctrl+Option+R Go to Processing Option+3 Toggle Hide Empty Positions Ctrl+Option+E Go to Property Editor Option+6 Undo Ctrl+Z Go to Rendering Option+1 6

7 Tree View 7

8 APEX 4.2 Tree View Tree View 8

9 APEX 5.0 Tree View Toolbar Tree View Grid Layout Properties Gallerie 9

10 Überblick Tree View Beinhaltet gesamte Page Definition Übersicht aus 4.2 Unterteilt in Reiter für Rendering Dynamic Actions Processing Shared Components Ansicht wechselbar zwischen Component Type und Processing Order Neu: zeigt Attribute für Interactive Report Neu: Dynamic Actions weisen Page Load Events separat aus 10

11 Funktionen Tree View Drag and Drop Context Menü Löschen Duplizieren Verschieben Erstellen (Items, Buttons, Regionen, Dynamic Actions) Suchen Klick auf Element zeigt Eigenschaften im Property Pane 11

12 Properties 12

13 APEX 4.2 Properties Properties 13

14 APEX 5.0 Properties Toolbar Tree View Grid Layout Properties Gallerie 14

15 Überblick Properties Element Attribute Unterteilung in Gruppen Identification, Source, Grid, Layout, Appearance, Conditions, Securirty, Neu: Möglichkeit zur Reduzierung auf die wichtigsten Eigenschaften Neu: Textareas sind verknüpft mit dem neuen Code Editor 15

16 Funktionen Properties Direktes Editieren der Eigenschaften Kein individuelles Speichern nötigt -> Zeitersparnis durch Minimierung von Latenzen Editieren auch bei Auswahl mehrerer Elemente Gleiche Eigenschaften 16

17 Grid Layout 17

18 APEX 4.2 Grid Layout 18

19 APEX 5.0 Grid Layout Toolbar Tree View Grid Layout Properties Gallerie 19

20 Überblick Grid Layout Reiter für Grid Layout - Schematisches Layout kein WYSIWYG Messages Fehlermeldungen Page Search Seitensuche Help für Element Eigenschaften Kontextmenü Zoom Einzelansicht einer Region 20

21 Funktionen Grid Layout Drag and Drop von Komponenten Highlighting von Zielen Anzeige der Eigenschaften im Property Pane Nachrichten sind verlinkt ins Property Pane Page Search Ergebnisse sind ebenfalls verlinkt 21

22 Gallery 22

23 APEX 4.2 Gallery Tree View 23

24 APEX 5.0 Gallery Toolbar Tree View Grid Layout Properties Gallerie 24

25 Überblick Gallery Auflistung aller Regionen Items Buttons Kontextmenü Add To -> Show unsupported 25

26 Funktionen Gallery Drag and Drop per Maus Zielregion im Grid Layout Highlighting der Ziele 26

27 Tool Bar 27

28 APEX 4.2 Toolbar Toolbar 28

29 APEX 5.0 Toolbar Toolbar Tree View Grid Layout Properties Gallerie 29

30 Überblick Toolbar Seitenauswahl mit Suchfunktion Seiten Locking Undo / Redo Erstellen von Elementen, Werkzeuge Alte Component View -> wird demnächst entfernt werden! Team Development, Comments, Shared Components Speichern und Ausführen (in neuer Registerkarte) 30

31 Code Editor 31

32 APEX 4.2 Code Editor Code Editor 32

33 APEX 5.0 Code Editor Code Editor 33

34 Überblick Code Editor Syntax Highlighting Code Completion Undo / Redo Search and Replace Validation 34