as

Settings
Sign out
Notifications
Alexa
Amazonアプリストア
Ring
AWS
ドキュメント
Support
Contact Us
My Cases
開発
テスト
公開
収益化
ユーザーエンゲージメント
デバイスの仕様
リソース

既存のReact NativeプロジェクトへのTVサポートの追加(Fire TV)

既存のReact NativeプロジェクトへのTVサポートの追加(Fire TV)

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-tvosはReact Nativeのフォークです。

デバイス固有のエクスペリエンスの提供

既存のReact Nativeプロジェクトがある場合は、構成を通じてデバイス固有のエクスペリエンスを提供することで、TVサポートを追加できます。

既存のReact NativeプロジェクトでTVをサポートするように構成するには

  1. package.jsonの依存関係を更新します。

    "react-native": "npm:react-native-tvos@latest"
    

    これにより、プロジェクトでreact-native-tvosが使用されるようになります。

  2. AndroidマニフェストファイルにLeanbackランチャーを追加します。

    <intent-filter>
      <category android:name="android.intent.category.LEANBACK_LAUNCHER" />
    </intent-filter>
    

    Android TVアプリでは、ランチャーアクティビティを宣言する必要があります。これを行わないアプリはGoogle Playで検出されません。また、インストール後にシステムのホーム画面に表示されるTVアプリとしても認識されません(アプリは [設定] > [アプリ] > [すべてのアプリ] にのみ表示されます)。

  3. android.hardware.touchscreen機能とandroid.hardware.faketouch機能は必要でないことを宣言します。

    <uses-feature android:name="android.hardware.touchscreen" android:required="false" />
    <uses-feature android:name="android.hardware.faketouch" android:required="false" />
    
  4. アプリがAndroid TV向けであることを宣言します。

    <uses-feature android:name="android.software.leanback" android:required="false" />
    
  5. iOSプロジェクトファイルであるproject.pbxprojを更新し、このコードスニペットの差分に従ってtvOSのサポートを定義します。

  6. Podfileを更新します。

    - platform :ios, min_ios_version_supported
    + platform :tvos, min_ios_version_supported
    

    これにより、プロジェクトがtvOS向けに構成されます。


Last updated: 2025年7月22日