Browse Source

Merge branch 'master' into fix-onscroll-event-type

Nizomiddin Toshpulatov 4 years ago
parent
commit
676b013f29
No account linked to committer's email address
6 changed files with 92 additions and 55 deletions
  1. 1
    0
      apple/RNCWebView.h
  2. 10
    2
      apple/RNCWebView.m
  3. 1
    0
      apple/RNCWebViewManager.m
  4. 71
    52
      docs/Reference.md
  5. 1
    1
      package.json
  6. 8
    0
      src/WebViewTypes.ts

+ 1
- 0
apple/RNCWebView.h View File

@@ -35,6 +35,7 @@
35 35
 @property (nonatomic, assign) BOOL injectedJavaScriptBeforeContentLoadedForMainFrameOnly;
36 36
 @property (nonatomic, assign) BOOL scrollEnabled;
37 37
 @property (nonatomic, assign) BOOL sharedCookiesEnabled;
38
+@property (nonatomic, assign) BOOL autoManageStatusBarEnabled;
38 39
 @property (nonatomic, assign) BOOL pagingEnabled;
39 40
 @property (nonatomic, assign) CGFloat decelerationRate;
40 41
 @property (nonatomic, assign) BOOL allowsInlineMediaPlayback;

+ 10
- 2
apple/RNCWebView.m View File

@@ -125,6 +125,7 @@ static NSDictionary* customCertificatesForHost;
125 125
     _showsVerticalScrollIndicator = YES;
126 126
     _directionalLockEnabled = YES;
127 127
     _automaticallyAdjustContentInsets = YES;
128
+    _autoManageStatusBarEnabled = YES;
128 129
     _contentInset = UIEdgeInsetsZero;
129 130
     _savedKeyboardDisplayRequiresUserAction = YES;
130 131
     #if !TARGET_OS_OSX
@@ -335,9 +336,13 @@ static NSDictionary* customCertificatesForHost;
335 336
 -(void)showFullScreenVideoStatusBars
336 337
 {
337 338
 #pragma clang diagnostic ignored "-Wdeprecated-declarations"
339
+    if (!_autoManageStatusBarEnabled) {
340
+      return;
341
+    }
342
+
338 343
     _isFullScreenVideoOpen = YES;
339 344
     RCTUnsafeExecuteOnMainQueueSync(^{
340
-      [RCTSharedApplication() setStatusBarStyle:UIStatusBarStyleLightContent animated:YES];
345
+      [RCTSharedApplication() setStatusBarStyle:self->_savedStatusBarStyle animated:YES];
341 346
     });
342 347
 #pragma clang diagnostic pop
343 348
 }
@@ -345,6 +350,10 @@ static NSDictionary* customCertificatesForHost;
345 350
 -(void)hideFullScreenVideoStatusBars
346 351
 {
347 352
 #pragma clang diagnostic ignored "-Wdeprecated-declarations"
353
+    if (!_autoManageStatusBarEnabled) {
354
+      return;
355
+    }
356
+
348 357
     _isFullScreenVideoOpen = NO;
349 358
     RCTUnsafeExecuteOnMainQueueSync(^{
350 359
       [RCTSharedApplication() setStatusBarHidden:self->_savedStatusBarHidden animated:YES];
@@ -1375,4 +1384,3 @@ static NSDictionary* customCertificatesForHost;
1375 1384
 }
1376 1385
 
1377 1386
 @end
1378
-

+ 1
- 0
apple/RNCWebViewManager.m View File

@@ -66,6 +66,7 @@ RCT_EXPORT_VIEW_PROPERTY(dataDetectorTypes, WKDataDetectorTypes)
66 66
 #endif
67 67
 RCT_EXPORT_VIEW_PROPERTY(contentInset, UIEdgeInsets)
68 68
 RCT_EXPORT_VIEW_PROPERTY(automaticallyAdjustContentInsets, BOOL)
69
+RCT_EXPORT_VIEW_PROPERTY(autoManageStatusBarEnabled, BOOL)
69 70
 RCT_EXPORT_VIEW_PROPERTY(hideKeyboardAccessoryView, BOOL)
70 71
 RCT_EXPORT_VIEW_PROPERTY(allowsBackForwardNavigationGestures, BOOL)
71 72
 RCT_EXPORT_VIEW_PROPERTY(incognito, BOOL)

+ 71
- 52
docs/Reference.md View File

@@ -72,6 +72,7 @@ This document lays out the current public properties and methods for the React N
72 72
 - [`pullToRefreshEnabled`](Reference.md#pullToRefreshEnabled)
73 73
 - [`ignoreSilentHardwareSwitch`](Reference.md#ignoreSilentHardwareSwitch)
74 74
 - [`onFileDownload`](Reference.md#onFileDownload)
75
+- [`autoManageStatusBarEnabled`](Reference.md#autoManageStatusBarEnabled)
75 76
 
76 77
 ## Methods Index
77 78
 
@@ -137,9 +138,9 @@ Make sure the string evaluates to a valid type (`true` works) and doesn't otherw
137 138
 
138 139
 On iOS, see [`WKUserScriptInjectionTimeAtDocumentEnd`](https://developer.apple.com/documentation/webkit/wkuserscriptinjectiontime/wkuserscriptinjectiontimeatdocumentend?language=objc)
139 140
 
140
-| Type   | Required | Platform |
141
-| ------ | -------- | -------- |
142
-| string | No       | iOS, Android, macOS
141
+| Type   | Required | Platform            |
142
+| ------ | -------- | ------------------- |
143
+| string | No       | iOS, Android, macOS |
143 144
 
144 145
 To learn more, read the [Communicating between JS and Native](Guide.md#communicating-between-js-and-native) guide.
145 146
 
@@ -169,15 +170,15 @@ Make sure the string evaluates to a valid type (`true` works) and doesn't otherw
169 170
 
170 171
 On iOS, see [`WKUserScriptInjectionTimeAtDocumentStart`](https://developer.apple.com/documentation/webkit/wkuserscriptinjectiontime/wkuserscriptinjectiontimeatdocumentstart?language=objc)
171 172
 
172
-| Type   | Required | Platform |
173
-| ------ | -------- | -------- |
173
+| Type   | Required | Platform   |
174
+| ------ | -------- | ---------- |
174 175
 | string | No       | iOS, macOS |
175 176
 
176 177
 To learn more, read the [Communicating between JS and Native](Guide.md#communicating-between-js-and-native) guide.
177 178
 
178 179
 Example:
179 180
 
180
-Post message a JSON object of `window.location` to be handled by [`onMessage`](Reference.md#onmessage). `window.ReactNativeWebView.postMessage` *will* be available at this time.
181
+Post message a JSON object of `window.location` to be handled by [`onMessage`](Reference.md#onmessage). `window.ReactNativeWebView.postMessage` _will_ be available at this time.
181 182
 
182 183
 ```jsx
183 184
 const INJECTED_JAVASCRIPT = `(function() {
@@ -199,8 +200,8 @@ If `true` (default; mandatory for Android), loads the `injectedJavaScript` only
199 200
 
200 201
 If `false`, (only supported on iOS and macOS), loads it into all frames (e.g. iframes).
201 202
 
202
-| Type   | Required | Platform |
203
-| ------ | -------- | -------- |
203
+| Type | Required | Platform                                          |
204
+| ---- | -------- | ------------------------------------------------- |
204 205
 | bool | No       | iOS and macOS (only `true` supported for Android) |
205 206
 
206 207
 ---
@@ -211,8 +212,8 @@ If `true` (default; mandatory for Android), loads the `injectedJavaScriptBeforeC
211 212
 
212 213
 If `false`, (only supported on iOS and macOS), loads it into all frames (e.g. iframes).
213 214
 
214
-| Type   | Required | Platform |
215
-| ------ | -------- | -------- |
215
+| Type | Required | Platform                                          |
216
+| ---- | -------- | ------------------------------------------------- |
216 217
 | bool | No       | iOS and macOS (only `true` supported for Android) |
217 218
 
218 219
 ---
@@ -223,8 +224,8 @@ Boolean that determines whether HTML5 audio and video requires the user to tap t
223 224
 
224 225
 NOTE: the default `true` value might cause some videos to hang loading on iOS. Setting it to `false` could fix this issue.
225 226
 
226
-| Type | Required | Platform |
227
-| ---- | -------- | -------- |
227
+| Type | Required | Platform            |
228
+| ---- | -------- | ------------------- |
228 229
 | bool | No       | iOS, Android, macOS |
229 230
 
230 231
 ---
@@ -239,8 +240,8 @@ The `nativeConfig` prop expects an object with the following keys:
239 240
 - `props` (object)
240 241
 - `viewManager` (object)
241 242
 
242
-| Type   | Required | Platform |
243
-| ------ | -------- | -------- |
243
+| Type   | Required | Platform            |
244
+| ------ | -------- | ------------------- |
244 245
 | object | No       | iOS, Android, macOS |
245 246
 
246 247
 ---
@@ -258,7 +259,7 @@ Example:
258 259
 ```jsx
259 260
 <WebView
260 261
   source={{ uri: 'https://reactnative.dev' }}
261
-  onError={syntheticEvent => {
262
+  onError={(syntheticEvent) => {
262 263
     const { nativeEvent } = syntheticEvent;
263 264
     console.warn('WebView error: ', nativeEvent);
264 265
   }}
@@ -298,7 +299,7 @@ Example:
298 299
 ```jsx
299 300
 <WebView
300 301
   source={{ uri: 'https://reactnative.dev' }}
301
-  onLoad={syntheticEvent => {
302
+  onLoad={(syntheticEvent) => {
302 303
     const { nativeEvent } = syntheticEvent;
303 304
     this.url = nativeEvent.url;
304 305
   }}
@@ -331,7 +332,7 @@ Example:
331 332
 ```jsx
332 333
 <WebView
333 334
   source={{ uri: 'https://reactnative.dev' }}
334
-  onLoadEnd={syntheticEvent => {
335
+  onLoadEnd={(syntheticEvent) => {
335 336
     // update component to be aware of loading status
336 337
     const { nativeEvent } = syntheticEvent;
337 338
     this.isLoading = nativeEvent.loading;
@@ -365,7 +366,7 @@ Example:
365 366
 ```jsx
366 367
 <WebView
367 368
   source={{ uri: 'https://reactnative.dev/=' }}
368
-  onLoadStart={syntheticEvent => {
369
+  onLoadStart={(syntheticEvent) => {
369 370
     // update component to be aware of loading status
370 371
     const { nativeEvent } = syntheticEvent;
371 372
     this.isLoading = nativeEvent.loading;
@@ -390,8 +391,8 @@ url
390 391
 
391 392
 Function that is invoked when the `WebView` is loading.
392 393
 
393
-| Type     | Required | Platform |
394
-| -------- | -------- | --------- |
394
+| Type     | Required | Platform            |
395
+| -------- | -------- | ------------------- |
395 396
 | function | No       | iOS, Android, macOS |
396 397
 
397 398
 Example:
@@ -435,7 +436,7 @@ Example:
435 436
 ```jsx
436 437
 <WebView
437 438
   source={{ uri: 'https://reactnative.dev' }}
438
-  onHttpError={syntheticEvent => {
439
+  onHttpError={(syntheticEvent) => {
439 440
     const { nativeEvent } = syntheticEvent;
440 441
     console.warn(
441 442
       'WebView received error status code: ',
@@ -523,7 +524,7 @@ Example:
523 524
 ```jsx
524 525
 <WebView
525 526
   source={{ uri: 'https://reactnative.dev' }}
526
-  onNavigationStateChange={navState => {
527
+  onNavigationStateChange={(navState) => {
527 528
     // Keep track of going back navigation within component
528 529
     this.canGoBack = navState.canGoBack;
529 530
   }}
@@ -557,7 +558,7 @@ Example:
557 558
 ```jsx
558 559
 <WebView
559 560
   source={{ uri: 'https://reactnative.dev' }}
560
-  onContentProcessDidTerminate={syntheticEvent => {
561
+  onContentProcessDidTerminate={(syntheticEvent) => {
561 562
     const { nativeEvent } = syntheticEvent;
562 563
     console.warn('Content process terminated, reloading', nativeEvent);
563 564
     this.refs.webview.reload();
@@ -615,8 +616,8 @@ zoomScale
615 616
 
616 617
 List of origin strings to allow being navigated to. The strings allow wildcards and get matched against _just_ the origin (not the full URL). If the user taps to navigate to a new page but the new page is not in this whitelist, the URL will be handled by the OS. The default whitelisted origins are "http://*" and "https://*".
617 618
 
618
-| Type             | Required | Platform |
619
-| ---------------- | -------- | -------- |
619
+| Type             | Required | Platform            |
620
+| ---------------- | -------- | ------------------- |
620 621
 | array of strings | No       | iOS, Android, macOS |
621 622
 
622 623
 Example:
@@ -635,8 +636,8 @@ Example:
635 636
 
636 637
 Function that returns a view to show if there's an error.
637 638
 
638
-| Type     | Required | Platform |
639
-| -------- | -------- | -------- |
639
+| Type     | Required | Platform            |
640
+| -------- | -------- | ------------------- |
640 641
 | function | No       | iOS, Android, macOS |
641 642
 
642 643
 Example:
@@ -644,7 +645,7 @@ Example:
644 645
 ```jsx
645 646
 <WebView
646 647
   source={{ uri: 'https://reactnative.dev' }}
647
-  renderError={errorName => <Error name={errorName} />}
648
+  renderError={(errorName) => <Error name={errorName} />}
648 649
 />
649 650
 ```
650 651
 
@@ -656,8 +657,8 @@ The function passed to `renderError` will be called with the name of the error
656 657
 
657 658
 Function that returns a loading indicator. The startInLoadingState prop must be set to true in order to use this prop.
658 659
 
659
-| Type     | Required | Platform |
660
-| -------- | -------- | -------- |
660
+| Type     | Required | Platform            |
661
+| -------- | -------- | ------------------- |
661 662
 | function | No       | iOS, Android, macOS |
662 663
 
663 664
 Example:
@@ -688,8 +689,8 @@ Function that allows custom handling of any web view requests. Return `true` fro
688 689
 
689 690
 On Android, is not called on the first load.
690 691
 
691
-| Type     | Required | Platform |
692
-| -------- | -------- | -------- |
692
+| Type     | Required | Platform            |
693
+| -------- | -------- | ------------------- |
693 694
 | function | No       | iOS, Android, macOS |
694 695
 
695 696
 Example:
@@ -697,7 +698,7 @@ Example:
697 698
 ```jsx
698 699
 <WebView
699 700
   source={{ uri: 'https://reactnative.dev' }}
700
-  onShouldStartLoadWithRequest={request => {
701
+  onShouldStartLoadWithRequest={(request) => {
701 702
     // Only allow navigating within this website
702 703
     return request.url.startsWith('https://reactnative.dev');
703 704
   }}
@@ -725,8 +726,8 @@ isTopFrame
725 726
 
726 727
 Boolean value that forces the `WebView` to show the loading view on the first load. This prop must be set to `true` in order for the `renderLoading` prop to work.
727 728
 
728
-| Type | Required | Platform |
729
-| ---- | -------- | -------- |
729
+| Type | Required | Platform            |
730
+| ---- | -------- | ------------------- |
730 731
 | bool | No       | iOS, Android, macOS |
731 732
 
732 733
 ---
@@ -870,8 +871,8 @@ Boolean value to enable third party cookies in the `WebView`. Used on Android Lo
870 871
 
871 872
 Sets the user-agent for the `WebView`.
872 873
 
873
-| Type   | Required | Platform |
874
-| ------ | -------- | -------- |
874
+| Type   | Required | Platform            |
875
+| ------ | -------- | ------------------- |
875 876
 | string | No       | iOS, Android, macOS |
876 877
 
877 878
 ---
@@ -880,8 +881,8 @@ Sets the user-agent for the `WebView`.
880 881
 
881 882
 Append to the existing user-agent. Setting `userAgent` will override this.
882 883
 
883
-| Type   | Required | Platform |
884
-| ------ | -------- | -------- |
884
+| Type   | Required | Platform            |
885
+| ------ | -------- | ------------------- |
885 886
 | string | No       | iOS, Android, macOS |
886 887
 
887 888
 ```jsx
@@ -1038,8 +1039,8 @@ The default value is `true`.
1038 1039
 
1039 1040
 Boolean value that determines whether a horizontal scroll indicator is shown in the `WebView`. The default value is `true`.
1040 1041
 
1041
-| Type | Required | Platform |
1042
-| ---- | -------- | -------- |
1042
+| Type | Required | Platform            |
1043
+| ---- | -------- | ------------------- |
1043 1044
 | bool | No       | iOS, Android, macOS |
1044 1045
 
1045 1046
 ---
@@ -1048,8 +1049,8 @@ Boolean value that determines whether a horizontal scroll indicator is shown in
1048 1049
 
1049 1050
 Boolean value that determines whether a vertical scroll indicator is shown in the `WebView`. The default value is `true`.
1050 1051
 
1051
-| Type | Required | Platform |
1052
-| ---- | -------- | -------- |
1052
+| Type | Required | Platform            |
1053
+| ---- | -------- | ------------------- |
1053 1054
 | bool | No       | iOS, Android, macOS |
1054 1055
 
1055 1056
 ---
@@ -1068,8 +1069,8 @@ Set whether Geolocation is enabled in the `WebView`. The default value is `false
1068 1069
 
1069 1070
 Boolean that sets whether JavaScript running in the context of a file scheme URL should be allowed to access content from other file scheme URLs. The default value is `false`.
1070 1071
 
1071
-| Type | Required | Platform |
1072
-| ---- | -------- | -------- |
1072
+| Type | Required | Platform            |
1073
+| ---- | -------- | ------------------- |
1073 1074
 | bool | No       | iOS, Android, macOS |
1074 1075
 
1075 1076
 ---
@@ -1148,8 +1149,8 @@ If true, this will be able horizontal swipe gestures. The default value is `fals
1148 1149
 
1149 1150
 Does not store any data within the lifetime of the WebView.
1150 1151
 
1151
-| Type    | Required | Platform |
1152
-| ------- | -------- | -------- |
1152
+| Type    | Required | Platform            |
1153
+| ------- | -------- | ------------------- |
1153 1154
 | boolean | No       | iOS, Android, macOS |
1154 1155
 
1155 1156
 ---
@@ -1178,8 +1179,8 @@ Sets whether the WebView should disable saving form data. The default value is `
1178 1179
 
1179 1180
 Sets whether WebView should use browser caching.
1180 1181
 
1181
-| Type    | Required | Default | Platform |
1182
-| ------- | -------- | ------- | -------- |
1182
+| Type    | Required | Default | Platform            |
1183
+| ------- | -------- | ------- | ------------------- |
1183 1184
 | boolean | No       | true    | iOS, Android, macOS |
1184 1185
 
1185 1186
 ---
@@ -1284,18 +1285,35 @@ the file.
1284 1285
 If not provided, the default is to let the webview try to render the file.
1285 1286
 
1286 1287
 Example:
1288
+
1287 1289
 ```jsx
1288 1290
 <WebView
1289 1291
   source={{ uri: 'https://reactnative.dev' }}
1290
-  onFileDownload={ ( { nativeEvent: { downloadUrl } } ) => {
1292
+  onFileDownload={({ nativeEvent: { downloadUrl } }) => {
1291 1293
     // You use downloadUrl which is a string to download files however you want.
1292 1294
   }}
1293
-  />
1295
+/>
1294 1296
 ```
1295 1297
 
1298
+| Type     | Required | Platform |
1299
+| -------- | -------- | -------- |
1300
+| function | No       | iOS      |
1301
+
1302
+---
1303
+
1304
+### `autoManageStatusBarEnabled`
1305
+
1306
+If set to `true`, the status bar will be automatically hidden/shown by WebView, specifically when full screen video is being watched. If `false`, WebView will not manage the status bar at all. The default value is `true`.
1307
+
1296 1308
 | Type    | Required | Platform |
1297 1309
 | ------- | -------- | -------- |
1298
-| function | No       | iOS      |
1310
+| boolean | No       | iOS      |
1311
+
1312
+Example:
1313
+
1314
+```javascript
1315
+<WebView autoManageStatusBarEnabled={false} />
1316
+```
1299 1317
 
1300 1318
 ## Methods
1301 1319
 
@@ -1360,6 +1378,7 @@ Request the webView to ask for focus. (People working on TV apps might want havi
1360 1378
 ```javascript
1361 1379
 postMessage('message');
1362 1380
 ```
1381
+
1363 1382
 Post a message to WebView, handled by [`onMessage`](Reference.md#onmessage).
1364 1383
 
1365 1384
 ### `clearFormData()`[⬆](#methods-index)<!-- Link generated with jump2header -->

+ 1
- 1
package.json View File

@@ -8,7 +8,7 @@
8 8
     "Thibault Malbranche <malbranche.thibault@gmail.com>"
9 9
   ],
10 10
   "license": "MIT",
11
-  "version": "10.8.3",
11
+  "version": "10.9.0",
12 12
   "homepage": "https://github.com/react-native-community/react-native-webview#readme",
13 13
   "scripts": {
14 14
     "start": "node node_modules/react-native/local-cli/cli.js start",

+ 8
- 0
src/WebViewTypes.ts View File

@@ -313,6 +313,7 @@ export interface IOSNativeWebViewProps extends CommonNativeWebViewProps {
313 313
   allowsInlineMediaPlayback?: boolean;
314 314
   allowsLinkPreview?: boolean;
315 315
   automaticallyAdjustContentInsets?: boolean;
316
+  autoManageStatusBarEnabled?: boolean;
316 317
   bounces?: boolean;
317 318
   contentInset?: ContentInsetProp;
318 319
   contentInsetAdjustmentBehavior?: ContentInsetAdjustmentBehavior;
@@ -500,6 +501,13 @@ export interface IOSWebViewProps extends WebViewSharedProps {
500 501
    */
501 502
   sharedCookiesEnabled?: boolean;
502 503
 
504
+  /**
505
+   * Set true if StatusBar should be light when user watch video fullscreen.
506
+   * The default value is `true`.
507
+   * @platform ios
508
+   */
509
+  autoManageStatusBarEnabled?: boolean;
510
+
503 511
   /**
504 512
    * A Boolean value that determines whether scrolling is disabled in a particular direction.
505 513
    * The default value is `true`.