Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Crop result wrong on iOS 16.3

オープン
#163 コメント 4 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
48/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
静か
技術スタック
ios, javascript, react-native
領域
mobile

調査の方向性

handlePress のエントリーポイントとそこから呼び出される ImageEditor.cropImage から始め、指定された iOS 環境で react-native-vision-camera が生成する画像 URI と expo-image-picker が生成するものを比較します。提供された比率とクロップデータを使ってクロップを再現します。完了条件は、他のプラットフォームにリグレッションを起こさず、iOS で結果が選択された領域と一致することです。

索引モデルが issue の本文から書いたものです。

説明

Environment

Phisical Device: iPhone 13 Pro Max
OS: iOS 16.2.7

Project:
"react-native": "0.74.3",
"@react-native-community/image-editor": "^4.2.0",
"expo": "~51.0.23",
"react-native-vision-camera": "^4.5.1",

Description

The crop result is outside what was expected

*This code works perfectly in all other devices/emulators and OS versions, for both Android, iOS.

This bug only happen when I got a picture from react native vision camera, when picked with expo-image-picker, it works fine!

The green toast in end of the video is:
Original Image Height and Image Width

Image crop area Height and Width
Position X and Y above the Image crop area

https://github.com/user-attachments/assets/ab1b5711-82ed-4dcc-88b7-6cec8b45e4f8

Reproducible Demo

  const handlePress = async () => {
    try {
      setTranscriptionLoading(true);
      const widthRatio = image.width / imageLayout.width;
      const heightRatio = image.height / imageLayout.height;

      const cropData: ImageCropData = {
        offset: { x: cropX.value * widthRatio, y: cropY.value * heightRatio },
        size: { width: cropWidth.value * widthRatio, height: cropHeight.value * heightRatio },
        resizeMode: "cover",
        format: "webp",
        quality: Platform.OS === "ios" ? 0.5 : 0.9,
        includeBase64: false,
      };

      const croppedImageUri: CropResult = await ImageEditor.cropImage(image.uri, cropData);

      handleTranscription(croppedImageUri);
    } catch (error) {
      console.error("Crop Error", error);
      Toast.show({ type: "error", text1: "Erro ao processar imagem" });
    }
  };
主要言語
Kotlin
スター
447
フォーク
118
平均マージ
1日 11時間
マージ済み PR(30日)
4

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

callstack/react-native-image-editor のほかの issue

callstack/react-native-image-editor の issue をすべて見る

似ている issue

Kotlin の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。