Von Version < 7.1 >
bearbeitet von awa
am 10.04.2019, 10:21
Auf Version < 7.2 >
bearbeitet von awa
am 10.04.2019, 10:55
< >
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

Seiteneigenschaften
Inhalt
... ... @@ -1,24 +1,23 @@
1 1  {{content/}}
2 2  
3 -Die nachfolgend aufgeführten Elemente stellen alle im {{designer case="dat"/}} zur Verfügung stehenden Formular- und Designelemente dar. Durch den Einsatz weiterer Javaskript-Frameworks wie etwa //jQuery UI// besteht jedoch die Möglichkeit, eigene Elemente bzw. Widgets zu integrieren.
3 +Ein Formular besteht aus einer oder mehreren Seiten. Der Nutzer fängt auf der ersten Seite an und navigiert über [[Schaltflächen>doc::Schalt]] durch die Seiten. Jede Seite selbst besteht aus Formularelementen, welche frei zusammengestellt werden können.
4 4  
5 +In {{formcycle/}} stehen immer die Standardelemente zur Verfügung. Zudem können im {{designer/}} auch [[Vorlagen>doc:asd]] erstellt werden. Über Plugins können weitere Elemente für spezielle Anwendungsfälle hinzugefügt werden. Schließlich besteht auch die Möglichkeit, über JavaScript-Framework wie //jQuery UI// eigene Elemente in das Formular zu integrieren.
6 +
7 +
8 +Folgende Standardelemente stehen aktuell zur Verfügung.:
9 +
5 5  {{subpages title="Die verfügbaren Formularelemente" float="none"/}}
6 6  
7 7  == Elemente im Designbereich positionieren ==
8 8  
9 -Der {{designer/}} unterstützt Sie bei der Positionierung durch farbige Markierungen an den Elementen. Diese Funktion wird jedoch aktuell nur vom Firefox und neueren Internet Explorern (ab Version 10) unterstützt.
10 -
11 -{{figure image="element_pos_0.png" width="300"}}
12 -Einfügen eines Elementes neben neben einem anderen Element
14 +{{figure image="designer_add_element_de.png"}}
15 +Elemente können einfach per Drag&Drop mit der Maus in das Formular gezogen werden.
13 13  {{/figure}}
14 14  
15 -{{figure image="element_pos_1.png" width="300"}}
16 -Einfügen eines Elementes in ein anderes Element
17 -{{/figure}}
18 -
19 19  === Element vor, nach, unter oder über einem anderen Element positionieren ===
20 20  
21 -Wenn Sie ein Element mit gedrückter Maustaste auf dem Zeichenbereich bewegen, erscheinen bei dem nächstliegenden Element ein oranger Balken. Dieser gibt an, dass das Element an dieser Stelle eingefügt wird, wenn sie es loslassen.
20 +Wenn Sie ein Element mit gedrückter Maustaste auf dem Zeichenbereich bewegen, erscheint bei dem nächstliegenden Element ein oranger Balken. Dieser gibt an, dass das Element an dieser Stelle eingefügt wird, wenn sie es loslassen.
22 22  
23 23  === Element in ein anderes Element einfügen ===
24 24  
... ... @@ -30,12 +30,12 @@
30 30  
31 31  === Positionieren von Elementen ohne Drag&Drop ===
32 32  
33 -Bei vielen Elemente auf einer Seite oder in einem Container wird es manchmal schwierig ein Element zu positionieren. Um dieses Problem zu umgehen, können Sie auf das zu verschiebende Element doppelklicken. Danach erhalten alle Elemente im Formular einen dünnen orangen Rahmen mit Pfeilen an jeder Ecke. Wenn Sie nach dem Doppelklick jetzt auf den Pfeil an der gewünschten Position klicken, wird das Element dort positioniert.
32 +Bei vielen Elemente auf einer Seite oder in einem Container wird es manchmal schwierig, ein Element zu positionieren. Um dieses Problem zu umgehen, können Sie auf das zu verschiebende Element doppelklicken. Danach erhalten alle Elemente im Formular einen dünnen orangen Rahmen mit Pfeilen an jeder Ecke. Wenn Sie nach dem Doppelklick jetzt auf den Pfeil an der gewünschten Position klicken, wird das Element dorthin verschoben.
34 34  
35 -Wenn Sie das Element nicht verschieben möchten, drücken Sie die Escape-Taste oder erneut auf das zu verschiebende Element, um den Verschiebungsmodus zu beenden.
34 +Wenn Sie das Element nicht verschieben möchten, drücken Sie die Escape-Taste oder drücken Sie erneut auf das zu verschiebende Element, um den Verschiebungsmodus zu beenden.
36 36  
37 -{{figure image="element_pos_3.png" width="300"}}
38 -Alternativ möglich zum Positionieren von Elementen ohne Drag&Drop
36 +{{figure image="element_pos_3.png"}}
37 +Alternativ ist es auch möglich, ein Elemente ohne Drag&Drop zu verschieben. Führen Sie hierzu einen Doppelklick auf das Element aus.
39 39  {{/figure}}
40 40  
41 41  == Elemente markieren ==
... ... @@ -42,33 +42,40 @@
42 42  
43 43  === Einfache Markierung ===
44 44  
45 -Die einfache Markierung erreichen Sie durch Anklicken eines Elements mit der Maus. Das Element wird farbig hervorgehoben.
46 -
47 -{{figure image="element_select_0.png" width="300"}}
48 -Markieren eines Elements
44 +{{figure image="element_select_0.png"}}
45 +Durch Klick wird ein Element selektiert. Rechts können seine Eigenschaften nun bearbeitet werden.
49 49  {{/figure}}
50 50  
48 +Klicken Sie mit der Maus auf ein Element, um es auszuwählen. Das Element wird farbig hervorgehoben. Rechts im Eigenschaftsbereich können Sie nun die Eigenschaften des Elements bearbeiten.
49 +
51 51  ==== Mehrfachmarkierungen ====
52 52  
53 -1. Drücken Sie die Umschalttaste-Taste und halten Sie diese gedrückt.
54 -1. Markieren Sie jetzt das/die gewünschte(n) Element(e).
55 -
56 56  {{figure image="element_select_1.png" width="300"}}
57 -Markieren mehrerer Elemente
53 +Durch Drücken der Umschalt-Tastennen auch mehrere Elemente selektiert werden.
58 58  {{/figure}}
59 59  
56 +1. Drücken Sie die Umschalttaste-Taste und halten Sie diese gedrückt.
57 +1. Klicken Sie jetzt der Reihe nach auf die Elemente, die sie auswählen möchten.
58 +
59 +Rechts im Eigenschaftsbereich können Sie nun alle Eigenschaften berarbeiten, welche die ausgewählten Eigenschaften gemeinsam haben. Sobald Sie eine Eigenschaft ändern, wird der neue Wert der Eigenschaft für alle ausgewählten Elemente übernommen.
60 +
60 60  === Übergeordnete Elemente auswählen ===
61 61  
62 -Ist ein Element selektiert, erscheinen in der Leiste oben im {{designer case="dat"/}} alle übergeordneten Elemente und können per Klick ausgewählt werden. Dies ist z.B. nützlich, um einfache Elemente vom Typ [[Seite>>doc:Formcycle.FormDesigner.FormElements.Page]] oder [[Container>>doc:Formcycle.FormDesigner.FormElements.Container]] auswählen zu können.
63 +Ist ein Element selektiert, erscheinen in der Leiste links unten im {{designer case="dat"/}} alle übergeordneten Elemente und können per auch Klick ausgewählt werden. Dies ist etwa nützlich, um einfache Elemente vom Typ [[Seite>>doc:Formcycle.FormDesigner.FormElements.Page]] oder [[Container>>doc:Formcycle.FormDesigner.FormElements.Container]] auswählen zu können.
63 63  
64 -{{figure image="FCDesSel.png" width="300"}}
65 -Auswählen übergeordneter Elemente
65 +{{figure image="FCDesSel.png"}}
66 +In der Navigationsleiste links unten können die Elternelemente des ausgewählten Elements eingesehen und auch markiert werden.
66 66  {{/figure}}
67 67  
68 -== Elemente löschen ==
69 +== Elemente kopieren und löschen
69 69  
70 -Elemente können entweder über die Papierkorb-Schaltfläche oder mit der Entffernen-Taste (//entf//) gelöscht werden.
71 -
72 -{{figure image="element_del_0.png" float="none" width="200"}}
73 -Die Papierkorb-Schaltfläche zum Löschen von Elementen.
71 +{{figure image="asd"}}
72 +Durch Rechtsklick auf ein Element öffnet sich ein Kontextmenü mit verschiedenen Aktionen.
74 74  {{/figure}}
74 +
75 +Klicken Sie auf ein Element, um es zu markieren.
76 +
77 +* Durch Drücken der Entfernen-Taste (//entf//) kann das Element gelöscht werden. Dies funktioniert auch, wenn mehrere Elemente ausgewählt wurden.
78 +* Durch Drücken von //Strg+C// kann das Element kopiert und mit //Strg+V// eingefügt werden.
79 +
80 +Alternativ können Elementen auch gelöscht und kopiert werden, indem auf das Element mit der rechten Maustaste geklickt wird. Es öffnet sich dann ein Menü mit verschiedenen Aktionen.
Copyright 2000-2024