mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-16 11:42:04 +08:00
move the typescript code snippet to external file
This commit is contained in:
30
tests/app/ui/web-view/web-view-code-snippet.ts
Normal file
30
tests/app/ui/web-view/web-view-code-snippet.ts
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
// >> web-view-loaded
|
||||||
|
import { EventData } from 'data/observable';
|
||||||
|
import { Page } from 'ui/page';
|
||||||
|
import { HelloWorldModel } from './main-view-model';
|
||||||
|
import { WebView } from "ui/web-view";
|
||||||
|
import { isAndroid } from "platform"
|
||||||
|
|
||||||
|
|
||||||
|
export function navigatingTo(args: EventData) {
|
||||||
|
|
||||||
|
let page = <Page>args.object;
|
||||||
|
|
||||||
|
page.bindingContext = new HelloWorldModel();
|
||||||
|
}
|
||||||
|
|
||||||
|
export function webViewTouch(args){
|
||||||
|
console.log("touch event");
|
||||||
|
}
|
||||||
|
|
||||||
|
export function webViewPan(args){
|
||||||
|
console.log("pan gesture");
|
||||||
|
}
|
||||||
|
|
||||||
|
export function webViewLoaded(args){
|
||||||
|
var webview:WebView = <WebView>args.object;
|
||||||
|
if(isAndroid){
|
||||||
|
webview.android.getSettings().setDisplayZoomControls(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// >> web-view-loaded
|
@ -27,64 +27,11 @@ Using a WebView requires the web-view module.
|
|||||||
</Page.actionBar>
|
</Page.actionBar>
|
||||||
|
|
||||||
<GridLayout>
|
<GridLayout>
|
||||||
<WebView loaded="webviewloaded" touch="webviewtouch" pan="webviewpan" src="<!DOCTYPE html><html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>" />
|
<WebView loaded="webViewLoaded" touch="webViewTouch" pan="webViewPan" src="<!DOCTYPE html><html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>" />
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</Page>
|
</Page>
|
||||||
```
|
```
|
||||||
|
|
||||||
```TypeScript
|
{%snippet web-view-loaded%}
|
||||||
import { EventData } from 'data/observable';
|
|
||||||
import { Page } from 'ui/page';
|
|
||||||
import { HelloWorldModel } from './main-view-model';
|
|
||||||
import { WebView } from "ui/web-view";
|
|
||||||
import { isAndroid } from "platform"
|
|
||||||
|
|
||||||
|
|
||||||
export function navigatingTo(args: EventData) {
|
|
||||||
|
|
||||||
let page = <Page>args.object;
|
|
||||||
|
|
||||||
page.bindingContext = new HelloWorldModel();
|
|
||||||
}
|
|
||||||
|
|
||||||
export function webviewtouch(args){
|
|
||||||
console.log("touch event");
|
|
||||||
}
|
|
||||||
|
|
||||||
export function webviewpan(args){
|
|
||||||
console.log("pan gesture");
|
|
||||||
}
|
|
||||||
|
|
||||||
export function webviewloaded(args){
|
|
||||||
var webview:WebView = <WebView>args.object;
|
|
||||||
if(isAndroid){
|
|
||||||
webview.android.getSettings().setDisplayZoomControls(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
```JavaScript
|
|
||||||
var main_view_model_1 = require("./main-view-model");
|
|
||||||
var platform_1 = require("platform");
|
|
||||||
function navigatingTo(args) {
|
|
||||||
var page = args.object;
|
|
||||||
page.bindingContext = new main_view_model_1.HelloWorldModel();
|
|
||||||
}
|
|
||||||
exports.navigatingTo = navigatingTo;
|
|
||||||
function webviewtouch(args) {
|
|
||||||
console.log("touch event");
|
|
||||||
}
|
|
||||||
exports.webviewtouch = webviewtouch;
|
|
||||||
function webviewpan(args) {
|
|
||||||
console.log("pan gesture");
|
|
||||||
}
|
|
||||||
exports.webviewpan = webviewpan;
|
|
||||||
function webviewloaded(args) {
|
|
||||||
var webview = args.object;
|
|
||||||
if (platform_1.isAndroid) {
|
|
||||||
webview.android.getSettings().setDisplayZoomControls(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
exports.webviewloaded = webviewloaded;
|
|
||||||
```
|
|
||||||
>Note: to be able to use gestures in `WebView` component on Android, we should first disabled the zoom control. To do that we could access the `android` property and with the help of `setDisplayZoomControls` to set this controll to `false`.
|
>Note: to be able to use gestures in `WebView` component on Android, we should first disabled the zoom control. To do that we could access the `android` property and with the help of `setDisplayZoomControls` to set this controll to `false`.
|
Reference in New Issue
Block a user