react native image resizer
3.0.10
تحذير منذ الإصدار 3.0.0، تم نقل هذه المكتبة من
react-native-image-resizerإلى@bam.tech/react-native-image-resizer
منذ الإصدار 3.0.0 ، تدعم هذه الحزمة البنية الجديدة المبتكرة (وحدة Turbo). كما أن لديها توافقًا رجعيًا مع القديم.
yarn add @bam.tech/react-native-image-resizer
cd ios && pod install
yarn add [email protected]
cd ios && pod install
ملاحظة: في أحدث إصدارات React Native، قد يكون لديك خطأ أثناء إنشاء Gradle على Android ( com.android.dex.DexException: Multiple dex files define Landroid/support/v7/appcompat/R$anim ). قم بتشغيل cd android && ./gradlew clean لإصلاح هذه المشكلة.
معلومات الرابط اليدوي لنظام Android: الرابط
import ImageResizer from '@bam.tech/react-native-image-resizer' ;
ImageResizer . createResizedImage (
path ,
maxWidth ,
maxHeight ,
compressFormat ,
quality ,
rotation ,
outputPath
)
. then ( ( response ) => {
// response.uri is the URI of the new image that can now be displayed, uploaded...
// response.path is the path of the new image
// response.name is the name of the new image with the extension
// response.size is the size of the new image
} )
. catch ( ( err ) => {
// Oops, something went wrong. Check that the filename is correct and
// inspect err to get more details.
} ) ; يتوفر نموذج تطبيق أساسي في مجلد example . يستخدم الوحدة لتغيير حجم الصورة من Camera Roll.
createResizedImage (
/**
* uri parameter accepts`path` or `uri`.
* This property has been tested with the output of @bam.tech/react-native-image-picker,
* react-native-vision-camera, @react-native-camera-roll/camera-roll and http link
**/
uri ,
maxWidth ,
maxHeight ,
compressFormat ,
quality ,
( rotation = 0 ) ,
outputPath ,
( keepMeta = false ) ,
( options = { } )
) ; // Returns a Promise يتم حل الوعد بكائن يحتوي على: path ، uri ، name ، size (البايت)، width (البكسل)، height الملف الجديد. يمكن استخدام URI مباشرة source لمكون <Image> .
| خيار | وصف |
|---|---|
| طريق | مسار ملف الصورة، أو سلسلة صور مشفرة base64 مسبوقة بـ "data:image/imagetype" حيث يكون imagetype هو jpeg أو png. |
| عرض | العرض المطلوب تغيير حجمه (انظر mode لمزيد من التفاصيل) |
| ارتفاع | الارتفاع لتغيير الحجم (انظر mode لمزيد من التفاصيل) |
| compressFormat | يمكن أن يكون إما JPEG أو PNG أو WEBP (Android فقط). |
| جودة | رقم بين 0 و100. يستخدم لضغط JPEG. |
| تناوب | تطبيق التدوير على الصورة بالدرجات للأندرويد. في نظام التشغيل iOS، يكون التدوير محدودًا (ومقربًا) إلى مضاعفات 90 درجة. |
| مسار الإخراج | مسار الصورة الذي تم تغيير حجمه. إذا كانت فارغة، فسيتم تخزين الصورة التي تم تغيير حجمها في مجلد ذاكرة التخزين المؤقت. لتعيين مسار الإخراج، تأكد من إضافة خيار للتدوير أيضًا (إذا لم تكن هناك حاجة للتدوير، فما عليك سوى ضبطه على 0). |
| keepMeta | إذا كان true ، فسيحاول الحفاظ على جميع بيانات تعريف الملف/معلومات exif، باستثناء قيمة الاتجاه نظرًا لأن تغيير الحجم يؤدي أيضًا إلى تصحيح التدوير للصورة الأصلية. القيمة الافتراضية false ، مما يعني فقدان كافة البيانات الوصفية. ملاحظة: يمكن أن true هذا فقط على صور JPEG التي يتم تحميلها من نظام الملفات (وليس من الويب). |
| options.mode | يشبه وضع تغيير حجم الصورة التفاعلية الأصلية: إما contain (الافتراضي) أو cover أو stretch . contain تناسب الصورة ضمن width height ، مع الحفاظ على نسبتها. يحافظ cover على نسبة العرض إلى الارتفاع، ويتأكد من أن الصورة بعرض width أو height على الأقل. سيؤدي stretch إلى تغيير حجم الصورة إلى width height تمامًا. |
| options.onlyScaleDown | إذا كان true ، فلن يتم تكبير الصورة أبدًا، بل ستجعلها أصغر فقط. |
@react-native-camera-roll/camera-roll مع تمكين البنية الجديدة، فلن تعمل هذه المكتبة . إذا حاولت عرض صورة باستخدام uri الخاص بالمكتبة باستخدام <Image /> فسوف يظهر لك الخطأ التالي: No suitable image URL loader found for ph://... . يأتي هذا الخطأ من ReactNative ImageLoader ، وهو الذي نستخدمه حاليًا. نرحب بالمساعدة/العلاقات العامة لحل هذه المشكلة. وحتى ذلك الحين، نوصي باستخدام react-native-image-picker .نحن شركة مكونة من 100 شخص نقوم بتطوير وتصميم تطبيقات متعددة المنصات باستخدام React Native باستخدام منهجية Lean & Agile. للحصول على مزيد من المعلومات حول الحلول التي تناسب احتياجاتك، لا تتردد في الاتصال بنا عبر البريد الإلكتروني أو من خلال نموذج الاتصال!
سنجيبك دائمًا بكل سرور؟
