$env · Anzeigeumgebung
$env stellt die Größe, das Thema, den Anzeigemodus, die Einheit und die Sprache des aktuellen Instruments bereit, mit denen derselbe Code an Anzeigeszenarien wie Mobiltelefone und HUD angepasst wird.
Größe und Layout
width, height sind die Breite und Höhe des aktuell verfügbaren Bereichs des Instruments in Bildschirmpunkten und variieren je nach Kartengröße und Anzeigeumgebung. Sie entsprechen nicht der Auflösung des gesamten Telefons und auch nicht der Anzahl der Pixel im Bild.
Schriftarten, Grafikradius und Endpunktkoordinaten, die mit der Größe angepasst werden müssen, sollten anhand dieser Breite und Höhe in main() berechnet werden. Ein fester 120-Punkte-Kreis hat immer eine feste Größe; Damit er je nach Karte variiert, berechnen Sie den Durchmesser anhand des kleineren Werts der verfügbaren Breite und Höhe.
Design, Anzeigemodus und Einheiten
foreground ist die Textfarbe, die zum aktuellen Hintergrund passt, accent ist die Akzentfarbe und dark stellt die aktuelle dunkle Erscheinung dar. Der Wert von mode ist instruments oder hud, was auf eine normale Zähler- oder HUD-Anzeige hinweist.
speedUnit stellt die aktuelle Geschwindigkeitsanzeigeeinheit dar, language ist die App-Sprache und reduceMotion stellt die Einstellung für den dynamischen Effekt der Systemschwächung dar. obdDevice stellt id und name des aktuell verbundenen Geräts bereit oder ist leer, wenn kein bereites Gerät vorhanden ist. Einheitenbezeichnungen sollten mit numerischen Werten verwendet werden; Durch Ändern der Beschriftung selbst wird der numerische Wert nicht konvertiert.
Beispiel: Anzeigemodus anpassen
Das folgende Beispiel verwendet eine größere Schriftgröße im HUD-Modus und verwendet die Textfarbe und Geschwindigkeitseinheiten des aktuellen Themes.
function main() {
return (
<Text fontSize={$env.mode === 'hud' ? 72 : 48} color={$env.foreground}>
{$env.speedUnit}
</Text>
);
}
Umgebungsaktualisierung
CapDrive bietet neuen Input, wenn sich Dimensionen, Themen oder andere Umstände ändern. Fügen Sie Berechnungen, die von $env abhängen, in main() ein, um sicherzustellen, dass bei der nächsten Ziehung die neuen Werte verwendet werden. Wiederholte Animationseffekte werden gemäß reduceMotion angepasst, um zu vermeiden, dass die Systemeinstellungen des Benutzers ignoriert werden.
Feld
widthnumberBreite
heightnumberHöhe
darkbooleanDunkles Erscheinungsbild
foregroundstringTextfarbe
mode"instruments" | "hud"Anzeigemodus
speedUnit"km/h" | "mph"Geschwindigkeitseinheit
languagestringApp-Sprache
reduceMotionbooleanBewegung reduzieren
accentstringAkzentfarbe
obdDevice{ id: string; name: string } | nullOBD-Gerät