Inlinebearbeitung

Das DiagramEditor-Widget kann Textfelder in den Entitäten eines Graphen editieren. Dazu müssen in Schablonen attachPoints mit dem Attribut editable identifiziert werden. Wenn ein attachPoint als editierbar markiert ist, wird die editierbare Komponente mit einer gepunkteten Linie umrahmt, und Sie können doppelt auf die Komponente klicken, um sie zu editieren. Wenn Sie doppelt auf den Bereich mit der editierbaren Komponente klicken, wird ein Editor geöffnet, in dem Sie den zugeordneten Wert ändern können. Akzeptieren Sie den neuen Wert, indem Sie die Eingabetaste drücken, oder brechen Sie die Operation durch Verlassen des Editors ab.
Es ist möglich, alternative Editors für Felder, die keine Textfelder sind, im DiagramEditor-Widget zu registrieren. Der verfügbare Editor verwendet eine dojo-TextBox und ist unter der ID textbox registriert. Das Attribut "editable" gibt den Editor an, der jedem Feld zugordnet ist.
Das Attribut "editable" ist ein zusammengesetztes Attribut, das die Informationen enthält, die zum Starten des Inlineeditors verwendet werden. Dies sind im Einzelnen:
  • set/get: Die Namen der Setter- und Getter-Methoden, die für den Zugriff auf den Wert der Entität verwendet werden. Dies müssen Methoden des Knotens, Untergraphen oder Links sein.
  • id: Eine Alternative zum Festlegen/Abrufen, die den Namen (in Kleinbuchstaben) der zugeordneten Eigenschaft enthält (die Attribute "set:/get:" werden automatisch für diesen Namen gesetzt).
  • editor: Die ID des für dieses Feld zu verwendenden Editors.
  • options: Ein zusammengesetztes Attribut, das verwendet wird, um spezielle Parameter an den registrierten Editor zu übergeben.
  • baseRegion: Der optionale Basiszeichenrahmen des editierbaren Bereich, wenn der editierbare Bereich zu klein ist, um darauf klicken zu können.
  • regionStyle: Der optionale Stil, der auf den Umriss angewendet werden soll, der den editierbaren Bereich markiert (überschreibt die standardmäßig verwendete gepunktete Linie).
  • border: Eine ganze Zahl, die die Breite des Rands darstellt, bis zu dem der editierbare Bereich des Feld hinaus vergrößert wird.
Das folgende Beispiel stammt aus der Standardknotenschablone:
...
editable: {
   id:'label',
   editor:'textbox',
   border:2,
   regionStyle:{selectedStyle:{stroke:{color:'white',style:'ShortDot'}}},
   baseRegion:{x:20,width:40,y:11,height:15}
}
...