react-native-fast-image 8.6.32 → 8.6.33

package/README.md

@@ -176,7 +176,7 @@ e.g. `onProgress={e => console.log(e.nativeEvent.loaded / e.nativeEvent.total)}`
 
 ### `onLoad?: (event) => void`
 
-Called on a successful image fetch. Called with the width and height of the loaded image.
+Called on a successful image fetch. Called with the width and height of the image itself, not of the view (on iOS, in points: an `@2x` asset reports half its pixel size).
 
 e.g. `onLoad={e => console.log(e.nativeEvent.width, e.nativeEvent.height)}`
 

package/android/src/main/java/com/dylanvann/fastimage/FastImageRequestListener.java

@@ -4,6 +4,8 @@ import android.graphics.drawable.Drawable;
 
 import com.bumptech.glide.load.DataSource;
 import com.bumptech.glide.load.engine.GlideException;
+import com.bumptech.glide.load.model.GlideUrl;
+import com.bumptech.glide.request.Request;
 import com.bumptech.glide.request.RequestListener;
 import com.bumptech.glide.request.target.ImageViewTarget;
 import com.bumptech.glide.request.target.Target;
@@ -17,16 +19,11 @@ public class FastImageRequestListener implements RequestListener<Drawable> {
     static final String REACT_ON_LOAD_EVENT = "onFastImageLoad";
     static final String REACT_ON_LOAD_END_EVENT = "onFastImageLoadEnd";
     private final String key;
+    private final FastImageSource source;
 
-    FastImageRequestListener(String key) {
+    FastImageRequestListener(String key, FastImageSource source) {
         this.key = key;
-    }
-
-    private static WritableMap mapFromResource(Drawable resource) {
-        WritableMap resourceData = new WritableNativeMap();
-        resourceData.putInt("width", resource.getIntrinsicWidth());
-        resourceData.putInt("height", resource.getIntrinsicHeight());
-        return resourceData;
+        this.source = source;
     }
 
     @Override
@@ -48,19 +45,41 @@ public class FastImageRequestListener implements RequestListener<Drawable> {
     }
 
     @Override
-    public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
+    public boolean onResourceReady(Drawable resource, Object model, final Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
         if (!(target instanceof ImageViewTarget)) {
             return false;
         }
-        FastImageViewWithUrl view = (FastImageViewWithUrl) ((ImageViewTarget) target).getView();
+        final FastImageViewWithUrl view = (FastImageViewWithUrl) ((ImageViewTarget) target).getView();
+        boolean local = !(model instanceof GlideUrl);
+        int[] size = FastImageSourceSize.get(resource, model, local,
+                dataSource == DataSource.RESOURCE_DISK_CACHE);
+        if (size != null) {
+            sendLoad(view, size);
+            return false;
+        }
+        // A local image whose size isn't known: read it from the image first,
+        // unless the view starts another load meanwhile.
+        final Request request = target.getRequest();
+        FastImageSourceSize.readLocal(view.getContext(), source, resource, model, new FastImageSourceSize.Callback() {
+            @Override
+            public void onSize(int[] size) {
+                if (target.getRequest() == request) sendLoad(view, size);
+            }
+        });
+        return false;
+    }
+
+    private static void sendLoad(FastImageViewWithUrl view, int[] size) {
         ReactContext context = FastImageViewManager.getReactContext(view.getContext());
         if (context == null) {
-            return false;
+            return;
         }
         RCTEventEmitter eventEmitter = context.getJSModule(RCTEventEmitter.class);
         int viewId = view.getId();
-        eventEmitter.receiveEvent(viewId, REACT_ON_LOAD_EVENT, mapFromResource(resource));
+        WritableMap event = new WritableNativeMap();
+        event.putInt("width", size[0]);
+        event.putInt("height", size[1]);
+        eventEmitter.receiveEvent(viewId, REACT_ON_LOAD_EVENT, event);
         eventEmitter.receiveEvent(viewId, REACT_ON_LOAD_END_EVENT, new WritableNativeMap());
-        return false;
     }
 }

package/android/src/main/java/com/dylanvann/fastimage/FastImageSourceSize.java

@@ -0,0 +1,237 @@
+package com.dylanvann.fastimage;
+
+import android.content.Context;
+import android.graphics.BitmapFactory;
+import android.graphics.drawable.Drawable;
+import android.net.Uri;
+import android.os.Handler;
+import android.os.Looper;
+import android.util.Base64;
+import android.util.LruCache;
+import android.widget.ImageView;
+
+import androidx.annotation.Nullable;
+
+import com.bumptech.glide.Glide;
+import com.bumptech.glide.load.ImageHeaderParserUtils;
+import com.bumptech.glide.load.resource.bitmap.DownsampleStrategy;
+import com.bumptech.glide.load.resource.gif.GifDrawable;
+import com.bumptech.glide.request.RequestOptions;
+
+import java.io.ByteArrayInputStream;
+import java.io.IOException;
+import java.io.InputStream;
+import java.nio.ByteBuffer;
+import java.util.concurrent.Executor;
+import java.util.concurrent.Executors;
+
+// Works out an image's own size for onLoad, as iOS reports it (#608). Glide
+// decodes images to fit the view, so the loaded drawable is usually smaller
+// than the image.
+final class FastImageSourceSize {
+    // Sizes of recently decoded images, for loads from the memory cache, which
+    // don't decode.
+    private static final LruCache<String, int[]> SIZES = new LruCache<>(500);
+    private static final Executor EXECUTOR = Executors.newSingleThreadExecutor();
+    private static final Handler MAIN = new Handler(Looper.getMainLooper());
+
+    private FastImageSourceSize() {
+    }
+
+    // Wraps the downsample strategy Glide would use, to record the image's
+    // size (after EXIF rotation) when Glide decodes it. Views loading the same
+    // image at the same size share one decode, which uses the first view's
+    // options, so the size is recorded by image rather than by request.
+    static final class Capture extends DownsampleStrategy {
+        private final DownsampleStrategy strategy;
+        private final String key;
+        private boolean recorded;
+
+        Capture(DownsampleStrategy strategy, String key) {
+            this.strategy = strategy;
+            this.key = key;
+        }
+
+        @Override
+        public float getScaleFactor(int sourceWidth, int sourceHeight, int requestedWidth, int requestedHeight) {
+            // Called again with the sampled size; the first call has the image's.
+            if (!recorded) {
+                recorded = true;
+                SIZES.put(key, new int[]{sourceWidth, sourceHeight});
+            }
+            return strategy.getScaleFactor(sourceWidth, sourceHeight, requestedWidth, requestedHeight);
+        }
+
+        @Override
+        public SampleSizeRounding getSampleSizeRounding(int sourceWidth, int sourceHeight, int requestedWidth, int requestedHeight) {
+            return strategy.getSampleSizeRounding(sourceWidth, sourceHeight, requestedWidth, requestedHeight);
+        }
+
+        // Glide's memory cache keys include the strategy, so match the wrapped
+        // one to keep sharing cached images between views.
+        @Override
+        public boolean equals(Object o) {
+            return o instanceof Capture && ((Capture) o).strategy.equals(strategy);
+        }
+
+        @Override
+        public int hashCode() {
+            return strategy.hashCode();
+        }
+    }
+
+    // What RequestBuilder.into(ImageView) applies for the view's scale type
+    // (it leaves a transformation that's already set alone), with the
+    // downsample strategy it implies wrapped by capture.
+    static RequestOptions scaleTypeOptions(@Nullable ImageView.ScaleType scaleType, Capture capture) {
+        RequestOptions options = new RequestOptions();
+        if (scaleType != null) {
+            switch (scaleType) {
+                case CENTER_CROP:
+                    options = options.optionalCenterCrop();
+                    break;
+                case CENTER_INSIDE:
+                case FIT_XY:
+                    options = options.optionalCenterInside();
+                    break;
+                case FIT_CENTER:
+                case FIT_START:
+                case FIT_END:
+                    options = options.optionalFitCenter();
+                    break;
+                default:
+                    break;
+            }
+        }
+        return options.downsample(capture);
+    }
+
+    static Capture capture(@Nullable ImageView.ScaleType scaleType, Object model) {
+        return new Capture(strategy(scaleType), String.valueOf(model));
+    }
+
+    private static DownsampleStrategy strategy(@Nullable ImageView.ScaleType scaleType) {
+        if (scaleType == null) return DownsampleStrategy.DEFAULT;
+        switch (scaleType) {
+            case CENTER_CROP:
+                return DownsampleStrategy.CENTER_OUTSIDE;
+            case CENTER_INSIDE:
+            case FIT_XY:
+                return DownsampleStrategy.CENTER_INSIDE;
+            case FIT_CENTER:
+            case FIT_START:
+            case FIT_END:
+                return DownsampleStrategy.FIT_CENTER;
+            default:
+                return DownsampleStrategy.DEFAULT;
+        }
+    }
+
+    // The image's size, or null when it has to be read from a local image's
+    // header first (see readLocal).
+    @Nullable
+    static int[] get(Drawable resource, Object model, boolean local, boolean fromResourceCache) {
+        String key = String.valueOf(model);
+        if (resource instanceof GifDrawable) {
+            // Glide decodes GIFs itself (sampled to fit the view), without the
+            // downsample strategy; their header has the size.
+            int[] size = gifSize((GifDrawable) resource);
+            if (size != null) return size;
+        } else if (fromResourceCache) {
+            // Glide caches local images already resized for the view, and the
+            // decode from there recorded the resized size.
+            SIZES.remove(key);
+            return null;
+        } else {
+            int[] size = SIZES.get(key);
+            if (size != null) return size;
+            if (local) return null;
+        }
+        return new int[]{resource.getIntrinsicWidth(), resource.getIntrinsicHeight()};
+    }
+
+    @Nullable
+    private static int[] gifSize(GifDrawable gif) {
+        ByteBuffer buffer = gif.getBuffer();
+        if (buffer == null || buffer.limit() < 10) return null;
+        // The logical screen width and height (little-endian) follow the
+        // 6-byte signature.
+        int width = (buffer.get(6) & 0xff) | (buffer.get(7) & 0xff) << 8;
+        int height = (buffer.get(8) & 0xff) | (buffer.get(9) & 0xff) << 8;
+        return new int[]{width, height};
+    }
+
+    interface Callback {
+        void onSize(int[] size);
+    }
+
+    // Reads a local image's size from its header, off the main thread.
+    static void readLocal(Context context, final FastImageSource source, final Drawable resource, final Object model, final Callback callback) {
+        final Context appContext = context.getApplicationContext();
+        EXECUTOR.execute(new Runnable() {
+            @Override
+            public void run() {
+                int[] size = readBounds(appContext, source);
+                if (size != null) {
+                    SIZES.put(String.valueOf(model), size);
+                } else {
+                    size = new int[]{resource.getIntrinsicWidth(), resource.getIntrinsicHeight()};
+                }
+                final int[] result = size;
+                MAIN.post(new Runnable() {
+                    @Override
+                    public void run() {
+                        callback.onSize(result);
+                    }
+                });
+            }
+        });
+    }
+
+    @Nullable
+    private static int[] readBounds(Context context, FastImageSource source) {
+        try {
+            BitmapFactory.Options options = new BitmapFactory.Options();
+            options.inJustDecodeBounds = true;
+            InputStream stream = open(context, source);
+            try {
+                BitmapFactory.decodeStream(stream, null, options);
+            } finally {
+                stream.close();
+            }
+            if (options.outWidth <= 0 || options.outHeight <= 0) return null;
+            int orientation;
+            stream = open(context, source);
+            try {
+                Glide glide = Glide.get(context);
+                orientation = ImageHeaderParserUtils.getOrientation(
+                        glide.getRegistry().getImageHeaderParsers(), stream, glide.getArrayPool());
+            } finally {
+                stream.close();
+            }
+            // EXIF orientations 5 to 8 rotate by 90 or 270 degrees.
+            boolean rotated = orientation >= 5 && orientation <= 8;
+            return rotated
+                    ? new int[]{options.outHeight, options.outWidth}
+                    : new int[]{options.outWidth, options.outHeight};
+        } catch (IOException | RuntimeException e) {
+            return null;
+        }
+    }
+
+    private static InputStream open(Context context, FastImageSource source) throws IOException {
+        if (source.isBase64Resource()) {
+            String data = source.getSource();
+            byte[] bytes = Base64.decode(data.substring(data.indexOf(',') + 1), Base64.DEFAULT);
+            return new ByteArrayInputStream(bytes);
+        }
+        Uri uri = source.getUri();
+        String path = uri.getPath();
+        if ("file".equals(uri.getScheme()) && path != null && path.startsWith("/android_asset/")) {
+            return context.getAssets().open(path.substring("/android_asset/".length()));
+        }
+        InputStream stream = context.getContentResolver().openInputStream(uri);
+        if (stream == null) throw new IOException("Can't open " + uri);
+        return stream;
+    }
+}

package/android/src/main/java/com/dylanvann/fastimage/FastImageViewWithUrl.java

@@ -152,6 +152,9 @@ class FastImageViewWithUrl extends AppCompatImageView {
         }
 
         if (requestManager != null) {
+            // Records the image's own size when Glide decodes it, for onLoad.
+            Object model = imageSource == null ? null : imageSource.getSourceForLoad();
+            FastImageSourceSize.Capture capture = FastImageSourceSize.capture(getScaleType(), model);
             RequestBuilder<Drawable> builder =
                     requestManager
                             // This will make this work for remote and local images. e.g.
@@ -160,14 +163,17 @@ class FastImageViewWithUrl extends AppCompatImageView {
                             //    - res:/
                             //    - android.resource://
                             //    - data:image/png;base64
-                            .load(imageSource == null ? null : imageSource.getSourceForLoad())
+                            .load(model)
                             .apply(FastImageViewConverter
                                     .getOptions(getContext(), imageSource, mSource)
                                     .placeholder(mDefaultSource) // show until loaded
-                                    .fallback(mDefaultSource)); // null will not be treated as error
+                                    .fallback(mDefaultSource)) // null will not be treated as error
+                            // What into() would apply for the scale type, with
+                            // the size capture.
+                            .apply(FastImageSourceSize.scaleTypeOptions(getScaleType(), capture));
 
             if (key != null)
-                builder.listener(new FastImageRequestListener(key));
+                builder.listener(new FastImageRequestListener(key, imageSource));
 
             builder.into(this);
         }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-fast-image",
-    "version": "8.6.32",
+    "version": "8.6.33",
     "description": "🚩 FastImage, performant React Native image component.",
     "keywords": [
         "cache",