Sådan opretter du en brugerdefineret widget til XENEON EDGE

XENEON EDGE er mere end blot en ekstra skærm. Den kan fungere som et sted, hvor du kan vise de oplysninger, du oftest har brug for. iCUE indeholder en række indbyggede widgets, men du kan også oprette dine egne. Uanset om du ønsker en tilpasset systemovervågning, en vejrvisning eller noget mere specialiseret, er det nemmere at oprette en widget, end det måske ser ud til.

Denne vejledning beskriver, hvordan brugerdefinerede widgets fungerer, hvor man kan finde den fulde tekniske reference, og hvordan AI-værktøjer kan gøre processen betydeligt hurtigere.

Brugerdefinerede widgets er udviklet med HTML, CSS og JavaScript og kører på en Chromium-baseret rendering-motor (QtWebEngine).

Strukturelt set er hver widget en mappe, der indeholder to obligatoriske filer:

• index.html: Widgetens startside (markup, stilarter og scripts).
• manifest.json: metadata, der beskriver widgeten, herunder navn, version, understøttede enheder og nødvendige plugins.

De valgfri filer omfatter yderligere CSS- og JavaScript-filer, billedfiler samt en translation.json-fil til lokalisering.

I stedet for at gentage den fulde specifikation her, findes den komplette reference til manifestformatet, de tilgængelige brugerkonfigurerbare kontrolelementer (skydeknapper, farvevælgere, sensorvælgere osv.), plugin-API'erne til sensorer og medier samt runtime-hooks til forbindelse til iCUE alt sammen i den officielle Elgato-dokumentation. Det er den officielle kilde, og den holdes opdateret i takt med, at rammen udvikler sig.

• https://docs.elgato.com/icue/widgets/

CORSAIR leverer et WidgetBuilder-sæt, der gør processen nemmere. Det består af to dele:

• WidgetBuilder CLI (icuewidget): et kommandolinjeværktøj, der opretter en ny widget-mappe, validerer dit manifest og din HTML-kode og pakker resultatet i en .icuewidget-fil, der er klar til at blive importeret til iCUE.
• En færdighed til AI-assistenter: en struktureret prompt, der lærer en AI-model at generere gyldige iCUE-widgets.

Tilsammen dækker de hele forløbet: opbygning, generering, validering og pakning. Du kan downloade WidgetBuilder Kit nedenfor.

Du behøver ikke at være webudvikler for at lave en brugerdefineret HTML-widget. AI-værktøjer som Claude, ChatGPT eller andre store sprogmodeller kan generere fungerende widget-kode ud fra en beskrivelse skrevet i almindeligt sprog.

Overfør funktionen fra WidgetBuilder Kit til den AI-assistent, du foretrækker. Claude, ChatGPT, Gemini – alt, der understøtter filoverførsel, fungerer. Funktionen forbereder modellen på widget-specifikationerne, enhedsstørrelserne og opløsningerne for XENEON EDGE, Pump LCD og Keyboard LCD samt retningslinjerne for layout, manifest og brug af plugins.

Når færdigheden er indlæst, skal du beskrive, hvad du ønsker. For eksempel:

"Opret en widget til XENEON EDGE, der viser min CPU- og GPU-temperatur på en mørk baggrund med farvede målere, der skifter fra grøn til rød afhængigt af temperaturen, og som giver mig mulighed for at tilpasse advarselstærsklerne i indstillingspanelet."

AI'en genererer filerne index.html, manifest.json og eventuelle tilhørende filer. Skillen guider modellen gennem en struktureret arbejdsgang: den stiller afklarende spørgsmål, udformer layoutet, genererer koden og hjælper dig med at teste og pakke resultatet.

Vær præcis med hensyn til, hvilke data der skal vises, og hvordan de skal se ud. Angiv, hvilke enheder du vil vise dem på (XENEON EDGE, tastatur-LCD, pumpe-LCD eller alle tre). Hvis du ønsker brugerdefinerbare indstillinger, skal du beskrive, hvad der skal kunne justeres. Og hvis din widget har brug for eksterne data (vejr, aktiekurser eller andre oplysninger hentet fra en API), skal du nævne det på forhånd, så AI'en kan hjælpe dig med at vælge den rette datakilde.

Når AI'en har genereret dine filer, skal du køre dem gennem WidgetBuilder CLI for at kontrollere resultatet og pakke det sammen i en .icuewidget-fil. Hvis noget ikke er helt korrekt, skal du fortælle AI'en, hvad der skal ændres. Det er en iterativ proces, der gør det muligt at oprette widgets uden programmeringserfaring.

Når din widget er pakket, skal du importere den til iCUE ved at klikke på knappen "+" i panelet Widgets og vælge filen. Du kan også blot dobbeltklikke på .icuewidget-filen på din computer. iCUE kontrollerer filen, og hvis alt ser korrekt ud, vises din widget på listen over widgets for alle understøttede enheder.

Her er et par ting, du skal huske på, uanset om du skriver kode manuelt eller genererer widgets ved hjælp af AI:

Sørg for, at det er let at overskue. De bedste widgets formidler de vigtigste oplysninger på få sekunder. Hvis man er nødt til at studere din widget for at finde ud af, hvad den viser, er den for kompliceret. Placer de vigtigste oplysninger i forgrunden.

Design med flere tilstande for øje. Hvis din widget er afhængig af netværksdata eller sensormålinger, skal du overveje, hvad der sker, når disse data ikke er tilgængelige. Vis en indlæsningsstatus, mens systemet initialiseres, en tydelig fejlmeddelelse, hvis noget går galt, og vis helst de seneste kendte korrekte data sammen med en offline-indikator i stedet for at lade skærmen blive sort.

Tag højde for skærmstørrelsen. Widget-pladserne på XENEON EDGE spænder fra Small (840x344 vandret) til Extra Large (2536x696 vandret). Hvis din widget er beregnet til flere størrelser, skal du sørge for, at layoutet er responsivt. Du skal ikke bare forstørre alt. Brug den ekstra plads på de større skærmstørrelser til at vise flere oplysninger eller forbedre læsbarheden.

Test på den faktiske enhed. Det, der ser godt ud i en browserforhåndsvisning, kan blive vist anderledes på selve XENEON EDGE. Importer din widget, og tjek den på den rigtige hardware, før du erklærer den færdig.

Når du har lavet noget, du er stolt af, har du flere muligheder for at vise det frem for andre. Den nemmeste måde er at eksportere det som en .icuewidget-fil og dele det direkte med venner eller medlemmer af fællesskabet.

Der er en portal for udviklere på vej, som vil give udviklere af widgets mulighed for at udgive deres produkter direkte på Elgato Marketplace, med støtte til både gratis og betalte widgets. Det giver designere og udviklere en enkel måde at nå ud til det bredere XENEON EDGE-fællesskab.