如果您正在閱讀本文，您可能熟悉電視應用程式開發的複雜性和碎片化，並且像我們一樣，您已經轉向 React Native 作為解決方案。這是 React Native 的一個令人興奮的用例，社群在這個領域取得了重大進展 - 最值得注意的是，Expo 今年早些時候在 Expo SDK 50 中引入了電視支援。
受到我們自己的經歷（和掙扎？）的啟發，我們決定創建一個關於使用 React Native for TV 的綜合指南。
由於使用 React Native 框架（例如 Expo）現在是創建新應用程式的建議方法，因此我們的指南重點關注這一點。然而，在我們發布後的討論中，我們意識到仍然有開發人員想知道如何為電視建立一個裸 React Native (RN) 專案。這就是為什麼本文將探討如何設定裸 RN 項目，並擴展如何設定項目以針對多個平台進行建置。
開始 TV 開發有兩種不同的方式：Expo 和 Bare React Native。您在這些方法之間的選擇將取決於多個因素，例如專案複雜性、效能需求以及您所針對的特定電視平台。
Expo 透過降低設定開發環境的複雜性，提供了更快的電視應用程式開發途徑。它為多個平台（網路、電視和行動裝置）和預先配置的建置流程提供開箱即用的支援。 Expo 非常適合快速入門！ ？
您可以在本 Expo 文件或我們指南的「入門」章節中找到更多資訊。
另一方面，Bare React Native 可以提供開發者更多的控制力和靈活性。它非常適合需要特定庫或具有獨特性能要求的項目。
如果您正在啟動 Bare React Native 項目，確保您的專案針對 TV 配置的最簡單方法是使用 React Native 社群 CLI 範本：
npx @react-native-community/cli@latest init TVTest --template @react-native-tvos/template-tv
這將建立一個包含react-native-tvos 以及 Android 和 TvOS 所需的所有配置的專案。
如果您有一個現有的 React Native 專案並想要添加 TV 支持，您需要處理這些配置以擴展它以構建 TV 應用程式。請注意，上面的模板會為您處理此問題。
1。更新 package.json 相依性
npx @react-native-community/cli@latest init TVTest --template @react-native-tvos/template-tv
這使您的專案能夠使用 React Native 的一個分支，react-native-tvos，並進行支援 Apple TV 和 Android TV 所需的變更。
？您無法在專案中同時使用此套件和核心 React-Native 套件，但是使用 fork 並不會阻止您建立「常規」行動版本。
2。更新 Android 清單
"react-native": "npm:react-native-tvos@latest"
如果沒有這個，您的應用程式將無法在Google Play 上被發現，也不會被識別為安裝後出現在系統主螢幕上的電視應用程式（該應用程式只能在“設定”>“應用程式”>“全部”中可見）應用程式。 ）
<intent-filter> <category android:name="android.intent.category.LEANBACK_LAUNCHER" /> </intent-filter>
<uses-feature android:name="android.hardware.touchscreen" android:required="false" /> <uses-feature android:name="android.hardware.faketouch" android:required="false" />
有關這些更改的更多信息，請閱讀有關添加電視支援的 Android 文件。
？我們建議僅將這些變更新增至電視應用程式的 Android 清單中。如果您的應用程式除了電視之外還針對不同的建置平台，您仍然需要確保平台網域功能，例如行動建置需要觸控螢幕。
我們在下面解釋瞭如何建立您的應用程式以具有單獨的清單。
*3。更新 Project.pbxproj *
根據此更新iOS專案文件以定義TVOS的支援。
4。更新 Podfile
<uses-feature android:name="android.software.leanback" android:required="false" />
這可確保您的專案針對 tvOS 設定。
React Native 的最大優勢之一是可以將一個程式碼庫用於多個平台。當您創建電視版本時也是如此。但是，行動和電視項目可能需要單獨的 package.json、podfile 和 Android 清單。
如何建立您的應用程式來處理這個問題？一種選擇是將您的專案建置為單一儲存庫：
查看 Oskar 的文章，以了解有關 Yarn 工作區的 monorepo 設定的詳細資訊。這提供了靈活性，因為我們可以將電視相關代碼與行動裝置分開，也可以擴展到其他電視平台，例如電視平台。 WebOS、Tizen。
針對小型專案的另一種方法使用與範本類似的結構，並在建置風格層級上區分 Android TV 和 Android Mobile 特定功能集，然後透過合併清單。
無論您選擇 Expo 路線或 Bare React Native 方法，為您的應用程式新增電視支援只需要幾個步驟。我們希望這可以幫助您開始電視開發之旅。查看指南，了解使用 React Native 建立 TV 的更多提示和技巧。如果您對書中想要看到的內容有任何疑問或要求，請在下面留言⬇️
以上是如何開發適用於 TV 的 React Native 應用程式的詳細內容。更多資訊請關注PHP中文網其他相關文章！
