Commit Graph

261 Commits

Author SHA1 Message Date
Douglas Lowder 8622998335 Apple TV support 2: Xcode projects and CI (scripts/objc-test.sh)
Summary:
* Motivation *

Second PR for Apple TV support.

* Test plan *

Apple TV tests have been added to scripts/objc-test.sh
Closes https://github.com/facebook/react-native/pull/10227

Differential Revision: D3974064

Pulled By: javache

fbshipit-source-id: 36dffb4517efa489e40fa713a30655d1d76ef646
2016-10-05 07:28:44 -07:00
Mattias Pfeiffer b2dac834fb Use strong reference in RCTImageLoader
Summary:
This PR is related to the multitude of crashes (#10016, #9751, #9882).

From my understanding, we should be using a strong reference when calling `decodeImageData` or we could be calling the method on a deallocated instance.

PR #9751 have mitigated this by adding a fail-safe, but I think the culprint is the weak reference, which this PR fixes.

Tested on iOS only, since it doesn't touch Android.
Closes https://github.com/facebook/react-native/pull/10147

Differential Revision: D3938763

fbshipit-source-id: 7389d4ae7a98926014401a1fe0cbbdcdd5ee6a01
2016-09-28 13:28:35 -07:00
Toby Cox 1a62b66c51 FIX #9751 - Cancelling offscreen image loads causing crashes
Summary:
This fixes https://github.com/facebook/react-native/issues/9751

We were seeing the same issues as the original reporter.

I'm not an expert on this code, so apologies if it's naive, but we haven't seen the crash since making this change.

From my understanding of it, it seems like the `cancelLoad` block was being released before the block returned by `_loadImageOrDataWithURLRequest:` was called.
This PR checks the `cancelled` flag before calling `cancelLoad()`.
Closes https://github.com/facebook/react-native/pull/10016

Differential Revision: D3902723

Pulled By: javache

fbshipit-source-id: 75cd115e28694105c6fc29469986998ca0d4cd09
2016-09-21 14:28:43 -07:00
Mehdi Mulani 820b1c0e46 Add partial image loading to RCTImageView
Reviewed By: javache

Differential Revision: D3856918

fbshipit-source-id: ca98f8604213e7e583a188ccc4c25ea9d7aa9aa2
2016-09-21 12:14:09 -07:00
leeight 3182b608fc Fix invalid package name and Remove unsupported prop in Image.android.js
Summary:
1. `textfrescosupport` -> `text.frescosupport`
2. `defaultImageSrc`, `imageTag` and `progressHandlerRegistered` looks like never exists in `ReactImageManager.java`
Closes https://github.com/facebook/react-native/pull/9885

Differential Revision: D3864980

fbshipit-source-id: 48a85563c60b6853c505177558520f5e48f4eb03
2016-09-14 13:43:48 -07:00
Adam Comella b6735f3391 Enable developers to force Fresco to resize an image
Summary:
Here's a little background. Resizing is inferior to scaling. See http://frescolib.org/docs/resizing-rotating.html#_

Currently, React Native has a heuristic to use resize when the image is likely to be from the device's camera. However, there may be other cases where a developer wants to use resize. For example, when the developer knows they'll be downloading a large image from a service but the image will be rendered at a small size on the device.

This change adds a `resizeMethod` prop to the `Image` component so developers can choose how Fresco resizes the image. The options are 'auto', 'resize', or 'scale'. When 'auto' is specified, a heuristic is used to choose between 'resize' and 'scale'. The default value is 'auto'.

**Test plan (required)**

In a small test app, verified that the `resizeMethod` prop properly influences the mechanism that is used to resize the image (e.g. resize or scale).

Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/9652

Differential Revision: D3841322

Pulled By: foghina

fbshipit-source-id: 6c78b5c75ea73053aa10386afd4cbff45f5b8ffe
2016-09-09 05:13:53 -07:00
Pieter De Baets 3efe95d989 Fix images not reloading after memory warning
Reviewed By: mmmulani

Differential Revision: D3816779

fbshipit-source-id: edccb41a38fff3b2c143ffb3cbe0a7001ee16331
2016-09-06 09:28:35 -07:00
Pieter De Baets 07553d0f1c Update React Native minimum OS version to iOS8
Reviewed By: majak

Differential Revision: D3723143

fbshipit-source-id: 482f9820370b752d937e6df7f74c33d53a0a2e7d
2016-09-01 19:43:47 -07:00
Pieter De Baets 46b54fd7a8 Support bundle argument for image loading
Reviewed By: mmmulani

Differential Revision: D3768798

fbshipit-source-id: 5b35f06957cebfe74aca90fe6a456f7f739509a9
2016-08-31 17:43:49 -07:00
Felix Oghina 69c889815e Expose image cache interrogation to JS
Summary: Add a static `Image.queryCache` function that can query multiple URLs at once. The result is a map where each URL that is in cache is mapped to the cache type (memory/disk). URLs that are not cached do not appear in the result.

Reviewed By: lexs

Differential Revision: D3791333

fbshipit-source-id: b183015d97423f0c095bf891f035dac2e23d8d11
2016-08-31 05:13:39 -07:00
Pieter De Baets 3fb76696bb Fix setImage clownyness
Reviewed By: mmmulani

Differential Revision: D3785608

fbshipit-source-id: eab547ae2724efde5aeb3855ab15610875d63dcd
2016-08-29 11:28:52 -07:00
Pieter De Baets 6f7898ee09 Avoid reloading images that are already the source size
Reviewed By: majak

Differential Revision: D3755114

fbshipit-source-id: 112fa6c8fe13d1070855d3e57f0009afe1b53038
2016-08-26 13:59:05 -07:00
Pieter De Baets 86fbf2386b Avoid sending out multiple requests for the same image
Reviewed By: majak

Differential Revision: D3755074

fbshipit-source-id: fea782fcb99e6b977fb52231d378aaab4685d480
2016-08-26 13:59:05 -07:00
Pieter De Baets bfa01f0d15 Rename RCTImageView source to imageSources
Reviewed By: majak

Differential Revision: D3754991

fbshipit-source-id: 9794af94b51b331df1209ae63d053dcef2cf4a97
2016-08-23 11:28:42 -07:00
Pieter De Baets 84f68c338a Send down image source to RCTImageView onLoad callback on iOS
Summary: This allows the onLoad callback to know which image has actually loaded. This is only for iOS at the moment - implementing this for Android will require quite a bit more work.

Reviewed By: majak

Differential Revision: D3738759

fbshipit-source-id: b1fc2bd0dc5de90096debeab02b8f795739a4547
2016-08-22 10:58:49 -07:00
Pieter De Baets 14188289fc Add some defensive cleanup of cancelBlock in RCTImageLoader
Reviewed By: mmmulani

Differential Revision: D3742177

fbshipit-source-id: 1cd16c2519052ec5811ecadf2530a5846b4ae1bc
2016-08-19 10:46:09 -07:00
Alon Schwarz 862b6570ee Add 'center' to the allowed values in Android Image.resizeMode proptype
Reviewed By: foghina

Differential Revision: D3703258

fbshipit-source-id: fc2546a8c2e595ec51416f3453a12d087cc68515
2016-08-16 04:15:03 -07:00
Alexander Jarvis 7cdd4c9a75 Fix image source prop change updating image
Summary:
fixes #7795
fixes #8500

Motivation: When having a simple button that changes the Image source when tapped, the image doesn't change (or at least sometimes, intermittently it works).

This was found to be an issue where the request was being sent to the native layer correctly but then being subsequently cancelled by the `reactSetFrame: method`  ...
Closes https://github.com/facebook/react-native/pull/9137

Differential Revision: D3702867

Pulled By: javache

fbshipit-source-id: c89ce6b841179394b6b23850b3128751ef9e0313
2016-08-11 03:28:40 -07:00
David Aurelio 94666f16c7 Auto-fix lint errors
Reviewed By: bestander

Differential Revision: D3683952

fbshipit-source-id: 9484d0b0e86859e8edaca0da1aa13a667f200905
2016-08-09 06:43:46 -07:00
Gant eba6c379c3 - Update remote image example
Summary:
I've seen quite a few newbs trip on this, so I'm fixing it.

First - you have to set the width/height on a remote image, otherwise nothing shows.  This is [even on stack overflow](http://stackoverflow.com/questions/30091398/unable-to-display-image-with-react-native-with-uri).

Second - with the addition of ATS in iOS most people who copy/paste this example will not be able to load an insecure image, so I changed it to the `https`.

**RESULT** this doc becomes copy/paste friendly again for beginners.
Closes https://github.com/facebook/react-native/pull/9235

Differential Revision: D3675478

Pulled By: JoelMarcey

fbshipit-source-id: 5b414caa40cda72dec4eace686278c26c251c4bb
2016-08-05 08:58:32 -07:00
Konstantin Raev 8419faa365 Fixed test CRMNowThumbnailCache-test.js
Reviewed By: matryoshcow

Differential Revision: D3662150

fbshipit-source-id: 29cb7ee52ba8dc67ecf2214ff92b2f97711debf0
2016-08-03 06:13:29 -07:00
Maria Mateescu 2a823bbc5c Add custom cache setter
Reviewed By: donyu

Differential Revision: D3622912

fbshipit-source-id: 675b3135212c73808cb18702c2cbf5684816df87
2016-08-01 22:13:27 -07:00
Jimmy Mayoukou f634a0fc23 Add missing resizeMode prop on Image Android
Summary:
It seems like the `resizeMode` propType was missing from `Image.android.js`, this PR adds it.
I caught by trying to use `Image.propTypes.resizeMode` on Android, and getting a warning because it was `undefined`.

It's not supposed to break anything, maybe pop a few warnings but not much more.

**Test Plan:**
- Launched UIExplorer
Closes https://github.com/facebook/react-native/pull/7355

Differential Revision: D3648559

fbshipit-source-id: a4397938d14c11ded909d6bf4652a4b0fcebed3b
2016-08-01 00:58:27 -07:00
Nicolas Charpentier 55bc825092 Add GIF and WebP support specification with Fresco 0.11
Summary:
Motivation #8455
Fixes #8501

With a bonus fix typo !

![screen shot 2016-07-25 at 14 16 01](https://cloud.githubusercontent.com/assets/7189823/17112118/9f06fe04-5272-11e6-83e9-ddf11573aa5e.png)
Closes https://github.com/facebook/react-native/pull/8951

Differential Revision: D3647816

Pulled By: mkonicek

fbshipit-source-id: e0349275045cae2922b4bb43bcb99af4c6ef1170
2016-07-31 08:13:27 -07:00
Maria Mateescu 3561dbb74d Unbreak compiling error - sorry
Reviewed By: bestander

Differential Revision: D3641418

fbshipit-source-id: fa131761b65a19ed0fc821dd52852480f2ed0c2d
2016-07-29 07:13:43 -07:00
David Goldman fd48bc3cff Implement multi-source Images on iOS
Summary: Mirrors Android's support for multiple sources for Image, allowing us to fetch new images as the size of the view changes.

Reviewed By: mmmulani

Differential Revision: D3615134

fbshipit-source-id: 3d0bf2b75f63a4379e0e49f2dab9aea351b31d5f
2016-07-28 14:13:46 -07:00
Maria Mateescu ddc70ffd85 Plug in the Cache to the ImageLoader
Reviewed By: donyu

Differential Revision: D3586563

fbshipit-source-id: 03f457df97066a522dc923b5f432314da40f7d71
2016-07-28 08:58:35 -07:00
Maria Mateescu 54244e15bf Define the Image Cache delegate to be used in the ImageLoader
Reviewed By: javache

Differential Revision: D3583472

fbshipit-source-id: d1f30f3f96aea7739b9f91093fbb6c92c8b9567e
2016-07-28 08:58:34 -07:00
Maria Mateescu f12d0a220b Create protocol for delegate for image cacheing
Reviewed By: donyu

Differential Revision: D3581390

fbshipit-source-id: 869437dd05db614f8191eab69723c4742df0637b
2016-07-28 08:58:34 -07:00
Nathan Azaria ffb690f072 Fix RCTImageLoader's priority
Summary:
There is a conflict between RCTImageLoader and RCTAssetsLibraryRequestHandler on handling images, which was caused by making RCTPhotoLibraryImageLoader able to handle assets library requests as well. This gives more priority to RCTImageLoader instead.
Fixes #9031.

Reviewed By: mmmulani

Differential Revision: D3627451

fbshipit-source-id: 7ffd2c66f43ce1479c9a117768fb2d29f9d0dc08
2016-07-27 06:13:20 -07:00
Konstantin Raev 64b09290f7 Reverted commit D3604593
Differential Revision: D3604593

fbshipit-source-id: fe792739dbe4af294ef0071b4db4ab181adcb874
2016-07-23 00:28:27 -07:00
Scott Wolchok eb59ae8423 Set trackingName for RCTImageLoader requests
Reviewed By: javache

Differential Revision: D3600853

fbshipit-source-id: 46ef2d0e54e4ce417cc3d4138c8d8f60d5c34173
2016-07-22 16:58:33 -07:00
Olivier Notteghem 32a717892c safeguard for missing ImageLoader native module
Differential Revision: D3604593

fbshipit-source-id: f7f77bfb01ca51e660b68945ff7271a492df1bcb
2016-07-22 13:13:40 -07:00
skatpgusskat 631785f2ee Change RCTImageLoader's Cache System to default NSURLRequest's cache system
Summary:
Before this PR, ```RCTImageLodaer```'s Cache was too big(200MB on disk) and It doesn't work with HTTP Cache-Control header. So to provide dynamic image, the users must have to add random value on url( ex. adding current date) to avoid cache.

So I change that cache system to default ```NSURLRequest```'s cache system, which is well-working with HTTP specs. As the discussion on this issue #7571 , making custom cache policy processor is not ready yet and useless, over-tech things, I think.

Even we have no plan about image cache system(or would change plan later), before having a nice plan, I think we should let user use image module with common HTTP Specs.

So I remove custom ```NSURLCache```, and make logic like below,

1. try fetch image,

2. on response, get ```Date``` on response's header and make ```cacheKey``` with ```Date```.
> (why? because if ```NSURLRequest```'s response was cached, the response's ```Date``` header dosen't change.)

3. find decoded imag
Closes https://github.com/facebook/react-native/pull/8235

Reviewed By: bnham

Differential Revision: D3469086

Pulled By: javache

fbshipit-source-id: 35a5552cda6e6c367481020bbf3c28eb4a9d0207
2016-07-21 07:58:51 -07:00
Janic Duplessis 5903949ad6 Load local assets synchronously to prevent image flicker
Summary:
This uses `[UIImage imageNamed:]` to load local assets that are bundled using `require('../image/path.png')` and makes sure it is done synchronously on the main queue to prevent images from flickering. This improves user experience a lot when using large local images and prevents icon flickers to match the behaviour of most native apps.

This adds to methods to the ImageLoader protocol, one to tell if the image loader must be executed on the url cache queue and one to tell if the result of the image loader should be cached. I then use these to make the LocalImageLoader bypass the url cache queue and avoid caching images twice.

Note that this doesn't affect debug builds since images are loaded from the packager.

I'm not sure if we want to still support async loading of local images as I'm not sure how much of a perf difference this will make. Maybe someone at fb can benchmark this see how it affects your apps but there wasn't a noticeable one in mine. Also I only enabled this for loading png and jpg im
Closes https://github.com/facebook/react-native/pull/8102

Reviewed By: bnham

Differential Revision: D3433647

Pulled By: javache

fbshipit-source-id: 37bd6aff20c0465c163db3cdbcaeaedff55f7b1f
2016-07-21 07:58:51 -07:00
Pieter De Baets 7e5de707be Remove deprecated RCTImageLoader methods
Reviewed By: mmmulani

Differential Revision: D3586474

fbshipit-source-id: b2be11d3673c3db1f3a79e0c4abfead8c988d82a
2016-07-21 07:58:51 -07:00
aleclarsoniv bee118096b Add Image resizeMode center to iOS
Summary:
Addresses this comment: https://github.com/facebook/react-native/issues/2296#issuecomment-232446493

This pull request adds the `center` value to `ImageResizeMode`.
When set, it will center the image within its frame.
If the image is larger than its frame, the image is downscaled while maintaining its aspect ratio.
That is how the Android implementation works, too.

Sorry, don't have time to write tests. 😢

Any reviewers should make sure `RCTTargetRect` returns the correct value when:
- the image is smaller than its frame (ie: no downscaling needed)
- the image is larger than its frame (should be downscaled to avoid clipping)
Closes https://github.com/facebook/react-native/pull/8792

Differential Revision: D3586134

Pulled By: javache

fbshipit-source-id: 78fb8e5928284003437dac2c9ad264fa584f73ec
2016-07-19 03:43:26 -07:00
Olivier Notteghem e27c1495bd network congestion improvements (part 1)
Reviewed By: dmmiller

Differential Revision: D3553287

fbshipit-source-id: ea33bb7d929cbc0229bfe8537c3a4fc58fe9691e
2016-07-18 12:13:29 -07:00
Pieter De Baets 7fa677f7c3 Add MessageQueue method for executing function and returning its result
Reviewed By: majak

Differential Revision: D3175793

fbshipit-source-id: e1e66e3dcde8b1fb35973340e12d947a0e955775
2016-07-18 07:13:32 -07:00
yeshuang ca5d1aebab Defend against nil pointer in RCTImageLoader.m
Summary:
Defend against nil pointer in RCTImageLoader.m. In some rare case, the "response" might be nil, and this would lead to crash.

This issue is related: https://github.com/facebook/react-native/issues/6952
Closes https://github.com/facebook/react-native/pull/8141

Differential Revision: D3579427

Pulled By: javache

fbshipit-source-id: 7b71768a0c6d74a42d280b1d54adda86b493f0ef
2016-07-18 04:58:29 -07:00
Jesse Luo f317b9f28f Fix misusage of NSUInteger * in RCTImageStoreManager
Summary:
I would like to believe it's some black magic code but no it's just a typo.
Closes https://github.com/facebook/react-native/pull/8712

Differential Revision: D3550809

fbshipit-source-id: 00a7ba1cbcd36e29af44cdefd5fc1148d11d26e3
2016-07-12 13:58:28 -07:00
Pieter De Baets ff3ab32a72 Cleanup RCTImageLoader weakSelf/strongSelf
Reviewed By: mmmulani

Differential Revision: D3542393

fbshipit-source-id: b241586b0da254f688d0e8bdbf7d4ce72dc0d21f
2016-07-11 13:34:00 -07:00
Skotch Vail bcf4bb6edd Automated changes to remove implicit capture of self in blocks: Libraries/FBReactKit/BUCK
Reviewed By: javache

Differential Revision: D3442470

fbshipit-source-id: 584a2bb3df5f7122166778b8fd44fae45560491e
2016-07-07 12:44:14 -07:00
David Aurelio bd60d828c5 Remove `node_modules/react` from the list of discoverable haste modules
Summary: This removes `node_modules/react` from the list of directories that are used for haste module resolutions. Modules required from React are now imported with `require('react/lib/…')`.

Reviewed By: astreet

Differential Revision: D3509863

fbshipit-source-id: 32cd34e2b8496f0a6676dbe6bb1eacc18124c01e
2016-07-05 06:44:33 -07:00
Christoph Pojer 7c53addcd5 First snapshot test, rendering "native" React component.
Reviewed By: frantic

Differential Revision: D3449781

fbshipit-source-id: 7abf9280f98cee06d04d7e222b884de1744afb8d
2016-06-29 21:58:17 -07:00
Jean Regisser 7f9ec4e4c8 Fixed incorrect style props passed to Android Image when using children
Summary:
Hi there,

Here is a fix for #7538 (and #5085).

I had originally discovered this issue when using `resizeMode` through the style props. Although this might arguably be an incorrect usage (see https://github.com/facebook/react-native/issues/4759#issuecomment-164301166) the same issue would happen with the `tintColor` and `overlayColor` style props.

To  test this, you can render the following:

```jsx
const imageContainerStyle = {width: 100, height: 100, backgroundColor: 'green', marginLeft: 10, marginTop: 10, };
const imageStyle = {flex: 1, width: undefined, height: undefined, resizeMode: 'contain', };

return (
  <View style={styles.container}>
    <View style={imageContainerStyle}>
      <Image style={imageStyle} source={
        {uri:'http://resizing.flixster.com/DeLpPTAwX3O2LszOpeaMHjbzuAw=/53x77/dkpu1ddg7pbsk.cloudfront.net/movie/11/16/47/11164719_ori.jpg'}
      }>
      </Image>
    </View>
    <View style={imageContainerStyle}>
      <Image style={imageStyle} source={
        {
Closes https://github.com/facebook/react-native/pull/8410

Differential Revision: D3488010

Pulled By: andreicoman11

fbshipit-source-id: e9d1283cce8426c8878f9c3c66a43a2141232277
2016-06-27 03:28:31 -07:00
Joel Marcey db7b44ec8e Update Image API
Summary:
- Provide runnable examples
- Add more details to properties and jsdoc-ify the methods

Ref #8203
Closes https://github.com/facebook/react-native/pull/8413

Differential Revision: D3482168

Pulled By: caabernathy

fbshipit-source-id: 04fce5133317af282cced5850a53858e3f5b72f2
2016-06-24 10:43:31 -07:00
wenzhao.yin a87c9d5c2c Fix GIF Disappear when return from background
Summary:
GIF Image will disappear after press the home button and return back.
Set `removedOnCompletion` to be`false` will fix  all `CAAnimation` disappear like stopping after going into the background.
Closes https://github.com/facebook/react-native/pull/7612

Differential Revision: D3481403

fbshipit-source-id: 101bded300f5e34bb53ec6c54a40eb5aece22fba
2016-06-24 03:28:24 -07:00
Janic Duplessis 4c83237511 Add Image resizeMode repeat on iOS
Summary:
This adds a new resize mode for iOS 'repeat' that tiles the image over it's frame. This allow to easily create a view with a repeating background pattern which there is no way to do at the moment without including a bunch of different sized assets.

I'm not 100% sure it should be a resizeMode or a separate prop but I went with resizeMode since it made more sense to me and the are not really any use cases where we'd want to use this with another resizeMode other than 'stretch'.

**Test plan**

Tested mainly by adding a UIExplorer example, also tested that changing the resizeMode prop from and to 'repeat' worked properly.
![screen shot 2016-06-07 at 3 06 17 am](https://cloud.githubusercontent.com/assets/2677334/15848755/d95d8046-2c5c-11e6-9f3d-1ce8a1c9c846.png)

I'd like to implement this on Android too but it is a bit trickier since Fresco's ImageView doesn't support image tiling and would require submitting a PR there too :(
Closes https://github.com/facebook/react-native/pull/7968

Differential Revision: D3469119

Pulled By: javache

fbshipit-source-id: ab9dbfe448a5b0771dbf0c41fcceeb366210f583
2016-06-22 04:28:44 -07:00
Andrei Coman 617a38d984 Support multi sources for images
Summary:
This adds support for specifying multiple sources for an image component, so that native can choose the best one based on the flexbox-computed size of the image.
The API is as follows: the image component receives in the `source` prop an array of objects of the type `{uri, width, height}`. On the native side, the native component will wait for the layout pass to receive the width and height of the image, and then parse the array to find the best fitting one. For now, this does not support local resources, but it will be added soon.
To see how this works and play with it, there's an example called `MultipleSourcesExample` under `ImageExample` In UIExplorer.

Reviewed By: foghina

Differential Revision: D3364550

fbshipit-source-id: 66c5aeb2794f2ffeff8da39a9c0b95155fb2d41f
2016-06-13 14:13:25 -07:00