Direkt zum Hauptinhalt

Eine Komponente in einer anderen App verwenden

Ziel​

Sie haben in der App Products eine Karte gezeichnet. Sie möchten dieselbe Karte in Orders – genau dieselbe, sodass eine einmalige Korrektur beide korrigiert.

Eine Sache richten Sie einmal pro App ein: Aktivieren Sie „Komponenten dieser App teilen“ bei der App, die sie zeichnet. Alles, was sie zeichnet, wird dann jeder anderen App der Umgebung angeboten, in deren Bereich Komponenten unter Aus anderen Apps.

Das Kästchen ist standardmäßig aus, und das ist Absicht – die meisten Apps sind keine Komponentenbibliotheken, und eine App, die versehentlich veröffentlicht, würde ihre halb gezeichneten Formen in die Palette aller anderen legen. Sie finden es unter Studio-Apps → Neu oder indem Sie eine App auswählen und Bearbeiten drücken; die Liste hat eine Spalte, die zeigt, welche Apps teilen.

Das brauchte früher einen zusätzlichen Schritt, jetzt nicht mehr

Es gab eine separate Liste Studio-Komponenten im Erstellerportal und eine Schaltfläche In gemeinsame verschieben, die eine Komponente aus der App, in der Sie sie gezeichnet hatten, in einen eigenen Datensatz hob. Beides ist weg. Eine Komponente lebt dort, wo sie gezeichnet wurde; wenn Sie die Seite suchen, brauchen Sie die Zeichenfläche der App.

Eine erstellen​

Aktivieren Sie in der App, die Ihre Komponenten enthalten soll, Komponenten dieser App teilen – im Dialog Neu oder unter Bearbeiten. Zeichnen Sie dann das Teil auf ihrer Zeichenfläche – neben dem Bildschirm oder darauf –, genau wie Sie alles andere zeichnen würden. Dann kommt der Schritt, auf den es ankommt:

Wählen Sie aus, was Sie gezeichnet haben, und wählen Sie Komponente erstellen.

Die Komponente übernimmt den Namen des Objekts, aus dem Sie sie gemacht haben, und diesen Namen sehen andere Apps. Benennen Sie die Ebene um, und die Komponente wird mit umbenannt. Speichern Sie.

Das ist schon alles, was dazu gehört. Sie steht jetzt in der Palette jeder anderen App.

Sie in einer anderen App platzieren​

Öffnen Sie den Designer der anderen App, und sehen Sie sich den Bereich Komponenten an. Unter Aus anderen Apps finden Sie jede Komponente, die die anderen Apps der Lösung gezeichnet haben, jeweils mit der App, aus der sie stammt, neben ihrem Namen – denn zwei Apps können beide eine „Card“ haben, und eine Liste, die einen Namen zweimal zeigt, wäre eine Liste, aus der Sie nicht wählen könnten.

Ziehen Sie eine auf die Zeichenfläche, oder wählen Sie die Zeile aus und drücken Sie die Eingabetaste. Was ankommt, ist eine Instanz: eine gewöhnliche Komponenteninstanz, die Sie genau wie eine selbst gezeichnete positionieren, in der Größe ändern und überschreiben können.

Speichern Sie.

Sie einmal ändern​

Öffnen Sie die App, die die Komponente gezeichnet hat, ändern Sie sie, und speichern Sie.

Öffnen Sie nun die App, die sie platziert hat. Sie teilt Ihnen mit, dass die Kopie aktualisiert wurde, und die Änderung ist da. Speichern Sie diese App, um sie zu behalten. Dieses zweite Speichern ist Absicht: In die Zeichnung einer anderen Person zu schreiben, nur weil sie sie geöffnet hat, darf ein Designer nicht.

Warum Ihre App eine Kopie behält​

Öffnen Sie das Dokument der platzierenden App, und Sie finden darin die Knoten der Komponente, unter IDs, die mit sc_ beginnen, dazu eine Definition, die festhält, aus welcher App sie stammt, wie sie dort heißt, und eine Revision.

Diese Kopie ist kein Fehler, und Sie pflegen sie nie. Sie bringt zwei Dinge:

  • Ihre App ist in sich geschlossen. Sie wird eigenständig validiert, verpackt, importiert und kompiliert. Eine Komponente, die nicht mitgereist ist, hinterlässt eine App, die hinterherhinkt, keine, die nicht dargestellt wird.
  • Was ausgeliefert wurde, ist das, was dargestellt wird. Eine App, die ihre Komponenten abruft, wenn jemand sie öffnet, könnte das nicht versprechen.

Die Kopie des Originals liegt links neben Ihrer Zeichnung auf einem „Regal“ und erscheint nie auf einem Bildschirm: Sie ist eine Definition, kein Inhalt. Dargestellt werden nur die Instanzen, die Sie platziert haben.

Das Teilen ausschalten​

Deaktivieren Sie das Kästchen, und die Komponenten der App werden nicht mehr angeboten. Apps, die bereits eine platziert hatten, behalten sie: Ihre verknüpfte Kopie bleibt genau so, wie sie war, eingefroren auf der Revision, die sie kopiert haben. Dasselbe passiert, wenn eine App deinstalliert wird, und aus demselben Grund – eine App darf keinen Teil ihres Bildschirms verlieren, weil jemand anderes eine Einstellung geändert hat.

Was diese Apps verlieren, sind Aktualisierungen: Nichts bringt ihre Kopie mehr auf den neuesten Stand, denn die Palette hat nichts mehr, womit sie sie vergleichen könnte.

Die eine Komponente, die Sie nicht anderswo verwenden können​

Eine Komponente, die den Bildschirmzustand ihrer eigenen App liest. Die Zeile wird im Bereich der anderen App aufgeführt, ausgegraut, mit dem Ausdruck – zum Beispiel state.showCard.

Das ist keine willkürliche Regel. Ihre Komponente würde auf Bildschirmen landen, die kein solches Zustandsfeld haben, sodass der Ausdruck eine Abhängigkeit von etwas wäre, das vielleicht nicht existiert, und auf jedem Bildschirm fehlschlüge, dem es fehlt. Stellen Sie stattdessen das, was sie braucht, als Eigenschaft bereit, und die platzierende App füllt es aus – siehe Einen Entwurf mit Komponenten wiederverwenden.

Innerhalb der App, die sie gezeichnet hat, funktioniert dieselbe Komponente genau wie immer. Die Einschränkung betrifft das Überschreiten der Grenze, und sie macht sich genau einmal bemerkbar, dort, wo sie erklärt werden kann.

Eine löschen​

Löschen Sie die Komponente auf der Zeichenfläche der App, die sie gezeichnet hat, und drücken Sie Speichern.

Wenn andere Apps sie platzieren, werden Sie zuerst gefragt, und die Frage nennt sie. Das Löschen entfernt sie auch aus diesen Apps – die Alternative wäre, sie eine Karte zeichnen zu lassen, die niemand öffnen kann, denn die Palette bietet sie nicht mehr an, und kein Designer kann sie erreichen.

Abbrechen schreibt nichts, auf keiner Seite. Ihre Zeichenfläche bleibt genau so, wie sie ist, einschließlich des Löschens – der Weg zurück ist also Rückgängig.

Probieren Sie es aus​

Importieren Sie das Beispiel studio-shared-components. Es enthält zwei Apps: Products, die eine Stat-Karte zeichnet, und Orders, die sie platziert. Ändern Sie die Karte in Products, speichern Sie, und öffnen Sie Orders.

Verwandte Szenarien​