feat(focus): Add functionality to imperatively focus webview (#567)

*  - add focus functionality for devices without touch screen
 (faced problem while developing for android TV, cause there only remote controller for device)

* Reimplement as a ref method.

*  - remove redundant requestFocus
This commit is contained in:
DemMarcupan 2019-08-06 11:56:59 +03:00 committed by Thibault Malbranche
parent 9db55a5769
commit 6f053bad7b
5 changed files with 32 additions and 1 deletions

View File

@ -110,6 +110,7 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
public static final int COMMAND_POST_MESSAGE = 5;
public static final int COMMAND_INJECT_JAVASCRIPT = 6;
public static final int COMMAND_LOAD_URL = 7;
public static final int COMMAND_FOCUS = 8;
protected static final String REACT_CLASS = "RNCWebView";
protected static final String HTML_ENCODING = "UTF-8";
protected static final String HTML_MIME_TYPE = "text/html";
@ -511,7 +512,7 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
@Override
public @Nullable
Map<String, Integer> getCommandsMap() {
return MapBuilder.of(
Map map = MapBuilder.of(
"goBack", COMMAND_GO_BACK,
"goForward", COMMAND_GO_FORWARD,
"reload", COMMAND_RELOAD,
@ -520,6 +521,8 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
"injectJavaScript", COMMAND_INJECT_JAVASCRIPT,
"loadUrl", COMMAND_LOAD_URL
);
map.put("requestFocus", COMMAND_FOCUS);
return map;
}
@Override
@ -567,6 +570,9 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
}
root.loadUrl(args.getString(0));
break;
case COMMAND_FOCUS:
root.requestFocus();
break;
}
}

5
index.d.ts vendored
View File

@ -34,6 +34,11 @@ declare class WebView extends Component<WebViewProps> {
* Executes the JavaScript string.
*/
injectJavaScript: (script: string) => void;
/**
* Focuses on WebView redered page.
*/
requestFocus: () => void;
}
export {WebView};

View File

@ -105,6 +105,14 @@ class WebView extends React.Component<AndroidWebViewProps, State> {
);
};
requestFocus = () => {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),
this.getCommands().requestFocus,
null,
);
};
postMessage = (data: string) => {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),

View File

@ -164,6 +164,17 @@ class WebView extends React.Component<IOSWebViewProps, State> {
);
};
/**
* Request focus on WebView rendered page.
*/
requestFocus = () => {
UIManager.dispatchViewManagerCommand(
this.getWebViewHandle(),
this.getCommands().requestFocus,
null,
);
};
/**
* Posts a message to the web view, which will emit a `message` event.
* Accepts one argument, `data`, which must be a string.

View File

@ -18,6 +18,7 @@ export interface WebViewCommands {
postMessage: Function;
injectJavaScript: Function;
loadUrl: Function;
requestFocus: Function;
}
export interface CustomUIManager extends UIManagerStatic {