mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Updated docs for next
This commit is contained in:
Website Deployment Script
@@ -19,7 +19,62 @@ Bundle bundle <span class="token operator">=</span> <span class="token keyword">
|
||||
bundle<span class="token punctuation">.</span><span class="token function">putString<span class="token punctuation">(</span></span><span class="token string">"foo"</span><span class="token punctuation">,</span> <span class="token string">"bar"</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
service<span class="token punctuation">.</span><span class="token function">putExtras<span class="token punctuation">(</span></span>bundle<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
|
||||
<span class="token function">getApplicationContext<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">startService<span class="token punctuation">(</span></span>service<span class="token punctuation">)</span><span class="token punctuation">;</span></div><h2><a class="anchor" name="caveats"></a>Caveats <a class="hash-link" href="docs/headless-js-android.html#caveats">#</a></h2><ul><li>By default, your app will crash if you try to run a task while the app is in the foreground. This is to prevent developers from shooting themselves in the foot by doing a lot of work in a task and slowing the UI. You can pass a fourth <code>boolean</code> argument to control this behaviour.</li><li>If you start your service from a <code>BroadcastReceiver</code>, make sure to call <code>HeadlessJsTaskService.acquireWakeLockNow()</code> before returning from <code>onReceive()</code>.</li></ul></div><div class="docs-prevnext"><a class="docs-prev btn" href="docs/native-components-android.html#content">← Previous</a><a class="docs-next btn" href="docs/signed-apk-android.html#content">Continue Reading →</a></div><p class="edit-page-block"><a target="_blank" href="https://github.com/facebook/react-native/blob/master/docs/HeadlessJSAndroid.md">Improve this page</a> by sending a pull request!</p></div></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Learn the Basics</a><a href="docs/components-and-apis.html">Components and APIs</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Who's using React Native?</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Meetups</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="http://facebook.github.io/react/" target="_blank">React</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><div class="githubButton"><a class="github-button" href="https://github.com/facebook/react-native" data-icon="octicon-star" data-count-href="/facebook/react-native/stargazers" data-count-api="/repos/facebook/react-native#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star facebook/react-native on GitHub">Star</a></div></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
<span class="token function">getApplicationContext<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">startService<span class="token punctuation">(</span></span>service<span class="token punctuation">)</span><span class="token punctuation">;</span></div><h2><a class="anchor" name="caveats"></a>Caveats <a class="hash-link" href="docs/headless-js-android.html#caveats">#</a></h2><ul><li>By default, your app will crash if you try to run a task while the app is in the foreground. This is to prevent developers from shooting themselves in the foot by doing a lot of work in a task and slowing the UI. You can pass a fourth <code>boolean</code> argument to control this behaviour.</li><li>If you start your service from a <code>BroadcastReceiver</code>, make sure to call <code>HeadlessJsTaskService.acquireWakeLockNow()</code> before returning from <code>onReceive()</code>.</li></ul><h2><a class="anchor" name="example-usage"></a>Example Usage <a class="hash-link" href="docs/headless-js-android.html#example-usage">#</a></h2><p>Service can be started from Java API. First you need to decide when the service should be started and implement your solution accordingly. Here is a simple example that reacts to network connection change.</p><p>Following lines shows part of Android manifest file for registering broadcast receiver. </p><div class="prism language-xml"><receiver android:name=".NetworkChangeReceiver" >
|
||||
<intent-filter>
|
||||
<action android:name="android.net.conn.CONNECTIVITY_CHANGE" />
|
||||
</intent-filter>
|
||||
</receiver></div><p>Broadcast receiver then handles intent that was broadcasted in onReceive function. This is a great place to check whether your app is on foreground or not. If app is not on foreground we can prepare our intent to be started, with no information or additional information bundled using putExta (keep in mind bundle can handle only parcelable values). In the end service is started and wakelock is acquired.</p><div class="prism language-java"><span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">NetworkChangeReceiver</span> <span class="token keyword">extends</span> <span class="token class-name">BroadcastReceiver</span> <span class="token punctuation">{</span>
|
||||
|
||||
@Override
|
||||
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">onReceive<span class="token punctuation">(</span></span><span class="token keyword">final</span> Context context<span class="token punctuation">,</span> <span class="token keyword">final</span> Intent intent<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true">/**
|
||||
This part will be called everytime network connection is changed
|
||||
e.g. Connected -> Not Connected
|
||||
**/</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token function">isAppOnForeground<span class="token punctuation">(</span></span><span class="token punctuation">(</span>context<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true">/**
|
||||
We will start our service and send extra info about
|
||||
network connections
|
||||
**/</span>
|
||||
<span class="token keyword">boolean</span> hasInternet <span class="token operator">=</span> <span class="token function">isNetworkAvailable<span class="token punctuation">(</span></span>context<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
Intent serviceIntent <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Intent</span><span class="token punctuation">(</span>context<span class="token punctuation">,</span> MyTaskService<span class="token punctuation">.</span><span class="token keyword">class</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
serviceIntent<span class="token punctuation">.</span><span class="token function">putExtra<span class="token punctuation">(</span></span><span class="token string">"hasInternet"</span><span class="token punctuation">,</span> hasInternet<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
context<span class="token punctuation">.</span><span class="token function">startService<span class="token punctuation">(</span></span>serviceIntent<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
HeadlessJsTaskService<span class="token punctuation">.</span><span class="token function">acquireWakeLockNow<span class="token punctuation">(</span></span>context<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
<span class="token keyword">private</span> <span class="token keyword">boolean</span> <span class="token function">isAppOnForeground<span class="token punctuation">(</span></span>Context context<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token comment" spellcheck="true">/**
|
||||
We need to check if app is in foreground otherwise the app will crash.
|
||||
http://stackoverflow.com/questions/8489993/check-android-application-is-in-foreground-or-not
|
||||
**/</span>
|
||||
ActivityManager activityManager <span class="token operator">=</span> <span class="token punctuation">(</span>ActivityManager<span class="token punctuation">)</span> context<span class="token punctuation">.</span><span class="token function">getSystemService<span class="token punctuation">(</span></span>Context<span class="token punctuation">.</span>ACTIVITY_SERVICE<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
List<span class="token operator"><</span>ActivityManager<span class="token punctuation">.</span>RunningAppProcessInfo<span class="token operator">></span> appProcesses <span class="token operator">=</span>
|
||||
activityManager<span class="token punctuation">.</span><span class="token function">getRunningAppProcesses<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>appProcesses <span class="token operator">==</span> null<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token boolean">false</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token keyword">final</span> String packageName <span class="token operator">=</span> context<span class="token punctuation">.</span><span class="token function">getPackageName<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">for</span> <span class="token punctuation">(</span>ActivityManager<span class="token punctuation">.</span>RunningAppProcessInfo appProcess <span class="token operator">:</span> appProcesses<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>appProcess<span class="token punctuation">.</span>importance <span class="token operator">==</span>
|
||||
ActivityManager<span class="token punctuation">.</span>RunningAppProcessInfo<span class="token punctuation">.</span>IMPORTANCE_FOREGROUND <span class="token operator">&&</span>
|
||||
appProcess<span class="token punctuation">.</span>processName<span class="token punctuation">.</span><span class="token function">equals<span class="token punctuation">(</span></span>packageName<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token boolean">true</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token keyword">return</span> <span class="token boolean">false</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
<span class="token keyword">public</span> <span class="token keyword">static</span> <span class="token keyword">boolean</span> <span class="token function">isNetworkAvailable<span class="token punctuation">(</span></span>Context context<span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
ConnectivityManager cm <span class="token operator">=</span> <span class="token punctuation">(</span>ConnectivityManager<span class="token punctuation">)</span>
|
||||
context<span class="token punctuation">.</span><span class="token function">getSystemService<span class="token punctuation">(</span></span>Context<span class="token punctuation">.</span>CONNECTIVITY_SERVICE<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
NetworkInfo netInfo <span class="token operator">=</span> cm<span class="token punctuation">.</span><span class="token function">getActiveNetworkInfo<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>netInfo <span class="token operator">!=</span> null <span class="token operator">&&</span> netInfo<span class="token punctuation">.</span><span class="token function">isConnected<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
|
||||
<span class="token punctuation">}</span></div></div><div class="docs-prevnext"><a class="docs-prev btn" href="docs/native-components-android.html#content">← Previous</a><a class="docs-next btn" href="docs/signed-apk-android.html#content">Continue Reading →</a></div><p class="edit-page-block"><a target="_blank" href="https://github.com/facebook/react-native/blob/master/docs/HeadlessJSAndroid.md">Improve this page</a> by sending a pull request!</p></div></section><footer class="nav-footer"><section class="sitemap"><a href="/react-native" class="nav-home"><img src="img/header_logo.png" alt="React Native" width="66" height="58"></a><div><h5><a href="docs/">Docs</a></h5><a href="docs/getting-started.html">Getting Started</a><a href="docs/tutorial.html">Learn the Basics</a><a href="docs/components-and-apis.html">Components and APIs</a><a href="docs/more-resources.html">More Resources</a></div><div><h5><a href="/react-native/support.html">Community</a></h5><a href="/react-native/showcase.html">Who's using React Native?</a><a href="http://www.meetup.com/topics/react-native/" target="_blank">Meetups</a><a href="https://www.facebook.com/groups/react.native.community" target="_blank">Facebook Group</a><a href="https://twitter.com/reactnative" target="_blank">Twitter</a></div><div><h5><a href="/react-native/support.html">Help</a></h5><a href="http://stackoverflow.com/questions/tagged/react-native" target="_blank">Stack Overflow</a><a href="https://discord.gg/0ZcbPKXt5bZjGY5n">Reactiflux Chat</a><a href="/react-native/versions.html" target="_blank">Latest Releases</a><a href="https://react-native.canny.io/feature-requests" target="_blank">Feature Requests</a></div><div><h5>More</h5><a href="/react-native/blog">Blog</a><a href="http://facebook.github.io/react/" target="_blank">React</a><a href="https://github.com/facebook/react-native" target="_blank">GitHub</a><div class="githubButton"><a class="github-button" href="https://github.com/facebook/react-native" data-icon="octicon-star" data-count-href="/facebook/react-native/stargazers" data-count-api="/repos/facebook/react-native#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star facebook/react-native on GitHub">Star</a></div></div></section><section class="newsletter"><div id="mc_embed_signup"><form action="//reactnative.us10.list-manage.com/subscribe/post?u=db0dd948e2b729ee62625b1a8&id=47cd41008f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><div id="mc_embed_signup_scroll"><label for="mce-EMAIL"><h5>Get the React Native Newsletter</h5></label><input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required><div style="position:absolute;left:-5000px;" aria-hidden="true"><input type="text" name="b_db0dd948e2b729ee62625b1a8_47cd41008f" tabindex="-1" value=""></div><div class="clear"><input type="submit" value="Sign up" name="subscribe" id="mc-embedded-subscribe" class="button"></div></div></form></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
|
||||
@@ -122,7 +122,11 @@ default value is false.</p></div></div><div class="prop"><h4 class="propTitle"><
|
||||
(e.g. landscape orientation on a phone), the OS may choose to have the user edit
|
||||
the text inside of a full screen text input mode. When <code>true</code>, this feature is
|
||||
disabled and users will always edit the text directly inside of the text input.
|
||||
Defaults to <code>false</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="inlineimageleft"></a><span class="platform">android</span>inlineImageLeft?: <span class="propType">string</span> <a class="hash-link" href="docs/textinput.html#inlineimageleft">#</a></h4><div><p>If defined, the provided image resource will be rendered on the left.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="inlineimagepadding"></a><span class="platform">android</span>inlineImagePadding?: <span class="propType">number</span> <a class="hash-link" href="docs/textinput.html#inlineimagepadding">#</a></h4><div><p>Padding between the inline image, if any, and the text input itself.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="numberoflines"></a><span class="platform">android</span>numberOfLines?: <span class="propType">number</span> <a class="hash-link" href="docs/textinput.html#numberoflines">#</a></h4><div><p>Sets the number of lines for a <code>TextInput</code>. Use it with multiline set to
|
||||
Defaults to <code>false</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="inlineimageleft"></a><span class="platform">android</span>inlineImageLeft?: <span class="propType">string</span> <a class="hash-link" href="docs/textinput.html#inlineimageleft">#</a></h4><div><p>If defined, the provided image resource will be rendered on the left.
|
||||
The image resource must be inside <code>/android/app/src/main/res/drawable</code> and referenced
|
||||
like</p><div class="prism language-javascript"><span class="token operator"><</span>TextInput
|
||||
inlineImageLeft<span class="token operator">=</span><span class="token string">'search_icon'</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="inlineimagepadding"></a><span class="platform">android</span>inlineImagePadding?: <span class="propType">number</span> <a class="hash-link" href="docs/textinput.html#inlineimagepadding">#</a></h4><div><p>Padding between the inline image, if any, and the text input itself.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="numberoflines"></a><span class="platform">android</span>numberOfLines?: <span class="propType">number</span> <a class="hash-link" href="docs/textinput.html#numberoflines">#</a></h4><div><p>Sets the number of lines for a <code>TextInput</code>. Use it with multiline set to
|
||||
<code>true</code> to be able to fill the lines.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="returnkeylabel"></a><span class="platform">android</span>returnKeyLabel?: <span class="propType">string</span> <a class="hash-link" href="docs/textinput.html#returnkeylabel">#</a></h4><div><p>Sets the return key to the label. Use it instead of <code>returnKeyType</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="textbreakstrategy"></a><span class="platform">android</span>textBreakStrategy?: <span class="propType">enum('simple', 'highQuality', 'balanced')</span> <a class="hash-link" href="docs/textinput.html#textbreakstrategy">#</a></h4><div><p>Set text break strategy on Android API Level 23+, possible values are <code>simple</code>, <code>highQuality</code>, <code>balanced</code>
|
||||
The default value is <code>simple</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="underlinecolorandroid"></a><span class="platform">android</span>underlineColorAndroid?: <span class="propType"><a href="docs/colors.html">color</a></span> <a class="hash-link" href="docs/textinput.html#underlinecolorandroid">#</a></h4><div><p>The color of the <code>TextInput</code> underline.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="clearbuttonmode"></a><span class="platform">ios</span>clearButtonMode?: <span class="propType">enum('never', 'while-editing', 'unless-editing', 'always')</span> <a class="hash-link" href="docs/textinput.html#clearbuttonmode">#</a></h4><div><p>When the clear button should appear on the right side of the text view.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="cleartextonfocus"></a><span class="platform">ios</span>clearTextOnFocus?: <span class="propType">bool</span> <a class="hash-link" href="docs/textinput.html#cleartextonfocus">#</a></h4><div><p>If <code>true</code>, clears the text field automatically when editing begins.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="datadetectortypes"></a><span class="platform">ios</span>dataDetectorTypes?: <span class="propType"><span><span>enum('phoneNumber', 'link', 'address', 'calendarEvent', 'none', 'all'), </span><span>[enum('phoneNumber', 'link', 'address', 'calendarEvent', 'none', 'all')]</span></span></span> <a class="hash-link" href="docs/textinput.html#datadetectortypes">#</a></h4><div><p>Determines the types of data converted to clickable URLs in the text input.
|
||||
Only valid if <code>multiline={true}</code> and <code>editable={false}</code>.
|
||||
|
||||
Reference in New Issue
Block a user