Boxely Anleitung
Weiter
Boxely Anleitung
Inhalt
Einleitung
Über das Boxely UI Toolkit
Über die "To-Do List" Anwendung
Wie man diese Anleitung benutzt
In der Anleitung navigieren
Zielgruppe
Konventionen in der Anleitung
Das Boxely Team kontaktieren
Über Boxely Anwendungen
Über Boxen
Über Bibliotheken und Resourcen
Über Scripte
Installieren der Boxely Dateien
Übungsdateien
Übungen/ToDoList
Übungen/appendix
Zusammenfassung
1. Der Anfang
Einführung in die Boxely Umgebung
Boxely Quelltextdateien
Boxely Anwendungen entwickeln
Boxely Anwendungen ausführen
Boxely Anwendungs Darsteller
Bearbeiten der Konfigurationsdatei
Benutzerdefinierte Starter erstellen
Eine neue Boxely Anwendung erstellen
Die Dateistruktur aufbauen
Die
.box
Datei
"To-Do List" Übung 1.1: Eine neue Anwendung erstellen
Boxen hinzufügen
Über Textboxen
Über einfache, horizontale und vertikale Boxen
Über Bilderboxen
"To-Do List" Übung 1.2: Boxen hinzufügen
Gadgets hinzufügen
Über Box Dateien
Gadgets definieren
Gadgets Instanziieren
Warum Gadgets benutzen?
"To-Do List" Übung 1.3: Gadgets hinzufügen
Styling Gadgets
"To-Do List" Übung 1.4: Styling Gadgets
Zusammenfassung
2. Styles benutzen
Einführung des
s
Namespace
Positioning und Alignment Styles
Dimension Styles
Fill, Stroke, Shadow, Bevel, Affine, and Other Styles
Text Styles
Deklaieren des
s
Namespace
Styling des Window Elements
"To-Do List" Übung 2.1: Styling des Window Elements
Styling Gadgets (Rückführung)
Styling Parts in einem Gadget
"To-Do List" Übung 2.2: Styling Parts in einem Gadget
Styling Parts in einem Gadget (Mehr Techniken)
"To-Do List" Übung 2.3: Hinzufügen einer scrollbaren Textbox
States zum erweitern von Styles benutzen
"To-Do List" Übung 2.4: States benutzen
Bilder als Fills benutzen
Unterstützte Bildformate
Bilder einbinden
Bilddateien referieren
"To-Do List" Übung 2.5: Laden einer Bilddatei in eine Bildbox
"To-Do List" Übung 2.6: Laden einer Bilddatei in die Bibliothek
Farbverläufe benutzen
"To-Do List" Übung 2.7: Farbverläufe benutzen
Zusammenfassung
3. Toolkit Gadgets benutzen
Einführung: Toolkit Gadgets
Toolkit Gadgets benutzen: Wie es funktioniert
Text Gadgets benutzen
"To-Do List" Übung 3.1: Benutzen des multilineLabel Gadgets
"To-Do List" Übung 3.2: Benutzen des label Gadgets
Button Gadgets benutzen
"To-Do List" Übung 3.3: Benutzen des textButton Gadgets
"To-Do List" Übung 3.4: Benutzen des button Gadgets
Quelltext organisieren
"To-Do List" Übung 3.5: Quelltext organisieren
Zusammenfassung
4. Scripting und Event Handling
Einführung: Scripting und Event Handling
Erstellen des Inhalts: Anwendungsfenster
Erstellen des Inhalts: Pop-up Fenster
Erstellen von JavaScript Funktionen für ein Gadget
JavaScript Funktionen einem Gadget zuweisen
Die Anwendung testen
More on Scripting
Shell Class
Scene Class
appUtils Class
Mehr über Event Handling
Event Handling mit Behaviors und Reactions
Event Handling mit dem
on
Namespace
Debugging einer Anwendung
"To-Do List" Übung 4.1: Programmieren des titleArea Gadget
"To-Do List" Übung 4.2: Programmieren des buttonsArea Gadget
"To-Do List" Übung 4.3: Programmieren des noteArea Gadget
"To-Do List" Übung 4.4: Programmieren des buttonsArea Gadget (Fortsetzung)
Zusammenfassung
5. Drag-and-Drop
Drag-and-Drop Verhalten programmieren
Ein "ziehbares" Quellobjekt erstellen
Ein Zielobjekt zum fallenlassen des Objekts erstellen
"To-Do List" Übung 5.1: Das noteArea Gadget "ziehbar" machen
"To-Do List" Übung 5.2: Ein Zielobjekt erstellen
Zusammenfassung
6. OCP Dienste benutzen
Einführung: OCP Dienste
OCP Dienste verwenden
"To-Do List" Übung 6.1: Den basics Dienst benutzen
"To-Do List" Übung 6.2: Den localStorage Dienst benutzen
Zusammenfassung
7. Übergänge benutzen
Einführung: Übergang
"To-Do List" Übung 7.1: Übergänge benutzen
Zusammenfassung
8. Animationen benutzen
Einführung: Animation
"To-Do List" Übung 8.1: Animationen benutzen
Zusammenfassung
9. Datenbindung benutzen
Einführung: Datenbindung
Einführung: Sammelbindung
"To-Do List" Übung 9.1: Datenbindung benutzen
Zusammenfassung
10. Veröffentlichen der Boxely Anwendung
Veröffentlichen der Boxely Anwendung
Modifizieren des Boxely Darstellprogramms und der Konfigurationsdatei
Erstellen der Boxely Anwendungs- Verzeichnisstruktur
Packen der Anwendung
Zusammenfassung
A. Box Layout Referenz
Fließendes Layout benutzen
Layout basierend auf Parent
Orientierung benutzen
Boxengröße und Veröffentlichung (mit s:flex)
Padding und Margins benutzen
Ansichten benutzen
Festes Layout benutzen
Offset benutzen
Layer benutzen
Zusammenfassung
B. Style Referenz
Fills und Farben benutzen
Eingebaute Farben benutzen
Systemfarben benutzen
HEX Farben benutzen
Ein Bild als Fill benutzen
Fills und Farben modifizieren
Slicing benutzen
Brushes benutzen
Eine Maske benutzen
Farbänderungen erstellen
Farbverläufe benutzen
Bilder teilen
Strich Patterns benutzen
Pens benutzen
Clipping und Scrolling benutzen
Schatten benutzen
Verwischen und Glühen benutzen
Bevel benutzen
Boxen skalieren und drehen
Boxely Farbkonstanten Referenzen
Eingebaute Farben: W3C CSS Standard Farbnamen
Systemfarbenkonstanten mit Windows Equivalents
Zusammenfassung
C. Animationsreferenz
Erstellen einfacher Animationen
Eine Animation zurücksetzen
Animieren einer Boxposition
"Set" Animationen benutzen
Animationen bei Eingang und Ausgang von Staten aufrufen
Dynamische Effekte zu Animationen hinzufügen
Eine komplexe Animation erstellen: Hüpfendes Bild
Zusammenfassung
D. Problembehandlungsreferenz
Debugging JavaScript Code
Debugging der Einbindung von externen Dateien
Zusammenfassung
E. Zugriffsreferenz
Über Zugreifbare Anwendungen
Über volle Tastaturnavigation
Über hohen Kontrast-Modus
Über Bildschirmlesertechnik
Volle Tastaturavigation aktivieren
Registerreihenfolge bestimmen
Tastaturkürzel einbauen
Beschleunigungstasten einbauen
Zugriffstasten einbauen
Styling Zugreifbarer Anwendungen
Hohen Kontrastmodus aktivieren
Systemfarben benutzen
Non-System-Farben benutzen
Anwendungsgröße für hohen Kontrast-Modus
Integrieren mit Bildschirmlesertechnik
Wie es funktioniert
Integrations Guidelines
"Reading" Eingabefelder
"Reading" Check Boxen
"Reading" Radio Buttons
"Reading" Combo Boxes
"Reading" Menüs
"Reading" Baumansichten
"Reading" Benutzerdefinierter Gadgets
Anwendungen auf Zugreifbarkeit testen
Anwendungen auf volle Tastaturnavigierbarkeit testen
Anwendungen im hohen Kontrast-Modus testen
Anwendungen mit einem Bildschirmleser testen
Zusammenfassung
Glossar
