Reagujte na natívne repo s doplnkami pre podporu Apple TV a Android TV

Blog

Reagujte na natívne repo s doplnkami pre podporu Apple TV a Android TV

reagovat-nativne-tvos

Do budúcna bude podpora Apple TV pre React Native zachovaná tu a v príslušných | _+_ | Balík NPM, a nie v súbore repo jadra . Toto je úplná vidlica hlavného úložiska, pričom existujú iba zmeny potrebné na podporu Apple TV.



Vydania | _+_ | bude založené na verejnom vydaní | _+_ |; napr. Vydanie 0.63.1-0 tohto balíka bude odvodené od vydania | _+_ | 0.63.1. Všetky vydania tohto repo sa budú riadiť formátom 0.xx.x-y, kde x číslic pochádza z konkrétneho jadrového vydania RN a y predstavuje ďalšie verzie z tohto repo.

Vydania budú zverejnené dňa npmjs.org a najnovšiu verziu môžete nájsť tu: https://www.npmjs.com/package/react-native-tvos?activeTab=versions alebo použite značku | _+_ |



Príslušnú podporu a údržbu tvOS nájdete v pobočkách označených | _+_ |;

Ak chcete vytvoriť svoj projekt pre Apple TV, mali by ste zmeniť | _+_ | dovoz na dovoz | _+_ | nasledovne, aby sa tento balík použil namiesto jadrového balíka s natívnou reakciou.



Ako odstrániť aktiváciu produktu zlyhalo v programe Microsoft Office 2016
react-native-tvos

Tento balík a jadrový pôvodný reakčný balík nemôžete používať súčasne v projekte.

Strojopis

Vzhľadom na povahu rozlíšenia pri písaní je súčasným riešením na zahrnutie typov toto:

  • nainštalovať | _+_ | ako závislosť od dev
  • vložiť | _+_ | v ktoromkoľvek z vašich | _+_ | súbory (odporúča sa root)

Všeobecná podpora pre Apple TV

Podpora televíznych zariadení bola implementovaná s cieľom, aby existujúce aplikácie React Native fungovali iba na Apple TV, pričom v kóde JavaScript pre aplikácie je potrebných niekoľko alebo žiadne zmeny.

Aplikácia RNTester podporuje Apple TV. V tomto repo | _+_ | a | _+_ | boli upravené tak, aby fungovali pre tvOS. Spustite | _+_ |, potom otvorte | _+_ | a stavať.

Nástraha

Uistite sa, že neinštalujete globálne | _+_ | alebo | _+_ |. Mali by ste nainštalovať iba | _+_ | používať nižšie uvedené príkazy. Ak ste to urobili nesprávnym spôsobom, môžu sa vám zobraziť chybové hlásenia ako:

react-native-tvos

Mali by ste tiež nainštalovať | _+_ | globálne, pretože by sa mal používať namiesto NPM na prácu v projektoch React Native.

Budujte zmeny

  • Natívna vrstva : React Natívne projekty Xcode majú teraz všetky ciele zostavenia Apple TV s názvami končiacimi v reťazci „-tvOS“.

  • reagovať natívne init : Vytvorenie nového projektu, ktorý používa tento balík, sa vykonáva pomocou CLI reagujúceho na pôvodné prostredie. Nové projekty vytvorené týmto spôsobom budú mať automaticky správne nakonfigurované ciele Apple TV vytvorené v ich projektoch XCode.

Ak chcete použiť tento balík NPM v novom projekte, môžete naň odkazovať ako v nasledujúcom príklade pomocou staršieho | _+_ | balíček:

react-native

Ak používate novší | _+_ | balík, syntax je mierne odlišná:

react-native
  • Vrstva JavaScript : Do | _+_ | bola pridaná podpora pre Apple TV. To, či je na AppleTV spustený kód, môžete skontrolovať tak, že urobíte
@latest

Zmeny kódu

  • Všeobecná podpora pre tvOS : Špecifické zmeny natívneho kódu pre Apple TV sú zabalené v definícii TARGET_OS_TV. Patria sem zmeny na potlačenie rozhraní API, ktoré nie sú podporované v tvOS (napr. Webové zobrazenia, posuvníky, prepínače, stavový riadok atď.), A zmeny na podporu vstupu používateľov z diaľkového ovládača televízora alebo klávesnice.

  • Spoločná základňa kódov : Pretože tvOS a iOS zdieľajú väčšinu spoločného kódu Objective-C a JavaScript, väčšina dokumentácie pre iOS platí rovnako pre tvOS.

  • Prístup k dotykovým ovládacím prvkom : Pri prevádzke na Apple TV je trieda natívneho zobrazenia | _+_ |, ktorá má ďalšie metódy na využitie zaostrovacieho jadra tvOS. | _+_ | mixin pridal kód na detekciu zmien zaostrenia a použitie existujúcich metód na správny štýl komponentov a spustenie správnych akcií, keď je zobrazenie vybrané pomocou diaľkového ovládača televízora, takže | _+_ |, | _+_ | a | _+_ | bude fungovať. Najmä:

    • | _+_ | sa vykoná, keď dotykový pohľad zaostrí
    • | _+_ | sa vykoná, keď dotykové zobrazenie zaostrí
    • | _+_ | sa spustí, keď je dotykové zobrazenie skutočne zvolené stlačením tlačidla výberu na diaľkovom ovládači televízora.
  • Vstup na diaľkové ovládanie TV/klávesnica : Natívna trieda | _+_ | nastavuje rozpoznávanie gest pre udalosti na diaľku televízora. Keď sa vyskytnú udalosti diaľkového ovládania televízie, táto trieda spustí oznámenia, ktoré zachytí | _+_ | (podtrieda | _+_ |), ktorá spustí udalosť JS. Túto udalosť prevezmú inštancie | _+_ | Objekt JavaScript. Kód aplikácie, ktorý potrebuje na implementáciu vlastného spracovania vzdialených televíznych udalostí, môže vytvoriť inštanciu | _+_ | a počúvať tieto akcie. V 0.63.1-1 sme pridali | _+_ |, ktorý zalamuje | _+_ | aby to bolo pohodlnejšie a jednoduchšie pre použitie s funkčnými komponentmi.

tvos-v0.xx.x
  • Turbomodules : Funguje od vydania 0.61.2-0.

  • Flipper : Práca vo vydaniach 0.62.2-x. Práca vo verziách 0.63.1-1 a novších; tvOS však vyžaduje moduly Flipper od 0.62.2-x. | _+_ | obsahuje makrá pre obe verzie. Nová podfile šablóny projektu je správne nastavená tak, aby poskytovala starší Flipper pre ciele pre iOS aj tvOS.

    prečo už nemôžem hľadať priateľov na Facebooku
  • LogBox : Nový chybový/výstražný displej LogBoxu (ktorý nahradil YellowBox v 0,63) funguje podľa očakávania v tvOS, po niekoľkých úpravách, aby boli ovládacie prvky dostupné pre zaostrovací modul.

  • Lisovateľné : Nový | _+_ | API for React Native 0.63 funguje s televíziou. Dodatočné | _+_ | a | _+_ | sú k dispozícii rekvizity, ktoré vám umožnia prispôsobiť správanie, keď stlačiteľný vstúpi alebo opustí zameranie. Podobne ako | _+_ | stav, ktorý je pravdivý, kým používateľ stlačí komponent na dotykovej obrazovke, | _+_ | stav bude pravdivý, keď bude zameraný na televíziu. | _+_ | v RNTester bol vhodne upravený.

  • Podpora pre Dev Menu : Na simulátore cmd-D vyvolá ponuku pre vývojárov, rovnako ako v systéme iOS. Ak ho chcete spustiť na skutočnom zariadení Apple TV, dlho stlačte tlačidlo prehrávania/pozastavenia na diaľkovom ovládači. (Netraste, prosím, zariadením Apple TV, to nebude fungovať :))

  • Televízne diaľkové animácie : | _+_ | natívny kód implementuje paralaxové animácie odporúčané spoločnosťou Apple, ktoré vám pomôžu viesť oko pri navigácii používateľmi po zobrazeniach. Animácie je možné deaktivovať alebo upraviť pomocou nových voliteľných vlastností zobrazenia.

  • Navigácia späť pomocou tlačidla ponuky na diaľkovom ovládači televízora : | _+_ | komponent, pôvodne napísaný tak, aby podporoval tlačidlo späť pre Android, teraz podporuje aj spätnú navigáciu na Apple TV pomocou tlačidla ponuky na diaľkovom ovládači televízora.

  • Ovládanie TVMenu : Tento modul poskytuje metódy na povolenie a zakázanie navigácie pomocou tlačidla ponuky na diaľkovom ovládači televízora. Je to potrebné na vyriešenie problému s pokynmi spoločnosti Apple na navigáciu pomocou klávesov ponuky (pozri https://github.com/facebook/react-native/issues/18930 ). | _+_ | aplikácia používa tento nový modul na implementáciu správneho správania klávesov ponuky.

  • TVFocusGuideView : Tento komponent poskytuje podporu pre Apple | _+_ | API, ktoré má pomôcť zaistiť navigáciu k zamerateľným ovládacím prvkom, aj keď nie sú priamo v súlade s inými ovládacími prvkami. Príklad je uvedený v | _+_ | , ktorý ukazuje dva rôzne spôsoby použitia tohto komponentu.

  • Ďalší smer zaostrenia : rekvizity | _+_ | dňa | _+_ | mal by fungovať podľa očakávania aj v systéme iOS (predtým iba Android). Jedna námietka je, že ak v | _+_ | nie je možné zamerať v smere vedľa úvodného zobrazenia, iOS nekontroluje, či chceme prepísať cieľ.

  • TVTextScrollView : Na Apple TV sa ScrollView nebude posúvať, pokiaľ v ňom alebo nad/pod ním nie sú zaostriteľné položky. Tento komponent obaluje ScrollView a používa natívny kód špecifický pre tvOS, ktorý umožňuje posúvanie pomocou gest potiahnutím prstom z diaľkového ovládača.

  • Známe problémy :

    • Od vydania 0.61.2-0 sa kód Fabric neskompiluje ani nespustí. Problém je v štádiu vyšetrovania.
    • Existujú známe problémy s komponentom TabBarIOS v dôsledku zmien, ktoré spoločnosť Apple vykonala v programe UITabBar pre tvOS 13.

Podrobnosti na stiahnutie:

Autor: reagovat-nativne-tvos

Demo: https://dlowder-salesforce.github.io/react-native-apple-tv/

Zdrojový kód: https://github.com/react-native-tvos/react-native-tvos

#react #react-native #mobile-apps