Liquid Glass în React Native

iOS 26 a adus Liquid Glass și arată superb. Dacă lucrezi cu React Native, apare o problemă: nu-l poți folosi pe iPhone-uri mai vechi și nu-l poți folosi deloc pe Android. Așa că mi-am construit propria variantă, iar partea interesantă nu s-a dovedit a fi efectul. A fost cine decide pe care îl primești.

Decizia aparține componentei

Abordarea evidentă e două componente și o verificare de versiune în aplicație. Asta mută problema pe umerii fiecărui autor care folosește biblioteca și garantează că cele două căi se despart prima dată când una primește o corectură și cealaltă nu.

Așa că biblioteca nu întreabă niciodată pe ce versiune de iOS rulează. Întreabă dacă s-a încărcat modulul de sticlă al Apple și apoi dacă modulul acela raportează propriul API ca fiind disponibil. Un pachet poate fi instalat pe un telefon prea vechi ca să-l ruleze, iar un număr de versiune ar fi răspuns la întrebarea greșită în ambele direcții.

let resolved: GlassEffectModule | null | undefined; if (resolved !== undefined) return resolved;resolved = null;if (Platform.OS !== 'ios') return resolved; try {  const mod = require('expo-glass-effect');  // installed is not the same as supported  if (mod.isGlassEffectAPIAvailable?.() && mod.GlassView)    resolved = mod;} catch { resolved = null; }

Cache-ul are trei stări, nu două, iar ăsta e detaliul care contează. Undefined înseamnă că n-a întrebat nimeni încă. Null înseamnă că întrebarea a fost pusă și răspunsul a fost nu. Fără distincția asta, un dispozitiv fără modul reia un require care eșuează la fiecare randare a fiecărei suprafețe de sticlă de pe ecran.

Sinceritate despre alternativă

“Nu îl poți recrea. Efectul nativ refractă în timp real ce e în spatele lui, iar JavaScript nu poate. Deci nu te preface.”

Efectul real eșantionează și refractă live orice se află în spatele lui. Nu există cale să faci asta în JavaScript și SVG, iar orice afirmație contrară e marketing. Ce poți face foarte aproape sunt blurul, lumina de pe margine și felul în care se mișcă lucrul. Așa că alternativa merge după astea, iar biblioteca spune pe șleau că e o reconstrucție.

Mișcarea e partea de care sunt cel mai mulțumit. Pastila de pe controlul segmentat se întinde și se așază suficient de aproape de cea reală încât, una lângă alta, trebuie să cauți diferența. Slider nativ încă nu există, așa că acel control rulează întotdeauna varianta mea, ceea ce e o amintire utilă că nivelul se alege per componentă, nu per dispozitiv.

Despre ce e de fapt tot lucrul ăsta

Un singur rând în aplicație, cea mai bună experiență disponibilă pe orice o ține în mână și zero configurare. Dacă partea nativă lipsește, componenta degradează în loc să arunce o eroare. Autorul aplicației scrie același rând în ambele cazuri, iar faptul că rândul rămâne același e tot produsul.