React NativePanResponder # | Edit on GitHub |
PanResponder reconciles several touches into a single gesture. It makes
single-touch gestures resilient to extra touches, and can be used to
-recognize simple multi-touch gestures.
It provides a predictable wrapper of the responder handlers provided by the +recognize simple multi-touch gestures.
By default, PanResponder holds an `InteractionManager handle to block
+long-running JS events from interrupting active gestures.
It provides a predictable wrapper of the responder handlers provided by the
gesture responder system.
For each handler, it provides a new gestureState object alongside the
native event object:
A native event is a synthetic touch event with the following form:
nativeEventchangedTouches- Array of all touch events that have changed since the last eventidentifier- The ID of the touchlocationX- The X position of the touch, relative to the elementlocationY- The Y position of the touch, relative to the elementpageX- The X position of the touch, relative to the root elementpageY- The Y position of the touch, relative to the root elementtarget- The node id of the element receiving the touch eventtimestamp- A time identifier for the touch, useful for velocity calculationtouches- Array of all current touches on the screen
A gestureState object has the following:
stateID- ID of the gestureState- persisted as long as there at least diff --git a/releases/next/docs/pickerios.html b/releases/next/docs/pickerios.html index 3591c6693f2..2a813b6383e 100644 --- a/releases/next/docs/pickerios.html +++ b/releases/next/docs/pickerios.html @@ -1,4 +1,4 @@ -PickerIOS – React Native | A framework for building native apps using React PickerIOS #
Edit on GitHub Examples #
Edit on GitHub 'use strict'; +PickerIOS – React Native | A framework for building native apps using React PickerIOS #
Edit on GitHub Examples #
Edit on GitHub 'use strict'; var React = require('react'); var ReactNative = require('react-native'); diff --git a/releases/next/docs/text.html b/releases/next/docs/text.html index 6a0e75037f5..74e69873411 100644 --- a/releases/next/docs/text.html +++ b/releases/next/docs/text.html @@ -29,12 +29,12 @@ does not exceed this number.lineHeight number
textAlign enum('auto', 'left', 'right', 'center', 'justify')
Specifies text alignment. The value 'justify' is only supported on iOS and fallbacks to
lefton Android.textDecorationLine enum('none', 'underline', 'line-through', 'underline line-through')
textShadowColor color
textShadowOffset {width: number, height: number}
textShadowRadius number
androidtextAlignVertical enum('auto', 'top', 'bottom', 'center')
iosletterSpacing number
iostextDecorationColor color
iostextDecorationStyle enum('solid', 'double', 'dotted', 'dashed')
ioswritingDirection enum('auto', 'ltr', 'rtl')
testID string #
Used to locate this view in end-to-end tests.
iosallowFontScaling bool #
Specifies should fonts scale to respect Text Size accessibility setting on iOS.
iossuppressHighlighting bool #
When true, no visual change is made when text is pressed down. By -default, a gray oval highlights the text on press down.
Description #
Edit on GitHub Nested Text #
In iOS, the way to display formatted text is by using
NSAttributedString: you give the text that you want to display and annotate ranges with some specific formatting. In practice, this is very tedious. For React Native, we decided to use web paradigm for this where you can nest text to achieve the same effect.<Text style={{fontWeight: 'bold'}}> +default, a gray oval highlights the text on press down.Description #
Edit on GitHub Nested Text #
Both iOS and Android allow you to display formatted text by annotating ranges of a string with specific formatting like bold or colored text (
NSAttributedStringon iOS,SpannableStringon Android). In practice, this is very tedious. For React Native, we decided to use web paradigm for this where you can nest text to achieve the same effect.<Text style={{fontWeight: 'bold'}}> I am bold <Text style={{color: 'red'}}> and red </Text> -</Text>Behind the scenes, this is going to be converted to a flat
NSAttributedStringthat contains the following information"I am bold and red" +</Text>Behind the scenes, React Native converts this to a flat
NSAttributedStringorSpannableStringthat contains the following information:"I am bold and red" 0-9: bold 9-17: bold, redContainers #
The
<Text>element is special relative to layout: everything inside is no longer using the flexbox layout but using text layout. This means that elements inside of a<Text>are no longer rectangles, but wrap when they see the end of the line.<Text> <Text>First part and </Text>