User Interface (UI)
Wie man UI-Bildschirme in Pixi’VN mit externen JavaScript-Frameworks wie React, Vue und PixiJS erstellt und integriert.
Pixi’VN stellt keine integrierten Komponenten zur Erstellung der Spiel-UI bereit und erfindet nicht neu, was im JavaScript-Ökosystem bereits existiert. Anstatt Sie an ein bestimmtes Framework zu binden, ermöglicht es Ihnen, jedes externe JavaScript-Framework Ihrer Wahl zu verwenden, um Ihre UI zu erstellen, sodass Sie Systeme wie React, Vue usw. nutzen können, um komplexe und leistungsstarke UI-Bildschirme zu erstellen.
Diese Flexibilität macht Pixi’VN auch zu einer hervorragenden Wahl für KI-unterstützte Entwicklung: Da die UI mit standardmäßigen, weit verbreiteten Frameworks statt mit einem proprietären System erstellt wird, kennen KI-Coding-Assistenten diese Tools bereits gut und können UI-Code sehr effektiv generieren, verstehen und modifizieren.
React
Integrieren Sie Pixi’VN mit React, einschließlich Einrichtung, Vorlagen und den besten UI-Bibliotheken.
Vue
Integrieren Sie Pixi’VN mit Vue, einschließlich Einrichtung, Vorlagen und UI-Beispielen.
PixiJS
Verwenden Sie PixiJS-Ebenen und -Komponenten, um benutzerdefinierte UI-Bildschirme zu erstellen, und kombinieren Sie sie mit HTML-UI.
Pixi’VN bietet Funktionen, um die Kompatibilität mit anderen JavaScript-Frameworks zu verbessern:
Unterschiede zwischen der UI und dem Canvas
So wie Pixi’VN entworfen und konzipiert wurde, sind die UI und der Canvas zwei unterschiedliche und unabhängige Elemente. Die UI befindet sich über dem Canvas und wird verwendet, um Schaltflächen, Formulare usw. zu erstellen. Der Canvas wird verwendet, um Bilder, Videos usw. anzuzeigen.
Alle Informationen über den aktuellen Zustand des Canvas sind im Spielstand enthalten, und es ist möglich, den Zustand eines vorherigen Schritts wiederherzustellen. Der aktuelle Zustand der UI wird nicht in den Spielständen enthalten sein. Daher müssen Sie dies selbst verwalten, indem Sie die Informationen speichern, die Sie im Spielspeicher oder im Browser-Speicher benötigen.
Im Canvas können Sie während jedes Schritts Komponenten hinzufügen. In der UI können Sie das nicht tun, Sie können mehrere „Bildschirme“ erstellen und zwischen ihnen navigieren.
Im Canvas können Sie nur Pixi’VN-Komponenten hinzufügen. In der UI können Sie jede beliebige HTML/PixiJS-Komponente hinzufügen oder eine beliebige UI-Komponentenbibliothek verwenden, sodass Sie viel komplexere Oberflächen erstellen können.