Tutorial

新しい画面をポップアップ表示するには

HTMLコンテンツ上のAタグより新しい画面をポップアップ表示が可能です。
現在のページから新たにWebViewを開くことが出来ます。

<a href="https://www.google.co.jp/?launch_webview=yes">リンクを別のWebViewで開く</a>

解説

新しいページを開く際、パラメータにlaunch_webview=yesを付けてください。
上記の例はインターネット上のWebページですが、ローカルファイルも表示可能です。
※さらに新しいWebViewを開くことは出来ません。
※新しく開いたWebView上でもapplican.jsの機能を使用することができます。

■JavaScriptから新たにWebViewを開く機能

location.href = "index.html?launch_webview=yes#login";

解説

新しいページを開く際、パラメータにlaunch_webview=yesを付けてください。
上記の例はインターネット上のWebページですが、ローカルファイルも表示可能です。
※さらに新しいWebViewを開くことは出来ません。
※新しく開いたWebView上でもapplican.jsの機能を使用することができます。

■ポップアップ表示するWebViewにツールバーを表示しない方法

<a href="https://www.google.co.jp/?launch_webview=yes_without_toolbar">リンクを別のWebViewで開く</a>

解説

パラメータ指定を「launch_webview=yes_without_toolbar」とすることでツールバーを非表示にしたポップアップ表示ができます。

■ポップアップ表示をWeb側から閉じる方法

リンク指定の場合

<a href="?close_webview=yes">閉じる</a>

JavaScriptの場合

location.href = "?close_webview=yes";

解説

リンク指定を「?close_webview=yes」とすることでポップアップを閉じることができます。

■ポップアップ表示したWebViewが閉じられたことを検知する機能

ポップアップ表示されたWebViewが閉じられたことを検知するにはポップアップ表示する前にJavascriptでイベントリスナーを登録します。

applican.addLaunchWebviewCloseEventListener(myCallback);
function myCallback(){
  //WebViewが閉じられたことを検知。
}

解説

WebViewが閉じられた際に、登録したコールバック関数が実行されます。

■WebViewを表示する際のアニメーションを指定する方法(iOSのみ)

URLのパラメータを追加することでアニメーションを指定することができます。

transition_style=[アニメーション形式]

サンプルコード

<a href="page2.html?launch_webview=yes&transition_style=flip">回転して開く</a>

transition_styleで指定できるパラメータ

パラメータ 説明
cover 下から上にスライドします。デフォルトです。
flip 回転して表示します。
curl ページをめくり上げるように表示します。
cross フェードインフェードアウトで表示します。
会員登録(無料)はこちらから