Commit Graph

26 Commits

Author SHA1 Message Date
Reem Helou 9cb3ec9424 Add blur effect to RCTImageView
Summary: This diff introduces a blur radius property to the Image component on ios. If the radius specified is greater then 0 then native will apply a blur filter to the image

Reviewed By: nicklockwood

Differential Revision: D3054671

fb-gh-sync-id: d7a81ce5a08a3a2091c583f5053c6a86638b21b2
shipit-source-id: d7a81ce5a08a3a2091c583f5053c6a86638b21b2
2016-03-17 12:25:40 -07:00
Nick Lockwood 21fcbbc32c Generalized image decoding and resizing logic
Summary:
public

Standardises the image decoding logic for all image sources, meaning we get the benefits of efficient downscaling of images from all sources, not just ALAssets.

Reviewed By: javache

Differential Revision: D2647083

fb-gh-sync-id: e41456f838e4c6ab709b1c1523f651a86ff6e623
2016-01-20 11:11:13 -08:00
Nick Lockwood ce7c0b735f Fixed image tinting
Summary:
public

A previous refactor introduced a bug where setting the tintColor of an <Image> to null no longer cleared the tint. This fixes it again.

Reviewed By: javache

Differential Revision: D2744279

fb-gh-sync-id: 1b5e0d546bf456d7b93e2ceee73c568c185c305c
2015-12-10 09:09:30 -08:00
Nick Lockwood b672294858 Added RCTImageSource
Summary:
public

The +[RCTConvert UIImage:] function, while convenient, is inherently limited by being synchronous, which means that it cannot be used to load remote images, and may not be efficient for local images either. It's also unable to access the bridge, which means that it cannot take advantage of the modular image-loading pipeline.

This diff introduces a new RCTImageSource class which can be used to pass image source objects over the bridge and defer loading until later.

I've also added automatic application of the `resolveAssetSource()` function based on prop type, and fixed up the image logic in NavigatorIOS and TabBarIOS.

Reviewed By: javache

Differential Revision: D2631541

fb-gh-sync-id: 6604635e8bb5394425102487f1ee7cd729321877
2015-12-08 03:32:30 -08:00
Pawel Sienkowski 5367e841ad Weak RCTBridge reference in RCTImageView
Reviewed By: nicklockwood

Differential Revision: D2660517

fb-gh-sync-id: 45a5e2b936cfb4b87a09ad7a756c030376d59da3
2015-11-17 09:14:30 -08:00
Nick Lockwood 5b796cec34 Reduced work done on main thread by RCTImageLoader
Summary: public

Removed redundant calls to [RCTNetwork canHandleRequest] in release mode when loading images, and improved perf for handler lookups when running in debug mode.

Reviewed By: tadeuzagallo

Differential Revision: D2663307

fb-gh-sync-id: 13285154c1c3773b32dba7894d86d14992e2fd7d
2015-11-17 07:21:29 -08:00
Nick Lockwood 1d6d1189f0 Improved threading for image loader
Summary: public

The image loader was previously returning on the main thread, which could lead to poor performance due to various call sites doing further image processing (resizing, cropping, etc.) directly in the completion block.

This diff modifies the loader to return on a background thread (the same one used to load the image), and updates the call sites to dispatch to the explicit thread they need.

Reviewed By: javache

Differential Revision: D2549774

fb-gh-sync-id: fed73b7c163fdf67ff65bae72ab1986327e75815
2015-10-20 05:02:23 -07:00
Justin Spahr-Summers 123516d556 Reload RCTImageView when it's displaying the default image
Summary: public

If the frame is set, or the image view moves to a window, we should attempt to load the "real" image. The sizing logic shouldn't kick in if we're only displaying the default image.

Resolves https://github.com/facebook/react-native/issues/3460.

Reviewed By: tadeuzagallo

Differential Revision: D2555316

fb-gh-sync-id: c0c13070ee080bad2b30ca01d9d5173bead406e3
2015-10-19 10:26:24 -07:00
Nick Lockwood 91e6c98ecd Implemented inline image support for <Text>
Summary: @​public

This diff implements inline image support for <Text> nodes. Images are specified using <Image> tags, however all properties of the image are currently ignored apart from the source (including width/height styles).

Images are loaded asyncronously, and will trigger a text re-layout when they have loaded.

Reviewed By: @javache

Differential Revision: D2507725

fb-gh-sync-id: 59d0696d00a1bc531915cc35242a16b2dec96e85
2015-10-08 11:56:25 -07:00
Justin Spahr-Summers a4ef7abebb Wait to clear RCTImageView.image until definitively removed from window
Summary: When `RCTImageView` is removed from the view hierarchy, it clears out its `image` to save memory. This makes sense, except that it gets removed from the window (view hierarchy) even when becoming the child of another view.

This fixes the logic so that it only clears out the image if the view hasn't been moved somewhere else within one frame.

@​public

Reviewed By: @javache

Differential Revision: D2493849
2015-09-30 09:40:30 -07:00
Justin Spahr-Summers 3bbfab545a Log when RCTImageView reloads and when assets are scaled
Summary: This sort of logging helped me identify issues with reloading images too frequently (and for trivial reasons), so leaving it in might be useful for future optimization work, or for anyone building apps using these components.

@​public

Reviewed By: @alexeylang

Differential Revision: D2475613
2015-09-25 02:29:25 -07:00
Justin Spahr-Summers bcd2ef5dfc Improve RCTImageView resizing logic
Summary: @​public

It's less important to reload for downscaling than upscaling, so increase the threshold in that direction. Also, this now considers each dimension separately, and a big enough change either way should result in a reload.

Finally, this considers both the current image size and the inflight target size, so we don't reload if either is already good.

Reviewed By: @tadeuzagallo

Differential Revision: D2470911
2015-09-23 07:32:30 -07:00
Justin Spahr-Summers de85bcab0b Cancel previous calls to -[RCTImageView reloadImage] to prevent extra work
Reviewed By: @tadeuzagallo

Differential Revision: D2470902
2015-09-23 07:32:23 -07:00
Spencer Ahrens 1f6f60582d [RN] Prevent reloading library photos on every animation frame 2015-09-06 17:16:10 -08:00
Nick Lockwood e4110456ab Changed RCTImageLoader to always return a UIImage
Summary:
GIF images are currently loaded as a CAKeyframeAnimation, however returning this animation directly from RCTImageLoader was dangerous, as any code that expected a UIImage would crash.

This diff changes RCTGIFImageLoader to return a UIImage of the first frame, with the keyframe animation attached as an associated object. This way, code that is not expecting an animation will still work correctly.
2015-09-04 05:10:34 -08:00
Alex Akers 36444a65c7 Add pluggable image processing system 2015-09-02 08:31:34 -08:00
Nick Lockwood 848839858b Added mechanism for directly mapping JS event handlers to blocks
Summary:
Currently, the system for mapping JS event handlers to blocks is quite clean on the JS side, but is clunky on the native side. The event property is passed as a boolean, which can then be checked by the native side, and if true, the native side is supposed to send an event via the event dispatcher.

This diff adds the facility to declare the property as a block instead. This means that the event side can simply call the block, and it will automatically send the event. Because the blocks for bubbling and direct events are named differently, we can also use this to generate the event registration data and get rid of the arrays of event names.

The name of the event is inferred from the property name, which means that the property for an event called "load" must be called `onLoad` or the mapping won't work. This can be optionally remapped to a different property name on the view itself if necessary, e.g.

  RCT_REMAP_VIEW_PROPERTY(onLoad, loadEventBlock, RCTDirectEventBlock)

If you don't want to use this mechanism then for now it is still possible to declare the property as a BOOL instead and use the old mechanism (this approach is now deprecated however, and may eventually be removed altogether).
2015-09-02 06:11:24 -08:00
Nick Lockwood 88e0bbc469 Ran Convert > To Modern Objective C Syntax 2015-08-25 01:08:49 -08:00
Nick Lockwood 7232b1bbc7 Fixed image clipping / resizing logic 2015-08-13 08:13:55 -08:00
Tom Hastjarjanto 2424a215e0 [Image] Fix default Image functionality
Summary:
In the latest 0.9.0-rc of React Native, the default image won't load due to a typo and a missing condition in `setImage`. This PR contains fixes for both of them.
Closes https://github.com/facebook/react-native/pull/2269
Github Author: Tom Hastjarjanto <tom@intellicode.nl>
2015-08-11 05:19:04 -08:00
Alex Akers bb883bfb61 Update offscreen image fix with window checking
Summary:
2015-08-04 08:05:12 -08:00
Nick Lockwood 1d852624fd Refactored RCTImageDownloader to use RCTNetworking instead of a separate download system 2015-07-27 13:47:52 -08:00
Nick Lockwood 2c5290946b Converted RCTImageLoader to be a bridge module 2015-07-27 08:52:20 -08:00
Alex Akers 98ab7581a5 Remove images from offscreen image views 2015-07-21 09:02:28 -08:00
Philipp von Weitershausen 151ddd9e42 [React Native] open source ImageStoreManager native module and plug into RCTImageLoader 2015-07-20 22:48:54 -08:00
Nick Lockwood 61c648d564 Merged RCTNetworkImageView functionality into RCTStaticImage
Summary:
RCTNetworkImageView and RCTStaticImage had significant overlap in functionality, but each had a different subset of features and bugs.

This diff merges most of the functionality of RCTNetworkImageView into RCTStaticImage, eliminating some bugs in the former, such as constant redrawing when properties were changed.

I've also removed the onLoadAbort event for now (as it wasn't implemented), and renamed the other events to match the web specs for `<img>` and XHMLHttpRequest. The API is essentially what Adobe proposed here: http://blogs.adobe.com/webplatform/2012/01/13/html5-image-progress-events/

The following features have not yet been ported from RCTNetworkImageView:

- Background color compositing. It's not clear that this adds much value and it increases memory consumption, etc.
- Image request cancelling when images are removed from view. Again, it's not clear if this is a huge benefit, but if it is it should be combined with other optimisations, such as unloading offscreen images.

(Note that this only affects the open source fork. For now, internal apps will still use FBNetworkImageView for remote images.)
2015-07-17 07:43:16 -08:00