Commit Graph

502 Commits

Author SHA1 Message Date
Nikita Tuk 15179f1798 Fixed fractional border width on iOS
Summary:
Incorrect render for borders that are not proportional to device pixel: borders get stretched and become significantly bigger than expected.
Rdar: http://www.openradar.me/15959788

Incorrect render for borders that are not proportional to device pixel: borders get stretched and become significantly bigger than expected.
Rdar: http://www.openradar.me/15959788

Reviewed By: shergin

Differential Revision: D6317674

fbshipit-source-id: 6bc331447458583a02c0e56d0d011a31d31d70a8
2017-11-21 12:16:21 -08:00
Douglas 45185947ee Fix tvOS compile issues; enable TVEventHandler in Modal (fix #15389)
Summary:
**Motivation**

Fix an issue (#15389) where `TVEventHandler` would not work when a modal was visible.  The solution adds the gesture recognizers from the native `RCTTVRemoteHandler` to the native modal view (except for the menu button recognizer, which still needs special handling in modals).  This PR also fixes some breakages in compiling React Native for tvOS.

**Test plan**

Compilation fixes should enable tvOS compile test to pass in Travis CI.

The modal fix can be tested with the following component, modified from the original source in #15389 .

``` javascript
import React, { Component } from 'react';
import ReactNative from 'ReactNative';
import {
    Text,
    View,
    StyleSheet,
    TouchableHighlight,
    TVEventHandler,
    Modal,
} from 'react-native';

export default class Events extends Component {

    constructor(props) {
        super(props);

        this.state = {
            modalVisible: false,
        };
        this._tvEventHandler = new TVEventHandler();
    }

    _enableTVEventHandler() {
        this._tvEventHandler.enable(this, (cmp, evt) => {
            const myTag = ReactNative.findNodeHandle(cmp);
            console.log('Event.js TVEventHandler: ', evt.eventType);
            // if (evt.eventType !== 'blur' && evt.eventType !== 'focus') {
            //  console.log('Event.js TVEventHandler: ', evt.eventType);
            // }
        });
    }

    _disableTVEventHandler() {
        if (this._tvEventHandler) {
            this._tvEventHandler.disable();
            delete this._tvEventHandler;
        }
    }

    componentDidMount() {
        this._enableTVEventHandler();
    }

    componentWillUnmount() {
        this._disableTVEventHandler();
    }

    _renderRow() {
        return (
            <View style={styles.row}>
                {
                    Array.from({ length: 7 }).map((_, index) => {
                        return (
                            <TouchableHighlight
                                key={index}
                                onPress={() => { this.setState({ modalVisible: !this.state.modalVisible }); }}
                            >
                                <View style={styles.item}>
                                    <Text style={styles.itemText}>{ index }</Text>
                                </View>
                            </TouchableHighlight>
                        );
                    })
                }
            </View>
        );
    }

    onTVEvent(cmp, evt) {
      console.log('Modal.js TVEventHandler: ', evt.eventType);
    }

    hideModal() {
      this.setState({
        modalVisible: false
      });
    }

    render() {
        return (
            <View style={styles.container}>
                <Modal visible={this.state.modalVisible}
                       onRequestClose={() => this.hideModal()}>
                    <View style={styles.modal}>
                        { this._renderRow() }
                        { this._renderRow() }
                    </View>
                </Modal>
                { this._renderRow() }
                { this._renderRow() }
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'darkslategrey',
    },
    row: {
        flexDirection: 'row',
        padding: 30,
    },
    item: {
        width: 200,
        height: 100,
        borderColor: 'cyan',
        borderWidth: 2,
        margin: 30,
        alignItems: 'center',
        justifyContent: 'center',
    },
    itemText: {
        fontSize: 40,
        color: 'cyan',
    },
    modal: {
        flex: 1,
        backgroundColor: 'steelblue',
    },
});
```
**Release Notes**

After this change, the `onRequestClose` property will be required for a `Modal` in Apple TV.
Closes https://github.com/facebook/react-native/pull/16076

Differential Revision: D6288801

Pulled By: hramos

fbshipit-source-id: 446ae94a060387324aa9e528bd93cdabc9b5b37f
2017-11-09 13:54:54 -08:00
Vojtech Novak 75d62bf0a8 fix #10747 (ScrollView rendered incorrectly with RefreshControl)
Summary:
set the y offset to 0, since 0 offset is where we want to be after we hide the refreshControl.

Tested in emulator with ios 8, 9, 10 and also with section headers.
Closes https://github.com/facebook/react-native/pull/15033

Differential Revision: D6265930

Pulled By: shergin

fbshipit-source-id: b249c4713de68fc6b3a32cee7f995dc352315970
2017-11-07 16:16:56 -08:00
Robert Paul fd9c3618fc - Adding locale prop to DatePickerIOS
Summary:
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.

Help us understand your motivation by explaining why you decided to make this change.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

While building a React Native application, I've come across the use case of wanting to set a specific locale for DatePickers irrespective of the users OS region setting. Since this is a feature available to native DatePicker components, I think it would be helpful to expose this in React Native as well.

Testing can be done by passing a `locale` prop to a DatePickerIOS. Example:

```
<DatePickerIOS
  date={this.state.date}
  mode="date"
  locale="fr_FR"
  onDateChange={date => this.setState({ date: date })}
/>
```

<!--
Help reviewers and the release process by writing your own release notes

**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**

  CATEGORY
[----------]        TYPE
[ CLI      ]   [-------------]      LOCATION
[ DOCS     ]   [ BREAKING    ]   [-------------]
[ GENERAl  ]   [ BUGFIX      ]   [-{Component}-]
[ INTERNAL ]   [ ENHANCEMENT ]   [ {File}      ]
[ IOS      ]   [ FEATURE     ]   [ {Directory} ]   |-----------|
[ ANDROID  ]   [ MINOR       ]   [ {Framework} ] - | {Message} |
[----------]   [-------------]   [-------------]   |-----------|

[CATEGORY] [TYPE] [LOCATION] - MESSAGE

 EXAMPLES:

 [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
 [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
 [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
 [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
 [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
 [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
[IOS][ENHANCEMENT][DatePickerIOS] - Adding a locale prop.
Closes https://github.com/facebook/react-native/pull/16639

Differential Revision: D6241981

Pulled By: hramos

fbshipit-source-id: 77b1b85c09f3e12d6b3e103b3d1ffd1f12e2cea9
2017-11-04 14:40:24 -07:00
Mehdi Mulani b8a5136d22 Fix memory leak in RCTSafeAreaView
Summary:
According to the retain code collector, RCTSafeAreaView is in a cycle:
-> _bridge -> RCTCxxBridge -> _moduleDataByName -> __NSDictionaryM -> RCTModuleData -> _instance -> RCTUIManager -> _viewRegistry -> __NSDictionaryM -> RCTSafeAreaView
This should break the cycle.

Reviewed By: shergin

Differential Revision: D6213668

fbshipit-source-id: efb9c1dd148b72f66fe4485b81c16cd4c2d18b17
2017-11-02 08:51:34 -07:00
Y.Shing 2546c95ac8 Fix iOS 11 WebView extra white space on top due to contentInsetAdjustmentBehavior
Summary:
Same IOS 11 issue as https://github.com/facebook/react-native/pull/15023
Fixes the annoying 20px content insert on top.
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.

Help us understand your motivation by explaining why you decided to make this change.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

Fix the behaviour of WebView when building the iOS project with Xcode 9 due to the `contentInsetAdjustmentBehavior`.

![expected](https://user-images.githubusercontent.com/5630513/32207551-b7789668-bdca-11e7-840a-f325b2767d08.jpg)
![iphone_x_after](https://user-images.githubusercontent.com/5630513/32207557-beb8fd6e-bdca-11e7-87d0-18d533f20125.jpg)

![issue_normal_iphone_ios11](https://user-images.githubusercontent.com/5630513/32207572-d773be5c-bdca-11e7-8e28-8f0783eef1cd.jpg)
![iphone_x_before](https://user-images.githubusercontent.com/5630513/32207581-e3e93234-bdca-11e7-847d-f801bbf05d55.jpg)

<!--
Help reviewers and the release process by writing your own release notes

**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**

  CATEGORY
[----------]        TYPE
[ CLI      ]   [-------------]      LOCATION
[ DOCS     ]   [ BREAKING    ]   [-------------]
[ GENERAl  ]   [ BUGFIX      ]   [-{Component}-]
[ INTERNAL ]   [ ENHANCEMENT ]   [ {File}      ]
[ IOS      ]   [ FEATURE     ]   [ {Directory} ]   |-----------|
[ ANDROID  ]   [ MINOR       ]   [ {Framework} ] - | {Message} |
[----------]   [-------------]   [-------------]   |-----------|

[CATEGORY] [TYPE] [LOCATION] - MESSAGE

 EXAMPLES:

 [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
 [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
 [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
 [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
 [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
 [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
 [IOS] [BUGFIX] [WebView] - Fix extra white space added to webView due to iOS 11 contentInsetAdjustmentBehavior
Closes https://github.com/facebook/react-native/pull/16519

Differential Revision: D6195670

Pulled By: shergin

fbshipit-source-id: 08d4d4dc700059bb7707e038dc4f592af0275896
2017-10-30 23:29:20 -07:00
Aditya Kumar bbc90b4dc2 Move RCTConvertSelectorForType to their respective using modules
Reviewed By: javache

Differential Revision: D6137419

fbshipit-source-id: a30193469e7a061331d3d6798324475890c75625
2017-10-26 17:03:41 -07:00
Ramanpreet Nara efa4d3c222 Rename I18nManager Left/Right swap methods
Reviewed By: fkgozali

Differential Revision: D6140072

fbshipit-source-id: 282dc614c036de8f217a729f21a1bbe92b8afd7d
2017-10-24 20:45:59 -07:00
Sam Mueller d38b95f8b7 (iOS) Support for ExtraBold alias of Heavy (font-weight 800)
Summary:
ExtraBold is a fairly common suffix in font naming. A good example is "Circe-ExtraBold". It's usually synonymous with Heavy or Black at font weight 800, as described here: https://www.webtype.com/info/articles/fonts-weights/

This fixes a regression with ExtraBold fonts introduced in d3007b0 where simply having an extrabold font will cause `weightOfFont` to choose this weight aggressively, resulting in all bold text erroneously interpreted as extrabold/heavy. This fix ensures that extrabold is detected before bold, and correctly attributed to `UIFontWeightHeavy`.
Closes https://github.com/facebook/react-native/pull/16323

Differential Revision: D6119059

Pulled By: shergin

fbshipit-source-id: 56a5c30584f220974308a7d6068c8d952aa20fb8
2017-10-23 11:24:18 -07:00
Ramanpreet Nara 64284bf66e iOS: Implement margin(Start|End) styles for RN
Reviewed By: mmmulani

Differential Revision: D5884168

fbshipit-source-id: 4d37583ba79324e6cf8caaa20cecf865f28337f7
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 0a70c026cb iOS: Implement padding(Start|End) styles for RN
Reviewed By: mmmulani

Differential Revision: D5876934

fbshipit-source-id: 55fc49e0fddeaf0e6541d3159f35783e02bd6260
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 1b5f8d3ee5 iOS: Implement border(Top|Bottom)(Start|End)Radius and border(Start|End)(Color|Width) RN styles
Reviewed By: shergin

Differential Revision: D5874536

fbshipit-source-id: 5ad237bddb70745aef0341cddb172da5ee388c38
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 38b5506599 iOS: Forward RN start/end styles to Yoga
Reviewed By: mmmulani

Differential Revision: D5853589

fbshipit-source-id: 9acee0993a25dce5f4b1ce506746b789b1c4c763
2017-10-18 19:33:31 -07:00
Valentin Shergin 32e5c8e5b5 Deprecated stuff was removed from RCTShadowView
Summary: It was deprecated awhile ago.

Reviewed By: javache

Differential Revision: D5990504

fbshipit-source-id: a218410d17f5f450d573338522b689e035106aba
2017-10-09 17:22:35 -07:00
Valentin Shergin b0c1bd284f `[RCTShadowView localData]` is now only setter.
Summary: It saves 8 bytes per shadowView instance, and it is more logical because it does nothing by default.

Reviewed By: javache

Differential Revision: D5997804

fbshipit-source-id: c985a11aeea881e95911469e10c8c27429a2718a
2017-10-09 10:46:08 -07:00
Ramanpreet Nara 992ade1fc5 Re-render views when direction changes
Reviewed By: shergin

Differential Revision: D5959573

fbshipit-source-id: 36b2cde921362a934a2c88a3ed05be5082ed08bf
2017-10-03 13:01:06 -07:00
Jason Carreiro abed3cf6c4 Revert D5944488: [RN][iOS]: Re-render views when direction changes
Differential Revision: D5944488

fbshipit-source-id: 79e695dcc0ea7d09544ace1525828333a5818c5a
2017-10-02 12:19:25 -07:00
Ramanpreet Nara 9bbc70c442 Re-render views when direction changes
Summary:
This is required for D5874536, wherein I'll be introducing direction-aware props for borders.

When a view's border changes due to a direction update, only the frames of its children update. Therefore, only the children `UIView`s get a chance to be re-rendered. This is incorrect because the view that's had its borders changed also needs to re-render. So, I keep a track of the layout direction in a property on all shadow views. Then, when I update that prop within `applyLayoutNode`, I push shadow views into the `viewsWithNewFrames` set.

Reviewed By: mmmulani

Differential Revision: D5944488

fbshipit-source-id: 3f23e9973f3555612920703cdb6cec38e6360d2d
2017-10-02 11:15:48 -07:00
Valentin Shergin 6d67e2dbbc Bunch of utility funcs were moved to RCTUIManagerUtils
Summary: Because `RCTUIManager` is already overcomplicated and that stuff deserves separate file and header.

Reviewed By: javache

Differential Revision: D5856653

fbshipit-source-id: 7001bb8ba611976bf3b82d6a25f5619810a35b34
2017-09-26 14:08:28 -07:00
tfallon@mail.depaul.edu 03ae65bc25 Fixes removeClipSubviews check for offscreen rendering of ListViews
Summary:
This issue has been open for a really long time, but I'm pretty sure this is the line that needed to change:
https://github.com/facebook/react-native/issues/1831

What was happening here is that `CGRectIsEmpty` returns true when either height or width is zero. With the current logic, one of those would always be zero when the parent was rendered off screen. This ensures that there the intersection be of CGSizeZero for the view to actually be clipped.

That being said, there seems to be something more complex going on here that I'm not understanding? I would think that you'd simply want to check if the child view's frame is within the bounds of the parent at all. If it was, then don't clip it. If I'm in the wrong, could someone explain this a bit more? If so, I'll fix this issue.

Using this [repository](https://github.com/jcharlet/react_native_listview_bug), this one line change fixes the issue and still clips cells as they are scrolled off screen.
Closes https://github.com/facebook/react-native/pull/15669

Differential Revision: D5815056

Pulled By: shergin

fbshipit-source-id: 32382e4954139e4d5af67d786422fd87173b1a1a
2017-09-26 11:01:39 -07:00
Mehdi Mulani e220878b00 Add a hack to fix the Modal component interacting with LayoutAnimation
Summary: As per the comment, <Modal> uses entering/leaving the view hierarchy as a cue to show/hide the modal. By re-adding it, we are causing a bunch of confusion.

Reviewed By: shergin

Differential Revision: D5893607

fbshipit-source-id: ecd05799751a9bba843998ae93f24fe35edca8b4
2017-09-25 11:07:55 -07:00
Jakub Grzmiel d005c8c08a Fix format warnings for clang 5.0
Reviewed By: mzlee

Differential Revision: D5900751

fbshipit-source-id: 4e9aea068aab3d2d882b8fb103a8828e861da97c
2017-09-25 10:30:53 -07:00
Valentin Shergin 983b05441d Introducing <SafeAreaView>
Summary:
<SafeAreaView> renders nested content and automatically applies paddings reflect the portion of the view
that is not covered by navigation bars, tab bars, toolbars, and other ancestor views.
Moreover, and most importantly, Safe Area's paddings feflect physical limitation of the screen,
such as rounded corners or camera notches (aka sensor housing area on iPhone X).

Reviewed By: mmmulani

Differential Revision: D5886411

fbshipit-source-id: 7ecc7aa34de8f5527c4e59b0fb4efba3aaea28c8
2017-09-24 23:01:25 -07:00
Valentin Shergin 8b4ed9490c Introducting `-[UIManager.setLocalData:forView:]`, the way to provide environmental data to ShadowView
Summary:
In some cases we need a way to specify some environmental data to shadow view
to improve layout (or do something similar), so `localData` serves these needs.
For example, any stateful embedded native views may benefit from this.
Have in mind that this data is not supposed to interfere with the state of
the shadow view.

Reviewed By: mmmulani

Differential Revision: D5884711

fbshipit-source-id: f0bf66e4608894ec4479b8aca262afcfba6b9f4b
2017-09-24 23:01:25 -07:00
Mehdi Mulani 9bf936ccba Avoid oversending modalDismissed event
Reviewed By: shergin

Differential Revision: D5895366

fbshipit-source-id: 6d1ca424d2d43fadb48354a1cbad94714448a380
2017-09-23 10:46:17 -07:00
Mehdi Mulani a389ffbd84 Add onDismiss to Modal.js
Summary: Adds an onDismiss so that navigation events can be chained to the dismissing of a modal.

Reviewed By: sahrens

Differential Revision: D5852953

fbshipit-source-id: a86e36fdd5b0b206c2dd9fa248e2a88da22efa31
2017-09-21 15:01:52 -07:00
Kellie Medlin e846a9f82f Fix build errors exposed by building against clang 5.0
Reviewed By: rachit-siamwalla

Differential Revision: D5828898

fbshipit-source-id: 23fa587bcd1d1b6c612cc816f1aa7b03da0c187d
2017-09-14 00:35:02 -07:00
Sean Holbert 73c3aa8d32 (iOS) Support for DemiBold alias of SemiBold (font-weight 600)
Summary:
For more information on font weight naming see [this post](https://www.quora.com/What-is-the-difference-between-Medium-Demi-and-Semibold-fonts).

DemiBold is fairly common in font naming. For example, iOS React Native lacks support of "AvNext-DemiBold".

Also removed warning about `NSUInteger` <=> `NSInteger` comparison, by making `i` an `NSUInteger`

Before and after screenshots:

![before-fix](https://user-images.githubusercontent.com/177857/30182567-1dfebcb0-93cc-11e7-9b51-78ef6f41c447.png)

![after-fix](https://user-images.githubusercontent.com/177857/30182570-1f90ea94-93cc-11e7-8f68-008ae648ffbe.png)

Add any DemiBold font to an iOS react native project.  Set fontWeight to `'600'` on a `<Text />` component. The font weight should be applied appropriately.
Closes https://github.com/facebook/react-native/pull/15856

Differential Revision: D5800928

Pulled By: shergin

fbshipit-source-id: 9095e3e150847f9cb828aa5d080567846441e55d
2017-09-08 23:01:41 -07:00
Neo d3007b0fd2 fix fontWeight regression
Summary:
fix the regression I mentioned in https://github.com/facebook/react-native/pull/15162#issuecomment-319696706

as no one is working on this, I take the step, although I know nothing about Objective C

I find the key point is that the keys in `NSDictionary` are not ordered as presented, it's a hash table, so no grantee on keys order, so I create a new array to do that, then it will check `ultralight` before `light` and `semibold` before `bold`
Closes https://github.com/facebook/react-native/pull/15825

Differential Revision: D5782142

Pulled By: shergin

fbshipit-source-id: 5346b0cb263e535c0b445e7a2912c452573248a5
2017-09-06 23:51:57 -07:00
Valentin Shergin 7b962397b6 Fixed clowntoun related to `-[RCTShadowView canHaveSubviews]`
Summary:
Shame on me.
Naming can be hard. We have to use positive logic to avoid this kind of bugs. :(

In the bright future we also have to rename `isYogaLeafNode` to something with positive logic, like `canHaveYogaChildNodes`.
But before we can do this, we have to have solid plan how to unify it with Android.

Reviewed By: mmmulani

Differential Revision: D5780917

fbshipit-source-id: 1ddaaea06f5618b91528cc87f1433a55b5fae4ac
2017-09-06 23:51:57 -07:00
Janic Duplessis 64be88398d Fix content offset validation
Summary:
Content offset was broken because on initial render contentSize is {0,0} so any positive offset is lost. Also inset top/bottom and left/right were inversed �, this led to bad initial scrolling offset when using contentInset. This fixes it by making sure contentSize is actually measured (not {0,0}. I guess it's possible that the content is ACTUALLY {0,0} but in that case I don't think it really matters).

**Test plan**
Tested that a scrollview has proper scroll position when specifying contentOffset. Also tested that it works well with contentInset.
```js
<ScrollView contentOffset={{y: 100}}>
  <View style={{height: 1000}} />
</ScrollView>
```
Closes https://github.com/facebook/react-native/pull/15670

Differential Revision: D5771221

Pulled By: shergin

fbshipit-source-id: 455ed8fd5a4ad1ec61780b573d1a8ef1d77dd124
2017-09-05 16:35:03 -07:00
Jacob Parker b48149ed94 Expose barStyle for NavigatorIOS and TabBarIOS
Summary:
Exposes barStyle property. Code already existed in RCTConvert, so that’s why there’s no conversion code here.
Closes https://github.com/facebook/react-native/pull/10936

Differential Revision: D4224759

Pulled By: shergin

fbshipit-source-id: b6346940e69933d42a21cd38b9a2fa75d049f8e6
2017-08-25 00:14:46 -07:00
Valentin Shergin 6493a85754 RCTShadowView have got `rootView` property
Summary:
We have to have a way to track ownership of shadow view.
Previous solution with traversing the hierarchy to figure out the root view does not actually work in some cases when the view is temporary detached from hierarchy.
This is also how it work on Andorid.

Reviewed By: mmmulani

Differential Revision: D5686112

fbshipit-source-id: a23a10e8c29c7572ac69403289db136c9d5176a9
2017-08-24 00:05:48 -07:00
Alin Panaitiu 28c1c88ef7 Adjust row height by font size in PickerIOS
Summary:
- [x] Explain the **motivation** for making this change.
- [x] Provide a **test plan** demonstrating that the code is solid.
- [x] Match the **code formatting** of the rest of the codebase.
- [x] Target the `master` branch, NOT a "stable" branch.

There is a problem where setting a bigger fontSize in PickerItem style
clips the top and bottom of the text.
This solves that problem by computing the row height using the font
size.

Create a PickerIOS component and set a larger font size (e.g. 50). The row height will grow accordingly.

Example with `fontSize=50`: [Screenshot](http://i.imgur.com/YwK5fOc.png)
Closes https://github.com/facebook/react-native/pull/13513

Differential Revision: D5692124

Pulled By: shergin

fbshipit-source-id: 4629403e37ad68cdbc0b17b48ba924a77e133078
2017-08-23 20:30:10 -07:00
Valentin Shergin 950c2b2a73 ScrollView: `contentOffset` validatation now respects `contentInset`
Summary:
> The property contentInset can change the maximum and minimum values of the content offset to allow scrolling outside of the scrollable area. Its type is UIEdgeInsets, which consists of 4 numbers: {top, left, bottom, right}. When you introduce an inset, you change the range of the content offset. For example, setting the content inset to have a value of 10 for its top value allows the content offset’s y value to reach -10. This introduces padding around the scrollable area.
( https://www.objc.io/issues/3-views/scroll-view/ )

See also: https://github.com/facebook/react-native/pull/15395

Reviewed By: mmmulani

Differential Revision: D5607192

fbshipit-source-id: 1acd6a84e2bcfefc6e82861cfbdfe6247d0e4264
2017-08-22 16:41:55 -07:00
Douglas Lowder 0d3039f1a0 Fix for Modal behavior when menu button pressed on Apple TV (Issue #15313)
Summary:
**Motivation**

On Apple TV, pressing the menu button destroys the native view that backs the `Modal` component, causing an app using this component to get into a broken state.  This fix implements `onRequestClose` for tvOS to have the same behavior as it does for the Android back button.

**Test plan**

Manually tested this with the `ModalExample` in the `RNTester` app.  See also the test code in issue #15313.
Closes https://github.com/facebook/react-native/pull/15341

Differential Revision: D5651035

Pulled By: shergin

fbshipit-source-id: 54bf66887bbe85940567e63e90b437ac4a8daf9a
2017-08-17 15:22:12 -07:00
Douglas Lowder 0e7375ae36 Apple TV: RCTTabBar selection controlled by native after render (fix #15081)
Summary:
**Motivation**

Fix flickering in TabBarIOS on Apple TV... issue #15081

After this change, on Apple TV, TabBarIOS item selections will be controlled purely from the native side after initial render with the `selected` prop.  This is necessary because the `UITabBar` implementation in tvOS moves the selection before calling `shouldSelectViewController:`; this issue does not occur on iOS.

**Test plan**

Existing CI should still pass. Issue is resolved when testing the example code in #15081 .
Closes https://github.com/facebook/react-native/pull/15220

Differential Revision: D5601671

Pulled By: javache

fbshipit-source-id: c18e7d3482d6c07d534ff40a443a6f642d4267bb
2017-08-10 05:36:06 -07:00
Julien K f06d992964 Fix syntax error
Summary:
It is not itemPositoning it is itemPositioning

I have test it on iOS and tvOS
Closes https://github.com/facebook/react-native/pull/15426

Differential Revision: D5591807

Pulled By: javache

fbshipit-source-id: 0ad0bc32012c63f93f6b1528cae46c6dcba56706
2017-08-09 04:25:08 -07:00
Jake Murzy 614dd077b3 add `pinchEnabled` prop to ScrollView
Summary:
When false, ScrollView disables use of pinch gestures to zoom in and out. This allows ScrollView's pinch gesture responder to be disabled to only allow zooming programmatically. The default value is ~false~ true.

**Test Plan**
Tested that pinch gesture responder is disabled when pinchEnabled=false.

/cc  nicklockwood sahrens

🍺
Closes https://github.com/facebook/react-native/pull/10037

Differential Revision: D5491953

Pulled By: shergin

fbshipit-source-id: eae16f92ec616e415b4ddacfccb84c697582daf9
2017-08-06 23:55:16 -07:00
Dmitry Patsura 30d5b9dbf5 RCTNavigatorManager - drop unneeded error callback
Summary:
Hey!

So, I was interested to contibure, and started from todo

Thank
Closes https://github.com/facebook/react-native/pull/14823

Differential Revision: D5546610

Pulled By: javache

fbshipit-source-id: 58e1b67786cbafa20399ac12dde9fcc3920abe94
2017-08-02 10:23:42 -07:00
Adam Miskiewicz 1954438533 Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Summary:
In iOS11, Apple added a new layout feature called "Safe Areas" (this blog post talks a bit about it: https://www.bignerdranch.com/blog/wwdc-2017-large-titles-and-safe-area-layout-guides/).

UIScrollView is one component that is affected by this change in Apple's API. When the `contentInsetAdjustmentBehavior` is set to `automatic`, for example, it will adjust the insets (and override any manually set insets) automatically based on whether or not there's a UINavigationBar, a UITabBar, a visible status bar, etc on the screen. Frustratingly, Apple decided to default to `Automatic` for this behavior, which will cause any apps that set contentInset/contentContainerStyle padding to have their values offset by, at the very least, the size of the status bar, when they compile their app for iOS 11. Here's more information about this behavior: https://developer.apple.com/documentation/uikit/uiscrollview/2902261-contentinsetadjustmentbehavior?language=objc

Mostly, this is a really straightforward change -- it simply adds a new iOS-only prop to ScrollView that allows setting `contentInsetAdjustmentBehavior`. But I did decide to default the behavior to `never`, so that it mimics the behavior we've seen in iOS < 11. I think it's good to keep something as crucial as scrollview content insets non-magical, and also keep it behaving similarly between platforms.
Closes https://github.com/facebook/react-native/pull/15023

Reviewed By: javache

Differential Revision: D5517552

Pulled By: hramos

fbshipit-source-id: c9ce4bf331b3d243228268d826fdd4dcee99981d
2017-07-31 12:23:34 -07:00
Tom Clarkson 42f7b9e717 Improved window.postMessage implementation
Summary:
Adds a queue to postMessage so that messages sent close together are not lost.

Setting location="a";location="b" results in only "b" reaching shouldStartLoadWithRequest. Making the second update asynchronous with setTimeout does not fix the issue unless a delay is added.

With this update, postMessage queues "b" until it gets a "message:received" event that confirms "a" has already been processed.

The included test sends two messages from a webview and checks that both are received. It fails against the preexisting code with the first message being dropped.
Closes https://github.com/facebook/react-native/pull/11304

Differential Revision: D5481385

Pulled By: hramos

fbshipit-source-id: 9b6af195eeff8f20c820e2fcdac997c90763e840
2017-07-28 11:35:25 -07:00
Saad Ismail 560bab17e1 Revert D5441491: [react-native][PR] Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Differential Revision: D5441491

fbshipit-source-id: 0ae920c6c020f41ee0fde38e57b735f87b26d4a9
2017-07-26 13:32:41 -07:00
Adam Miskiewicz 6e28b39d78 Add 'contentInsetAdjustmentBehavior' (new in iOS 11) to ScrollView
Summary:
In iOS11, Apple added a new layout feature called "Safe Areas" (this blog post talks a bit about it: https://www.bignerdranch.com/blog/wwdc-2017-large-titles-and-safe-area-layout-guides/).

UIScrollView is one component that is affected by this change in Apple's API. When the `contentInsetAdjustmentBehavior` is set to `automatic`, for example, it will adjust the insets (and override any manually set insets) automatically based on whether or not there's a UINavigationBar, a UITabBar, a visible status bar, etc on the screen. Frustratingly, Apple decided to default to `Automatic` for this behavior, which will cause any apps that set contentInset/contentContainerStyle padding to have their values offset by, at the very least, the size of the status bar, when they compile their app for iOS 11. Here's more information about this behavior: https://developer.apple.com/documentation/uikit/uiscrollview/2902261-contentinsetadjustmentbehavior?language=objc

Mostly, this is a really straightforward change -- it simply adds a new iOS-only prop to ScrollView that allows setting `contentInsetAdjustmentBehavior`. But I did decide to default the behavior to `never`, so that it mimics the behavior we've seen in iOS < 11. I think it's good to keep something as crucial as scrollview content insets non-magical, and also keep it behaving similarly between platforms.
Closes https://github.com/facebook/react-native/pull/15023

Differential Revision: D5441491

Pulled By: shergin

fbshipit-source-id: 7b56ea290f7f6eca5f1d996ff8488f40b866c2e6
2017-07-25 10:28:42 -07:00
Pieter De Baets ca9e26cecd Mark non-extern strings static
Reviewed By: shergin

Differential Revision: D5479934

fbshipit-source-id: 2dcf873f44c4847e838d0fae10ecd754d43be262
2017-07-25 04:49:46 -07:00
Kip Ricker cfeaefb4e0 iOS: Fix font weight resolution
Summary:
**Issue:**
Some fonts are defined with weights that don't match with the UIFontWeight constants.

**Example:**
UIFontWeightTraits for Roboto font
Light: -0.230
Thin: -0.365

Currently, the UIFontWeightTrait is always used if it != 0.0, and given the UIFontWeight constants for Light and Thin:
UIFontWeightThin -0.6
UIFontWeightLight -0.4

A style font weight of "300" or "200" will both resolve to Roboto-Thin as its weight -0.365 is closer to -0.4 (UIFontWeightLight) and -0.6 (UIFontWeightThin) than -0.230 (Roboto-Light).

**Proposed fix:**
When resolving `getWeightOfFont` try to match the name of weight to the name of the font first, and guess the font with UIFontWeightTrait as the fall back.

**Test Plan:**
Attempt to display Roboto at weights "200" and "300" and Roboto-Thin and Roboto-Light should be displayed correctly.

Current:
![simulator screen shot jul 7 2017 11 44 42 am](https://user-images.githubusercontent.com/889895/28506859-31b274e8-6fe3-11e7-8f92-f41ff2183356.png)

Fixed:
![simulator screen shot jul 7 2017 11 42 25 am](https://user-images.githubusercontent.com/889895/28506861-365ea3f4-6fe3-11e7-992c-9f426785037f.png)
Closes https://github.com/facebook/react-native/pull/15162

Differential Revision: D5479817

Pulled By: javache

fbshipit-source-id: a9f93d8ce69a96fb685cb09393d1db42486cc0c2
2017-07-24 08:33:04 -07:00
Tomas Reimers aa9a19ab8d Remove onScrollAnimationEnd
Summary:
<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/15156

Differential Revision: D5479265

Pulled By: shergin

fbshipit-source-id: a2dfa3a4357e126838a17dac4797d1d845cd56ae
2017-07-24 00:32:17 -07:00
Valentin Shergin f5d9b5210e ScrollView: Couple of unnecessary checks was removed from RCTCustomScrollView
Summary:
* Now `setFrame:` is called by autoresizing masks, so it is safe.
* Nobody calls `setBounds:`, so it is also safe.

Reviewed By: javache

Differential Revision: D5414441

fbshipit-source-id: 6fc51c7598c4817301db51f627aa1e9840642fec
2017-07-18 14:46:22 -07:00
Valentin Shergin 1d22f8fb27 ScrollView: Smart `contentOffset` preserving
Summary:
Previous `contentOffset` can be invalid for a new layout and overscroll the ScrollView, so the diff fixes that.
Also documented here: https://github.com/facebook/react-native/issues/13566

Reviewed By: mmmulani

Differential Revision: D5414442

fbshipit-source-id: 7de1b4a4571108a37d1795e80f165bca5aba5fef
2017-07-18 14:46:22 -07:00
Valentin Shergin 301830dc2a ScrollView: Use autoresizing masks for layouting actual UIScrollView
Summary:
Surprisingly enough, even if semantically the code remains identical, layouting via autoresizing masks applies changes to subviews a bit earlier than iOS calls `layoutSubviews`.
This allows us to avoid situations where we already explicitly set calculated by Yoga frames and want to scroll to some subview, but actual layout have not done yet and internal views has wrong frames.

Reviewed By: javache

Differential Revision: D5414440

fbshipit-source-id: d4152c9c68dc17f6827832dcb45e5ba86fb82831
2017-07-18 14:46:22 -07:00