Open3

Expoでカメラのズーム機能について調査

JboyHashimotoJboyHashimoto

パッケージがあるようだ

メンテナンスがされていないものもあるようだ。4年前か💦
https://github.com/ascoders/react-native-image-zoom#readme

こちらはされている。
https://github.com/Glazzes/react-native-zoom-toolkit

Expoでの画像加工機能について、実装可能な機能をリストアップします。

  1. 基本的なズーム機能
  • react-native-image-zoom または react-native-image-pan-zoom を使用
  • スライダーUIによるズームコントロール
  • ピンチジェスチャーによるズーム
  • "ズームイン" "ズームアウト" の明確なラベル表示
  1. 画像トリミング
  • react-native-image-crop-picker による実装
    • 自由な比率でのトリミング
    • 固定アスペクト比でのトリミング(1:1、16:9、4:3など)
    • トリミング範囲の数値指定
    • プレビュー機能
  1. フィルター効果
  • react-native-image-filter-kit を使用
    • モノクロ
    • セピア
    • コントラスト調整
    • 明るさ調整
    • 彩度調整
  1. 画像回転・反転
  • 90度ごとの回転
  • 水平・垂直反転
  • 自由角度での回転
  1. 画質調整
  • 解像度の変更
  • 圧縮率の調整
  • ファイルサイズの最適化
  1. 注意点と制約
  • Expoの管理ワークフローでは一部のネイティブ機能に制限あり
  • カスタムネイティブコードが必要な機能は開発ビルドが必要
  • iOS/Androidでの挙動の違いに注意
  1. 推奨パッケージ
// 必要なパッケージ例
{
  "dependencies": {
    "react-native-image-zoom": "^1.x.x",
    "react-native-image-crop-picker": "^0.x.x",
    "react-native-image-filter-kit": "^0.x.x",
    "@react-native-community/slider": "^4.x.x"
  }
}
JboyHashimotoJboyHashimoto

感想

カメラ機能についてはネイティブで作成した方がいいかもしれない。