$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

widthnumber

Breite

heightnumber

Höhe

darkboolean

Dunkles Erscheinungsbild

foregroundstring

Textfarbe

mode"instruments" | "hud"

Anzeigemodus

speedUnit"km/h" | "mph"

Geschwindigkeitseinheit

languagestring

App-Sprache

reduceMotionboolean

Bewegung reduzieren

accentstring

Akzentfarbe

obdDevice{ id: string; name: string } | null

OBD-Gerät