Implemented stopLoading

Summary:**Motivation:** In my app, I'm using a WebView that loads content from my mobile site.  What I want to do is when a user presses a link on the loaded page, I want to stop the WebView's request, hijack the URL and open the URL in a new WebView, pushed to the top of the navigator stack.  To me, this gives the overall app a more native feel, instead of implementing a rudimentary navbar on the main WebView to go back.

**Attempted Workarounds:** I've attempted to get similar functionality by capturing the onNavigationStateChange event in the WebView, and then within calling goBack + pushing the new view to the navigator stack.  From a functionality standpoint, this works.  However, from a UI standpoint, the user can clearly see the webview change states to a new page + go back before having the new view pushed on top of their nav stack.
Closes https://github.com/facebook/react-native/pull/6886

Differential Revision: D3212447

Pulled By: mkonicek

fb-gh-sync-id: 05911e583d9ba54ddbd54a772153c80ed227731e
fbshipit-source-id: 05911e583d9ba54ddbd54a772153c80ed227731e
This commit is contained in:
Andrew Gray 2016-04-22 08:14:53 -07:00 committed by Facebook Github Bot 0
parent 32a89493fb
commit 774296b263
6 changed files with 40 additions and 1 deletions

View File

@ -264,6 +264,14 @@ var WebView = React.createClass({
);
},
stopLoading: function() {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),
UIManager.RCTWebView.Commands.stopLoading,
null
);
},
/**
* We return an event with a bunch of fields including:
* url, title, loading, canGoBack, canGoForward

View File

@ -362,6 +362,14 @@ var WebView = React.createClass({
);
},
stopLoading: function() {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),
UIManager.RCTWebView.Commands.stopLoading,
null
);
},
/**
* We return an event with a bunch of fields including:
* url, title, loading, canGoBack, canGoForward

View File

@ -40,5 +40,6 @@ shouldStartLoadForRequest:(NSMutableDictionary<NSString *, id> *)request
- (void)goForward;
- (void)goBack;
- (void)reload;
- (void)stopLoading;
@end

View File

@ -77,6 +77,11 @@ RCT_NOT_IMPLEMENTED(- (instancetype)initWithCoder:(NSCoder *)aDecoder)
}
}
- (void)stopLoading
{
[_webView stopLoading];
}
- (void)setSource:(NSDictionary *)source
{
if (![_source isEqualToDictionary:source]) {

View File

@ -85,6 +85,18 @@ RCT_EXPORT_METHOD(reload:(nonnull NSNumber *)reactTag)
}];
}
RCT_EXPORT_METHOD(stopLoading:(nonnull NSNumber *)reactTag)
{
[self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, RCTWebView *> *viewRegistry) {
RCTWebView *view = viewRegistry[reactTag];
if (![view isKindOfClass:[RCTWebView class]]) {
RCTLogError(@"Invalid view returned from registry, expecting RCTWebView, got: %@", view);
} else {
[view stopLoading];
}
}];
}
#pragma mark - Exported synchronous methods
- (BOOL)webView:(__unused RCTWebView *)webView

View File

@ -75,6 +75,7 @@ public class ReactWebViewManager extends SimpleViewManager<WebView> {
public static final int COMMAND_GO_BACK = 1;
public static final int COMMAND_GO_FORWARD = 2;
public static final int COMMAND_RELOAD = 3;
public static final int COMMAND_STOP_LOADING = 4;
// Use `webView.loadUrl("about:blank")` to reliably reset the view
// state and release page resources (including any running JavaScript).
@ -350,7 +351,8 @@ public class ReactWebViewManager extends SimpleViewManager<WebView> {
return MapBuilder.of(
"goBack", COMMAND_GO_BACK,
"goForward", COMMAND_GO_FORWARD,
"reload", COMMAND_RELOAD);
"reload", COMMAND_RELOAD,
"stopLoading", COMMAND_STOP_LOADING);
}
@Override
@ -365,6 +367,9 @@ public class ReactWebViewManager extends SimpleViewManager<WebView> {
case COMMAND_RELOAD:
root.reload();
break;
case COMMAND_STOP_LOADING:
root.stopLoading();
break;
}
}