Übersicht
Jede PicoPixel-Datei trägt ihre eigene Bibliothek – die Farben, Schriften, Bilder, animierten Bilder und Komponenten, die sie verwendet, gesammelt im Assets-Panel. Für sich genommen gehört diese Bibliothek nur zu dieser einen Datei. Veröffentlichen der Datei verwandelt ihre Bibliothek in etwas, das deine Teammitglieder wiederverwenden können: Verknüpfe sie von einer anderen Datei aus, und ihre Assets erscheinen neben denen dieser Datei.
Dieser Leitfaden erklärt, was eine Bibliothek ist, was Veröffentlichen genau tut (und, ebenso wichtig, was es nicht tut), wie man Bibliotheken veröffentlicht und verknüpft und wo man sie findet. Das Wichtigste, das du mitnehmen solltest:
Veröffentlichen macht deine Arbeit nicht öffentlich. Veröffentlichen macht die Bibliothek einer Datei nur für dein Team wiederverwendbar – also für die Personen in deinem PicoPixel-Arbeitsbereich. Sie wird nie ins Internet gestellt, nie öffentlich aufgelistet und ist nie für jemanden außerhalb deines Teams sichtbar. Die einzigen Wege, auf denen Inhalte dein Team verlassen, sind solche, die du bewusst unternimmst – am Ende dieses Leitfadens beschrieben.
Was eine Bibliothek ist
Eine Bibliothek ist die Sammlung wiederverwendbarer Assets, die in einer Datei lebt. Im Assets-Panel siehst du die eigenen Assets deiner Datei unter local library – sie ist immer vorhanden und wird standardmäßig geöffnet.
Wenn du eine andere Team-Bibliothek in deine Datei verlinkst, erscheint sie als zweiter, separat benannter Bereich unterhalb deiner lokalen Bibliothek, überschrieben mit dem Dateinamen dieser Bibliothek (z. B. Animation Examples). Sobald eine Bibliothek verknüpft ist, zeigt das Assets-Panel sowohl die eigenen Assets deiner Datei als auch die Assets der verknüpften Bibliothek nebeneinander – bereit zum Hineinschieben.
Stell es dir wie zwei Regale im selben Schrank vor: Die lokale Bibliothek ist das, was diese Datei erstellt hat, und jede verknüpfte Bibliothek ist ein Regal, das von einer anderen Datei deines Teams ausgeliehen wurde. Du kannst aus beiden schöpfen, ohne dein Design zu verlassen.
Was eine Bibliothek enthalten kann
Alles, was sich im Assets-Panel einer Datei befindet, wandert mit ihrer Bibliothek mit, wenn du sie veröffentlichst. PicoPixel gruppiert Assets in diese Bereiche:
- Images, statische Grafiken, die du zur Datei hinzugefügt hast.
- Animated images, mehrbild-animierte Grafiken.
- Components, wiederverwendbare LVGL-Widgets (siehe unten).
- Colors, gespeicherte Farbfelder.
- Fonts, Schriften, die du hinzugefügt und für die Verwendung auf dem Gerät konvertiert hast.
Veröffentliche die Datei und alles davon wird für dein Team wiederverwendbar – ohne Kopieren und Einfügen zwischen Dateien.
Was eine „Komponente" ist
Eine Komponente ist ein wiederverwendbarer Baustein, der aus einem oder mehreren Widgets besteht. Während ein einzelner Button oder ein Label ein Widget ist, kann eine Komponente mehrere Widgets und Ebenen bündeln – z. B. eine gestaltete Karte mit einem Titel, einem Symbol und einem Wert – und das Ganze als eine wiederverwendbare Einheit behandeln, die du auf jedem Bildschirm einfügen kannst.
Jede Komponente hat eine Hauptinstanz. Bearbeite die Hauptinstanz und die Änderung wird auf jede Kopie dieser Komponente übertragen – überall dort, wo sie verwendet wird, auch in anderen Dateien, die deine Bibliothek verknüpfen. Das macht Komponenten so leistungsstark für eine konsistente Benutzeroberfläche: Definiere ein Element einmal, verwende es überall und aktualisiere es an einem Ort.
Wenn du immer wieder dieselbe kleine Widget-Gruppe über mehrere Bildschirme hinweg baust – eine Kopfleiste, eine Metrikkachel, ein beschriftetes Umschaltelement – wartet dort eine Komponente auf dich. Baue es einmal und jeder Bildschirm bleibt synchron.
Eine Datei als Bibliothek veröffentlichen
Veröffentlichen schaltet einen einzigen Schalter: Es markiert deine Datei als geteilte Bibliothek für dein Team.
- Öffne den Bibliotheken-Dialog. Verwende im Assets-Panel die Schaltfläche Add library (sie lautet Manage library, sobald die Datei bereits verknüpfte Bibliotheken oder Komponenten hat).
- Suche auf dem Tab LIBRARIES unter LIBRARIES IN THIS FILE. Du siehst File library – das ist die Bibliothek der aktuellen Datei – mit einer Publish-Schaltfläche daneben.
- Klicke auf Publish.
Die Schaltfläche wechselt zu Unpublish und bestätigt, dass die Datei jetzt eine geteilte Bibliothek ist, die dein Team verknüpfen kann. PicoPixel fügt der Datei auch ein kleines Bibliotheks-Badge hinzu: Du siehst es oben rechts in der Workspace-Kopfzeile und auf der Dateikarte im Dashboard, sodass du leicht erkennen kannst, welche Dateien veröffentlicht sind.
Wenn du später auf Unpublish klickst, wirst du zur Bestätigung aufgefordert, dann wird die Bibliothek getrennt. PicoPixel kopiert die Assets der Bibliothek zuerst in alle Dateien, die sie verwendet haben, damit abhängige Dateien nicht plötzlich verlieren, worauf sie sich verlassen haben.
Die Bibliotheken deines Teams finden
Veröffentlichte Bibliotheken sind für das gesamte Team an einem Ort gesammelt.
- Öffne das Dashboard.
- Klicke in der linken Seitenleiste unter Sources auf Libraries.
Diese Seite listet jede Bibliothek auf, die in deinem Team veröffentlicht wurde, begrenzt auf das Team, in dem du dich befindest – wechsle das Team und du siehst stattdessen die Bibliotheken dieses Teams. Es ist der Katalog, den deine Teammitglieder durchsuchen, um zu sehen, was zur Wiederverwendung verfügbar ist.
Eine Bibliothek in einer anderen Datei wiederverwenden
Sobald eine Bibliothek veröffentlicht ist, kann jede Datei im Team sie einbinden.
- Öffne die Datei, in der du bauen möchtest.
- Klicke im Assets-Panel auf Add library (oder Manage library), um den Bibliotheken-Dialog zu öffnen.
- Suche im Bereich SHARED LIBRARIES die gewünschte Bibliothek – das Suchfeld Search shared libraries hilft, wenn die Liste lang ist – und klicke auf das + daneben, um sie zu verknüpfen.
Die verknüpfte Bibliothek erscheint nun in deinem Assets-Panel als eigener benannter Bereich unterhalb deiner lokalen Bibliothek. Ziehe ihre Komponenten, Bilder, Farben und Schriften direkt in dein Design.
Eine verknüpfte Bibliothek aktuell halten
Wenn sich eine verknüpfte Bibliothek ändert – ihr Besitzer bearbeitet eine Komponente oder passt eine Farbe an –, werden diese Aktualisierungen nicht automatisch auf dich übertragen. Der Tab UPDATES des Bibliotheken-Dialogs listet verknüpfte Bibliotheken mit neueren Änderungen auf, und eine Update-Schaltfläche wendet sie auf deine Datei an, wenn du bereit bist. Wenn sich nichts geändert hat, teilt dir der Tab einfach mit, dass es nichts zu aktualisieren gibt.
Datenschutz: Nichts wird jemals öffentlich
Diesen Teil ist es wert, nochmals zu betonen, denn das Wort Veröffentlichen klingt größer als es ist.
Das Veröffentlichen einer Bibliothek teilt sie mit deinem Team und sonst niemandem. Der Zugriff ist authentifiziert und auf dein Team beschränkt: Es gibt keinen öffentlichen Link, keine öffentliche Auflistung und keine Möglichkeit für jemanden außerhalb deines Teams, auf eine veröffentlichte Bibliothek zuzugreifen. „Veröffentlicht" bedeutet „meinen Teammitgliedern verfügbar", Punkt.
Es gibt genau zwei Wege, auf denen etwas, das du erstellst, dein Team verlässt – und beide sind Aktionen, die du bewusst ausführst:
- Du exportierst und versendest selbst eine
.picopixel-Datei. Über das Workspace-Menü kannst du Export.picopixelwählen, was eine Datei auf deinen Computer herunterlädt. Was du mit dieser Datei machst – sie per E-Mail versenden, teilen, an jemanden weitergeben – liegt vollständig bei dir und geschieht außerhalb von PicoPixel. - Du machst eine offizielle Einreichung an das PicoPixel-Team. Wenn du dein Design mit der weiteren PicoPixel-Community teilen möchtest, reiche es zur Überprüfung unter
app.picopixel.io/#/settings/submit-templateein. Das Team prüft jede Einreichung, bevor irgendetwas in der Community-Galerie veröffentlicht wird. Siehe Wie man eine Vorlage einreicht für die Anforderungen des Formulars und die Rechte, die du gewährst.
Abgesehen von diesen zwei bewussten Schritten bleiben deine Dateien und Bibliotheken innerhalb deines Teams.
Community-Vorlagen und vorgefertigte Bibliotheken
Du musst nicht von Grund auf neu anfangen. Die PicoPixel-Vorlagengalerie hat eine wachsende Sammlung von Vorlagen, UI-Kits, Beispielen, Sprites, animierten Bildern und vollständigen App-Dateien, die vom PicoPixel-Team und der weiteren Community erstellt wurden. Jede ist eine normale .picopixel-Datei, die du öffnen, anpassen und als Ausgangspunkt für dein eigenes Projekt verwenden kannst.
Jede Vorlage, die du öffnest, kann auch zur Bibliothek werden: Veröffentliche sie und dein Team erhält Zugriff auf ihre Komponenten, Schriften, Farben und Bilder, ohne sie neu erstellen zu müssen. Das ist der schnellste Weg, ein neues Projekt zu starten oder einem bestehenden polierte Elemente hinzuzufügen.
Eine vollständige Anleitung zum Finden, Importieren und Anpassen von Vorlagen findest du unter So verwendest du PicoPixel-Vorlagen, UI-Kits und vollständige Apps.
Wie es weitergeht
- Wie man eine Vorlage einreicht, teile ein Design mit der weiteren PicoPixel-Community
- Was ist ein Sprite?, erstelle animierte, mehrzuständige Widgets, die es wert sind, zu Komponenten gemacht zu werden
- Mit Schriften arbeiten, füge die Schriften hinzu und konvertiere sie, die deine Bibliothek trägt
- Arbeiten mit dem LVGL Animated Image Widget, erstelle die animierten Bilder, die du dateienübergreifend wiederverwenden kannst
