Adam Comella f6f8b092f9 Android TextInput: Improve application of styles for value prop (#22461)
Summary:
Prior to this change, when you passed text to `TextInput` via the `value` or `defaultValue` props, React Native didn't apply any of the styles in `buildSpannedFromShadowNode` to the text. This is because `spannedFromShadowNode` appends `value` after calling `buildSpannedFromShadowNode`. Many styles worked because their logic is included in both `buildSpannedFromShadowNode` and `ReactTextInputManager`. However, some only appear in `buildSpannedFromShadowNode` such as `textDecorationLine` (it would be good to understand why we need to duplicate styling logic in `buildSpannedFromShadowNode` & `ReactTextInputManager` and to know whether `ReactTextInputManager` should be handling `textDecorationLine`).

Also, this commit improves consistency between iOS and Android if you specify both `value` and children on a `TextInput`. Prior to this, iOS concatenated the strings such that the `value` prop came before the children whereas Android put the children before the `value` prop. Now Android matches iOS's behavior and puts the `value` prop before the children.

These appear to be regressions. The `value` prop used to be appended before calling `buildSpannedFromShadowNode` (this behavior appears to have been changed by accident in 80027ce6db (diff-4f5947f2fe0381c4a6373a30e596b8c3)).

The fix is to append the `value` prop before calling `buildSpannedFromShadowNode`. Additionally, we have to expose a new `start` parameter on `buildSpannedFromShadowNode` so that we can tell it to include the text from the `value` prop in the range that it styles. Without this, the start of the styled text would be immediately after `value` because `value` is appended before calling `buildSpannedFromShadowNode`
Pull Request resolved: https://github.com/facebook/react-native/pull/22461

Reviewed By: mdvacca

Differential Revision: D13282065

Pulled By: shergin

fbshipit-source-id: 4c99094741441cf54cdec0075bfd08ff7d889e66
2019-01-08 15:58:43 -08:00
2018-12-07 14:16:45 -08:00
2018-12-17 15:43:41 -08:00
2018-12-20 11:58:11 -08:00
2018-12-30 13:31:16 -08:00
2019-01-07 15:39:21 -08:00
2019-01-01 17:13:15 -08:00
2016-02-01 10:49:33 -08:00
2017-12-05 13:02:54 -08:00
2018-12-07 07:49:18 -08:00
2018-08-08 15:03:01 -07:00
2017-04-12 16:31:35 -07:00
2015-03-24 19:59:10 -07:00
2018-12-21 17:37:50 -08:00
2018-12-09 22:27:11 -08:00
2018-08-01 07:16:56 -07:00

React Native · Circle CI Status Build status npm version PRs Welcome

Learn once, write anywhere: Build mobile apps with React.

See the official React Native website for an introduction to React Native.


Requirements

Supported target operating systems are >= Android 4.1 (API 16) and >= iOS 9.0. You may use Windows, macOS, or Linux as your development operating system, though building and running iOS apps is limited to macOS by default (tools like Expo can be used to get around this).

Building your first React Native app

Follow the Getting Started guide. The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:

How React Native works

React Native lets you build mobile apps using JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.

With React Native, you don't build a "mobile web app", an "HTML5 app", or a "hybrid app". You build a real mobile app that's indistinguishable from an app built using Objective-C, Java, Kotlin, or Swift. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.

React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state.

React Native combines smoothly with components written in Objective-C, Java, Kotlin, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.

The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere. Facebook uses React Native in multiple production apps and will continue investing in React Native. You can learn more about our open source roadmap in this blog post: Open Source Roadmap.

Full documentation

The full documentation for React Native can be found on our website. The source for the React Native documentation and website is hosted on a separate repo, https://github.com/facebook/react-native-website. Releases are discussed in the React Native Community, https://github.com/react-native-community/react-native-releases, and larger discussions and proposals are in https://github.com/react-native-community/discussions-and-proposals.

The React Native documentation only discusses the components, APIs, and topics specific to React Native (React on iOS and Android). For further documentation on the React API that is shared between React Native and React DOM, refer to the React documentation.

Join the React Native community

See the CONTRIBUTING file for how to help out.

License

React Native is MIT licensed, as found in the LICENSE file.

React Native documentation is Creative Commons licensed, as found in the LICENSE-docs file.

Description
No description provided
Readme MIT 169 MiB
Languages
JavaScript 40.2%
Java 24.7%
Objective-C 14.3%
C++ 13.5%
Objective-C++ 3.9%
Other 3.3%