Warum ein benutzerdefiniertes Scoreboard erstellen?
Die standardmäßige FiveM-Spielerliste ist funktionsfähig, es mangelt ihr jedoch an der Politur und Informationsdichte, die Roleplay-Server benötigen. Mit einer benutzerdefinierten Anzeigetafel kannst du Spielernamen zusammen mit ihrer Charakteridentität, Berufsbezeichnung, Server-ID und Verbindungsqualität anzeigen, alles im Stil des Brandings deines Servers. Über die Ästhetik hinaus gibt Ihnen eine benutzerdefinierte Anzeigetafel die Kontrolle darüber, welche Informationen für verschiedene Spielergruppen sichtbar sind. Normale Spieler sehen möglicherweise Charakternamen und IDs, während Administratoren zusätzliche Felder wie Steam-IDs und Ping-Werte sehen. Wenn du deinen eigenen Server erstellen, kannst du auch Funktionen wie Sortieren, Filtern nach Job und Statistiken zur Spielerzahl in Echtzeit hinzufügen, die sowohl Spielern als auch Mitarbeitern helfen, den Server effektiv zu verwalten.
Ressourcenstruktur und -manifest
Eine Scoreboard-Ressource ist relativ leichtgewichtig und besteht aus einem Client-Script für die Tastenkombinationsverarbeitung und Datenerfassung, einem Server-Script für die Aggregation von Spielerdaten und einer NUI-Seite für die Darstellung der visuellen Anzeige. Da die Ressource eigenständig bleibt und keine externen Abhängigkeiten außerhalb deines Frameworks aufweist, ist sie einfach zu installieren und zu warten. Hier ist das Ressourcenmanifest und die Ordnerstruktur:
Die ui_page-Direktive verweist auf die NUI-Eintragsdatei, und der files-Block stellt sicher, dass alle NUI-Assets mit der Ressource gebündelt werden. Die Verwendung von lua54 ermöglicht Lua 5.4-Funktionen wie Ganzzahldivision und bitweise Operatoren, die für die Formatierung und Datenverpackung in fortgeschritteneren Scoreboard-Implementierungen nützlich sein können.
Serverseitige Spielerdatenerfassung
Der Server ist für die Erstellung der vollständigen Spielerliste mit allen Informationen verantwortlich, die die Anzeigetafel anzeigen muss. Anstatt dass der Client jeden Spieler einzeln abfragt, sammelt der Server alle Spielerdaten in einer einzigen Tabelle und sendet sie in einer einzigen Nutzlast an den anfragenden Client. Dieser Ansatz lässt sich gut skalieren, da die Datenaggregation einmal pro Anfrage und nicht einmal pro Spieler erfolgt. Füge Ping-Werte, Jobinformationen und Spieler-IDs in die Nutzlast ein:
Der Rückruf prüft, ob der anfragende Spieler über Administratorberechtigungen verfügt, bevor vertrauliche Informationen wie Steam-Namen und -Kennungen hinzugefügt werden. Dies verhindert, dass normale Spieler Kontoinformationen über die Anzeigetafel sammeln. Der GetConvar-Aufruf ruft die maximale Spieleranzahl ab, sodass die Anzeigetafel einen Kapazitätsindikator wie „32/64 Spieler“ anzeigen kann.
Clientseitige Tastenkombination und Umschaltlogik
Die Anzeigetafel sollte sich öffnen, wenn der Spieler eine bestimmte Taste gedrückt hält, und schließen, wenn er sie loslässt. FiveM bietet die Funktion RegisterKeyMapping für neu zuordenbare Tastenkombinationen. Dies ist der bevorzugte Ansatz gegenüber hartcodierten Tastenprüfungen, da Spieler damit ihre Steuerung über das Spieleinstellungsmenü anpassen können. Verwende ein „Hold-to-Show“-Muster, bei dem sich der NUI beim Tastendruck öffnet und beim Loslassen der Taste schließt, um ein reibungsloses, unaufdringliches Erlebnis zu gewährleisten:
Die Präfixe + und - in den Befehlsnamen erstellen automatisch ein Press- und Release-Paar. Wenn der Spieler die gebundene Taste drückt, wird der Befehl +scoreboard ausgelöst. Wenn sie es veröffentlichen, wird -scoreboard ausgelöst. Beachte, dass SetNuiFocus mit false, false aufgerufen wird, da die Anzeigetafel nur zur Anzeige dient und keine Mauseingabe erfordert. Wenn du eine anklickbare Anzeigetafel mit Sortierung oder Filterung wünschen, übergebe stattdessen true, true und fügst du im NUI eine Schaltfläche zum Schließen hinzu.
NUI-Rendering mit HTML und CSS
Die NUI-Ebene rendert die Spielerliste als gestaltetes Tabellen- oder Kartenlayout. Verwende einen halbtransparenten Hintergrund, der den Spielbildschirm überlagert, ohne die Sicht vollständig zu blockieren. CSS Grid oder Flexbox eignen sich gut zum Ausrichten der Datenspalten. Codiere Ping-Werte farblich, damit Spieler die Verbindungsqualität schnell erkennen können: Grün steht für guten Ping, Gelb für mäßigen und Rot für schlechten Ping. Hier ist die Kernstruktur des NUI:
Gestalte die Anzeigetafel mit einem dunklen, halbtransparenten Hintergrund und einer festen Positionierung, damit sie zentriert auf dem Bildschirm bleibt. Füge eine maximale Höhe mit Überlauf-Scrolling für die Spielerliste hinzu, damit Server mit 200 oder mehr Spielern die Anzeigetafel nicht vom Bildschirm verschieben. Erwäge das Hinzufügen einer subtilen Einblendanimation mit CSS-Übergängen, damit sich das Öffnen und Schließen elegant und nicht störend anfühlt.
Hinzufügen von Such- und Filterfunktionen
Bei Servern mit einer großen Spielerzahl ist das Durchsuchen und Filtern der Anzeigetafel unerlässlich. Füge oben eine Sucheingabe hinzu, die die Spielerliste je nach Spielertyp nach Name, Server-ID oder Berufsbezeichnung filtert. Implementiere den Filter vollständig in JavaScript auf der NUI-Seite, sodass es keine Server-Round-Trip-Verzögerung gibt. Du kannst auch anklickbare Spaltenüberschriften hinzufügen, um nach ID, Name, Job oder Ping zu sortieren:
Der Sortierstatus wird clientseitig beibehalten, sodass das Umschalten zwischen aufsteigender und absteigender Reihenfolge sofort erfolgt. Der Dienstanzeigepunkt neben dem Jobnamen bietet ein schnelles visuelles Signal dafür, ob ein Spieler gerade im Dienst ist. Dies ist besonders nützlich für Administratoren, die die Liste durchsuchen, um den Personalbestand in verschiedenen Abteilungen zu überprüfen.
Admin-Funktionen und erweiterte Informationen
Wenn ein Administrator die Anzeigetafel öffnet, sollte er zusätzliche Spalten und Aktionsschaltflächen sehen, auf die normale Spieler keinen Zugriff haben. Füge ein Rechtsklick-Kontextmenü zu Spielerzeilen hinzu, mit dem Administratoren einen Spieler direkt von der Anzeigetafel aus treten, sperren, zu ihm teleportieren oder ihm zuschauen können. Dadurch wird die Anzeigetafel von einer einfachen Anzeige zu einem kompakten Admin-Panel. Implementiere die Berechtigungsprüfung sowohl auf der Client- als auch auf der Serverseite. Der Client prüft, ob Admin-UI-Elemente gerendert werden sollen, und der Server validiert jede Admin-Aktion unabhängig:
Protokolliere Administratoraktionen aus Gründen der Verantwortlichkeit immer in einer Datenbank oder einem Discord-Webhook. Gib die Kennung des Administrators, den Zielspieler, die durchgeführte Aktion und einen Zeitstempel an. Dieser Prüfpfad ist wichtig, um Streitigkeiten zwischen Mitarbeitern zu lösen und kompromittierte Administratorkonten zu erkennen, die möglicherweise ihre Befugnisse missbrauchen.
Leistung und Optimierung
Eine Anzeigetafel, die Frame-Drops verursacht, verfehlt ihren Zweck. Der häufigste Leistungsfehler besteht darin, die Player-Daten bei jedem Frame oder alle paar Millisekunden zu aktualisieren. Das automatische Aktualisierungsintervall sollte nicht kürzer als drei bis fünf Sekunden sein, da sich Spielerdaten wie Ping und Jobstatus nicht schnell genug ändern, um schnellere Aktualisierungen zu rechtfertigen. Vermeide auf der NUI-Seite, bei jeder Aktualisierung das gesamte DOM zu zerstören und neu zu erstellen. Verwende stattdessen einen abweichenden Ansatz, der nur die geänderten Zeilen aktualisiert, oder verwendest du innerHTML zumindest nur für den Spielerlistencontainer und nicht für die gesamte Anzeigetafel. Halte den CSS einfach und vermeide starke Effekte wie Unschärfe oder Box-Shadow in jeder Zeile, da diese bei Multiplikation über Hunderte von Zeilen teure GPU-Compositing-Vorgänge auslösen. Implementiere bei sehr großen Servern mit 200 oder mehr Spielern virtuelles Scrollen, das nur die sichtbaren Zeilen plus einen kleinen Puffer rendert, damit die Anzahl der DOM-Knoten überschaubar bleibt, unabhängig davon, wie viele Spieler verbunden sind. Teste dein Scoreboard auf einem vollen Server, um die tatsächlichen Auswirkungen auf die Leistung zu messen, denn eine Funktion, die bei 10 Spielern gut aussieht, kann bei 200 zu einem Engpass werden.