React Native Skia

Skia を使用した React Native 用の高性能 2D グラフィックス

ここで完全なドキュメントをチェックアウトしてください。

React Native Skia は、Skia Graphics Library を React Native にもたらします。Skia は、Google Chrome と Chrome OS、Android、Flutter、Mozilla Firefox と Firefox OS、およびその他の多くの製品のグラフィック エンジンとして機能します。

これはアルファ版リリースです。注意して使用してください。

入門

npm install @shopify/react-native-skia

ドキュメントはhttps://shopify.github.io/react-native-skiaで入手できます。

ライブラリ開発

react-native-skia を開発するには、コンピューターに skia ライブラリをビルドする必要があります。

サブモジュールを確認してください。

git submodule update --init --recursive

ビルド スクリプトを機能させるには、いくつかのツールもインストールする必要があります。

yarn

skia ライブラリのビルドに必要なすべてのツール (XCode、Ninja、CMake、Android NDK / ビルド ツール) があることを確認してください。

MacOS では、自作経由で Ninja をインストールできます。

brew install ninja

Android Studio がインストールされている場合は、

$ANDROID_NDK

ANDROID_NDK=/Users/username/Library/Android/sdk/ndk/<version>

NDK がインストールされていない場合は、メニューのFile > Project Structureに移動して、Android Studio からインストールできます。

そして、SDK の場所セクション。NDK パス、またはインストールしていない場合はダウンロードするオプションが表示されます。

建物

• 依存関係をインストールする

  yarn bootstrap

• Skia ライブラリをビルドします

  yarn build-skia

  (これには時間がかかる場合があります)。
• Skia ヘッダーをコピーする

  yarn copy-skia-headers

• pod install

  サンプル プロジェクトで実行する

アップグレード中

このライブラリのアップグレードに Skia の新しいバージョンが含まれている場合は、続行する前にいくつかの追加手順を実行する必要があります。

1. サブモジュールを更新します。

   git submodule update --recursive

2. Skia ヘッダーをコピーします。

   yarn copy-skia-headers

3. クリーンスキア:

   yarn clean-skia

4. スキアを構築します。

   yarn build-skia

5. サンプル プロジェクトで pod install を実行します。

出版

• 構築セクションでコマンドを実行します
• で Android バイナリをビルドします。

  yarn build-android

• で NPM パッケージをビルドします。

  yarn build-npm

NPM パッケージを手動で公開します。出力は

dist

• example/ios フォルダーに Cocoapods をインストールします。

  cd example/ios && pod install && cd ..