From 4ea0c4d2632066cdd7bc77a33c4da7ef2eabb6b9 Mon Sep 17 00:00:00 2001 From: Travis CI Date: Thu, 13 Aug 2015 13:55:29 +0000 Subject: [PATCH] update website --- docs/appregistry.html | 2 +- docs/asyncstorage.html | 51 +++++++++++++++++++++++---------------- docs/layoutanimation.html | 7 +++++- docs/sliderios.html | 2 +- docs/text.html | 21 +++++++++++++++- docs/textinput.html | 4 +-- docs/view.html | 18 +++++++++++--- 7 files changed, 74 insertions(+), 31 deletions(-) diff --git a/docs/appregistry.html b/docs/appregistry.html index 0ba5ee45e3e..98ad72cc46b 100644 --- a/docs/appregistry.html +++ b/docs/appregistry.html @@ -4,7 +4,7 @@ root components should register themselves with for the app and then actually run the app when it's ready by invoking AppRegistry.runApplication.

AppRegistry should be required early in the require sequence to make sure the JS execution environment is setup before other modules are -required.

Methods #

static registerConfig(config: Array<AppConfig>) #

static registerComponent(appKey: string, getComponentFunc: Function) #

static registerRunnable(appKey: string, func: Function) #

static runApplication(appKey: string, appParameters: any) #

Next →
React Native

Quick Start

Guides

components

apis

Polyfills

LayoutAnimation

Methods #

static configureNext(config: Config, onAnimationDidEnd?: Function, onError?: Function) #

static create(duration: number, type, creationProp) #

Next →
© 2015 Facebook Inc.
React Native

Quick Start

Guides

components

apis

Polyfills

LayoutAnimation

Automatically animates views to their new positions when the +next layout happens.

A common way to use this API is to call LayoutAnimation.configureNext +before calling setState.

Methods #

static configureNext(config: Config, onAnimationDidEnd?: Function) #

Schedules an animation to happen on the next layout.

@param config Specifies animation properties:

  • duration in milliseconds
  • create, config for animating in new views (see Anim type)
  • update, config for animating views that have been updated +(see Anim type)

@param onAnimationDidEnd Called when the animation finished. +Only supported on iOS. +@param onError Called on error. Only supported on iOS.

static create(duration: number, type, creationProp) #

Helper for creating a config for configureNext.

Next →
© 2015 Facebook Inc.
React Native

Quick Start

Guides

components

apis

Polyfills

SliderIOS

Edit on GitHubProps #

maximumTrackTintColor string #

The color used for the track to the right of the button. Overrides the +SliderIOS – React Native | A framework for building native apps using React

React Native

Quick Start

Guides

components

apis

Polyfills

SliderIOS

Edit on GitHubProps #

maximumTrackTintColor string #

The color used for the track to the right of the button. Overrides the default blue gradient image.

maximumValue number #

Initial maximum value of the slider. Default value is 1.

minimumTrackTintColor string #

The color used for the track to the left of the button. Overrides the default blue gradient image.

minimumValue number #

Initial minimum value of the slider. Default value is 0.

onSlidingComplete function #

Callback called when the user finishes changing the value (e.g. when the slider is released).

onValueChange function #

Callback continuously called while the user is dragging the slider.

style View#style #

Used to style and layout the Slider. See StyleSheet.js and diff --git a/docs/text.html b/docs/text.html index a4697a28aab..95cf84cd8e6 100644 --- a/docs/text.html +++ b/docs/text.html @@ -23,7 +23,7 @@ each other on account of the literal newlines:

: 20, fontWeight: 'bold', }, -};

Edit on GitHubProps #

numberOfLines number #

Used to truncate the text with an elipsis after computing the text +};

Edit on GitHubProps #

allowFontScaling bool #

Specifies should fonts scale to respect Text Size accessibility setting on iOS.

numberOfLines number #

Used to truncate the text with an elipsis after computing the text layout, including line wrapping, such that the total number of lines does not exceed this number.

onLayout function #

Invoked on mount and layout changes with

{nativeEvent: {layout: {x, y, width, height}}}

onPress function #

This function is called on press.

style style #

View#style...
color string
fontFamily string
fontSize number
fontStyle enum('normal', 'italic')
fontWeight enum("normal", 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')
letterSpacing number
lineHeight number
textAlign enum("auto", 'left', 'right', 'center', 'justify')
textDecorationLine enum("none", 'underline', 'line-through', 'underline line-through')
textDecorationStyle enum("solid", 'double', 'dotted', 'dashed')
textDecorationColor string
writingDirection enum("auto", 'ltr', 'rtl')

testID string #

Used to locate this view in end-to-end tests.

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.

Edit on GitHubDescription #

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'}}> @@ -437,6 +437,25 @@ exports.examples /View> ); }, +}, { + title: 'allowFontScaling attribute', + render: function() { + return ( + <View> + <Text> + By default, text will respect Text Size accessibility setting on iOS. + It means that all font sizes will be increased or descreased depending on the value of Text Size setting in + {" "}<Text style={{fontWeight: 'bold'}}>Settings.app - Display & Brightness - Text Size</Text> + </Text> + <Text style={{marginTop: 10}}> + You can disable scaling for your Text component by passing {"\""}allowFontScaling={"{"}false{"}\""} prop. + </Text> + <Text allowFontScaling={false} style={{marginTop: 20}}> + This text will not scale. + </Text> + </View> + ); + }, }]; var styles = StyleSheet.create({ diff --git a/docs/textinput.html b/docs/textinput.html index 1f869fab0aa..6c9128fced5 100644 --- a/docs/textinput.html +++ b/docs/textinput.html @@ -17,7 +17,7 @@ example:

<TextInput };

Edit on GitHubProps #

autoCapitalize enum('none', 'sentences', 'words', 'characters') #

Can tell TextInput to automatically capitalize certain characters.

  • characters: all characters,
  • words: first letter of each word
  • sentences: first letter of each sentence (default)
  • none: don't auto capitalize anything

autoCorrect bool #

If false, disables auto-correct. The default value is true.

autoFocus bool #

If true, focuses the input on componentDidMount. The default value is false.

defaultValue string #

Provides an initial value that will change when the user starts typing. Useful for simple use-cases where you don't want to deal with listening -to events and updating the value prop to keep the controlled state in sync.

keyboardType enum("default", 'numeric', 'email-address', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', 'decimal-pad', 'twitter', 'web-search') #

Determines which keyboard to open, e.g.numeric.

The following values work across platforms: +to events and updating the value prop to keep the controlled state in sync.

editable bool #

If false, text is not editable. The default value is true.

keyboardType enum("default", 'numeric', 'email-address', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', 'decimal-pad', 'twitter', 'web-search') #

Determines which keyboard to open, e.g.numeric.

The following values work across platforms: - default - numeric - email-address

multiline bool #

If true, the text input can be multiple lines. @@ -30,7 +30,7 @@ value prop if provided. For most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to simply setting the same value, either set editable={false}, or set/update maxLength to prevent -unwanted edits without flicker.

iosclearButtonMode enum('never', 'while-editing', 'unless-editing', 'always') #

When the clear button should appear on the right side of the text view

iosclearTextOnFocus bool #

If true, clears the text field automatically when editing begins

ioseditable bool #

If false, text is not editable. The default value is true.

iosenablesReturnKeyAutomatically bool #

If true, the keyboard disables the return key when there is no text and +unwanted edits without flicker.

iosclearButtonMode enum('never', 'while-editing', 'unless-editing', 'always') #

When the clear button should appear on the right side of the text view

iosclearTextOnFocus bool #

If true, clears the text field automatically when editing begins

iosenablesReturnKeyAutomatically bool #

If true, the keyboard disables the return key when there is no text and automatically enables it when there is text. The default value is false.

iosmaxLength number #

Limits the maximum number of characters that can be entered. Use this instead of implementing the logic in JS to avoid flicker.

iosreturnKeyType enum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call') #

Determines how the return key should look.

iosselectTextOnFocus bool #

If true, all text will automatically be selected on focus

iosselectionState DocumentSelectionState #

See DocumentSelectionState.js, some state that is responsible for maintaining selection information for a document

androidtextAlignVertical enum('top', 'center', 'bottom') #

Aligns text vertically within the TextInput.

androidunderlineColorAndroid string #

The color of the textInput underline.

Edit on GitHubExamples #

'use strict'; diff --git a/docs/view.html b/docs/view.html index 7e1955df06c..03100bbb8cf 100644 --- a/docs/view.html +++ b/docs/view.html @@ -9,9 +9,13 @@ wraps two colored boxes and custom component in a row with padding.

={{backgroundColor: 'red', flex: 0.5}} /> <MyCustomComponent {...customProps} /> </View>

Views are designed to be used with StyleSheets for clarity and -performance, although inline styles are also supported.

Edit on GitHubProps #

accessibilityLabel string #

Overrides the text that's read by the screen reader when the user interacts +performance, although inline styles are also supported.

Edit on GitHubProps #

accessibilityComponentType enum('none', 'button') #

Indicates to accessibility services to treat UI component like a +native one. Works for Android only.

accessibilityLabel string #

Overrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the -children and accumulating all the Text nodes separated by space.

accessibilityTraits AccessibilityTraits, [AccessibilityTraits] #

Provides additional traits to screen reader. By default no traits are +children and accumulating all the Text nodes separated by space.

accessibilityLiveRegion enum('none', 'polite', 'assertive') #

Indicates to accessibility services whether the user should be notified +when this view changes. Works for Android API >= 19 only. +See http://developer.android.com/reference/android/view/View.html#attr_android:accessibilityLiveRegion +for references.

accessibilityTraits AccessibilityTraits, [AccessibilityTraits] #

Provides additional traits to screen reader. By default no traits are provided unless specified otherwise in element

accessible bool #

When true, indicates that the view is an accessibility element. By default, all the touchable elements are accessible.

onAcccessibilityTap function #

When accessible is true, the system will try to invoke this function when the user performs accessibility tap gesture.

onLayout function #

Invoked on mount and layout changes with

{nativeEvent: { layout: {x, y, width, height}}}.

onMagicTap function #

When accessible is true, the system will invoke this function when the @@ -37,14 +41,20 @@ for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view -(or one of its superviews).

renderToHardwareTextureAndroid bool #

Whether this view should render itself (and all of its children) into a +(or one of its superviews).

style style #

Flexbox...
Transforms...
backfaceVisibility enum('visible', 'hidden')
backgroundColor string
borderColor string
borderTopColor string
borderRightColor string
borderBottomColor string
borderLeftColor string
borderRadius number
borderTopLeftRadius number
borderTopRightRadius number
borderBottomLeftRadius number
borderBottomRightRadius number
borderStyle enum('solid', 'dotted', 'dashed')
opacity number
overflow enum('visible', 'hidden')
shadowColor string
shadowOffset {width: number, height: number}
shadowOpacity number
shadowRadius number

testID string #

Used to locate this view in end-to-end tests. NB: disables the 'layout-only +view removal' optimization for this view!

androidcollapsable bool #

androidrenderToHardwareTextureAndroid bool #

Whether this view should render itself (and all of its children) into a single hardware texture on the GPU.

On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the -interaction/animation.

style style #

Flexbox...
Transforms...
backfaceVisibility enum('visible', 'hidden')
backgroundColor string
borderColor string
borderTopColor string
borderRightColor string
borderBottomColor string
borderLeftColor string
borderRadius number
borderTopLeftRadius number
borderTopRightRadius number
borderBottomLeftRadius number
borderBottomRightRadius number
borderStyle enum('solid', 'dotted', 'dashed')
opacity number
overflow enum('visible', 'hidden')
shadowColor string
shadowOffset {width: number, height: number}
shadowOpacity number
shadowRadius number

testID string #

Used to locate this view in end-to-end tests.

Edit on GitHubExamples #

'use strict'; +interaction/animation.

iosshouldRasterizeIOS bool #

Whether this view should be rendered as a bitmap before compositing.

On iOS, this is useful for animations and interactions that do not +modify this component's dimensions nor its children; for example, when +translating the position of a static view, rasterization allows the +renderer to reuse a cached bitmap of a static view and quickly composite +it during each frame.

Rasterization incurs an off-screen drawing pass and the bitmap consumes +memory. Test and measure when using this property.

Edit on GitHubExamples #

'use strict'; var Platform = require('Platform'); var React = require('react-native');