LoginSignup
2
2

More than 5 years have passed since last update.

NativeScriptでAndroid/iOS別にソース分割する方法

Posted at

iOS用に書いていたNativeScriptのプロジェクトをAndroidで実行したところ、クラス定義でエラーが発生。

ちなみにこんなソースです。

camera.ts
class AVCapturePhotoCaptureDelegateImpl extends NSObject implements AVCapturePhotoCaptureDelegate {

出たエラーは次のようなモノ(正確ではないですが、イメージ)

Class not found: NSObject

NSObjectはiOSのAPIのクラスですから、Androidで実行時エラーになるのは当たり前です。
通常なら platform の判定をしたり、 ios オブジェクトがあるかどうか確認したりして処理を分けるところ。ですが、ここはクラスの宣言なので、そういう分岐ができません。

はて困った。

そういう時に、NativeScriptでは、iOS用、Android用で読み込ませるソースファイルを分けることが出来るんです。

iOS用のソースは 〜.ios.ts にリネーム

まず今のソースはiOS用なので、 camera.ts を、camera.ios.ts にリネームします。

Android用のソースは 〜.android.ts にリネーム

次にAndroidで実行されたときに、エラーにならないように、「.android.ts」を付けたファイルを作成します。今回は camera.android.ts になります。

TypeScriptの定義ファイル 〜.d.ts を作成

最後に、TypeScriptの定義ファイルとして camera.d.ts を作成して、クラスやメソッドの定義を記述しましょう。このファイルが無いとコンポーネントをAppModuleで import することが出来ないので必須です。

例えばcameraコンポーネントは、画面にカメラプレビューを表示する画面Componentです。別クラスからインスタンス生成されたりメソッドを呼ばれたりはしないので、以下のような単純なものでOKです。

camera.d.ts
export class CameraComponent {

}

まとめ

ソース分割をすると、このようなファイル構造になります。

(例) component.ts をプラットフォーム別に分割する場合

component.ios.ts ⇒ iOS用のソース
component.android.ts ⇒ Android用のソース
component.d.ts ⇒ TypeScript用の型定義ファイル

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2