WebView2 について

WebView2 を利用して、Windows アプリケーション内に Edge ブラウザを埋め込むことができます。つまり、アプリケーションのフレーム内で Web ページが表示できます。

Visual LANSA バージョン 16 では、WebView2 用のプリミティブ PRIM_WEBV が導入されました。これを使って、ユーザーの VL Windows アプリケーション内に最新のブラウザを埋め込むことができ、ブラウザ・コントロールにアクセスすることで独自の UI 構築が可能になります。

Visual LANSA 16 (Japanese) > 2.30 Visual LANSA WebView2 > 2.30 LANSA frontpage.png

WebView2 の利用方法

コンポーネント定義

Visual LANSA の WebView2 用のプリミティブでは、ナビゲーション・イベント (開始、完了) とともに Web ページ・コントロールの標準 (ナビゲート、戻る、進む、停止、リロード) が提供されており、UI の管理、カズタマイズを行うことができます。

Define_Com Class(#PRIM_WEBV) Name(#WebView) Parent(#COM_OWNER) Displayposition(1) Tabposition(1) Height(890) Top(116) Left(0) Width(1659) Defaulturl('https://docs.lansa.com/15/en/')

プロパティ

CanNavigateBack

ブラウザが履歴を見て戻ることができるかどうかを示すブール値を返します。

CanNavigateForward

ブラウザが履歴を見て前に進むことができるかどうかを示すブール値を返します。

DocumentTitle

現在の HTML ドキュメントのタイトル文字列を返します。

DefaultURL

Webview 初期化時に読み込まれる URL を設定します。

Source

Webview コンポーネントの現 URL を返します。

以下は上記のプロパティを使って UI を制御する例です。

Mthroutine Name(ToggleControls)

    #BTN_Back.Enabled := #WebView.CanNavigateBack
    #BTN_Forward.Enabled := #WebView.CanNavigateForward
    #URL := #WebView.Source
    #COM_OWNER.Caption := #WebView.DocumentTitle

Endroutine

メソッド

NavigateBack

履歴を見て戻ります。

Evtroutine Handling(#BTN_Back.Click)
    #WebView.NavigateBack
Endroutine

NavigateForward

履歴を見て進みます。

Evtroutine Handling(#BTN_Forward.Click)
   #WebView.NavigateForward
Endroutine

NavigateTo

パラメータ URL に入力された URL にナビゲートします。

Evtroutine Handling(#BTN_Go.Click)
    #WebView.NavigateTo( #COM_SELF.FormatURL )
Endroutine

Reload

現在の Web ページをリロードします。

Evtroutine Handling(#BTN_Reload.Click)
    #WebView.Reload
Endroutine

Stop

Web ページのロードを停止します。

Evtroutine Handling(#BTN_Stop.Click)
    #WebView.Stop
Endroutine

Events

NavigationComplete

Web ページのロードが終了すると起動します。

Evtroutine Handling(#WebView.NavigationCompleted) Options(*NOCLEARMESSAGES *NOCLEARERRORS)
    #Navigating := False
    #COM_SELF.ToggleControls
    #URL := #WebView.Source
Endroutine

NavigationStarting

Web ページのロードが開始すると起動します。

Evtroutine Handling(#WebView.NavigationStarting) Options(*NOCLEARMESSAGES *NOCLEARERRORS)

    #Navigating := True

    #COM_SELF.ToggleControls

Endroutine

サンプル・コーディング

* **************************************************
*
* コンポーネント: STD_FORM*
*
* **************************************************
Function Options(*DIRECT)
Begin_Com Role(*EXTENDS #PRIM_FORM) Clientwidth(1659) Clientheight(1006) Componentversion(2) Left(1065) Top(203) Layoutmanager(#LayoutMain)

Define_Com Class(#PRIM_VS.Style) Name(#Style1) Cornerbottomleft(0) Cornerbottomright(0) Borderleft(0) Bordertop(0) Borderright(0) Borderbottom(0)

Define_Com Class(#PRIM_TBLO) Name(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutMainColumn1) Displayposition(1) Parent(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow1) Displayposition(3) Parent(#LayoutMain) Height(2)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow2) Displayposition(1) Parent(#LayoutMain) Height(58) Units(Pixels)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow3) Displayposition(2) Parent(#LayoutMain) Height(58) Units(Pixels)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem1) Manage(#WebView) Parent(#LayoutMain) Row(#LayoutMainRow1) Column(#LayoutMainColumn1)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem2) Alignment(TopLeft) Column(#LayoutMainColumn1) Manage(#Label1) Parent(#LayoutMain) Row(#LayoutMainRow2) Sizing(FitToWidth) Flow(Down) Marginleft(8) Marginright(8)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem3) Alignment(TopLeft) Column(#LayoutMainColumn1) Manage(#URL) Parent(#LayoutMain) Row(#LayoutMainRow2) Sizing(FitToWidth) Flow(Down) Marginleft(24) Marginright(24)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem4) Alignment(TopLeft) Column(#LayoutMainColumn1) Manage(#Label2) Parent(#LayoutMain) Row(#LayoutMainRow3) Sizing(FitToWidth) Flow(Down) Marginleft(8) Marginright(8)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem5) Alignment(TopLeft) Column(#LayoutMainColumn1) Manage(#Panel1) Parent(#LayoutMain) Row(#LayoutMainRow3) Sizing(FitToWidth) Flow(Down) Marginleft(16) Marginright(16)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem6) Alignment(BottomCenter) Column(#LayoutMainColumn1) Manage(#ProgressBar) Parent(#LayoutMain) Row(#LayoutMainRow2) Sizing(FitToWidth) Marginleft(24) Marginright(24)

Define_Com Class(#PRIM_TBLO) Name(#Layout1)
Define_Com Class(#PRIM_TBLO.Row) Name(#Layout1Row1) Displayposition(1) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Column) Name(#Layout1Column1) Displayposition(1) Parent(#Layout1)
Define_Com Class(#PRIM_TBLO.Item) Name(#Layout1Item1) Alignment(CenterLeft) Column(#Layout1Column1) Manage(#BTN_Reload) Parent(#Layout1) Row(#Layout1Row1) Sizing(None) Flow(Right)
Define_Com Class(#PRIM_TBLO.Item) Name(#Layout1Item2) Alignment(CenterLeft) Column(#Layout1Column1) Manage(#BTN_Forward) Parent(#Layout1) Row(#Layout1Row1) Sizing(None) Flow(Right)
Define_Com Class(#PRIM_TBLO.Item) Name(#Layout1Item3) Alignment(CenterLeft) Column(#Layout1Column1) Manage(#BTN_Back) Parent(#Layout1) Row(#Layout1Row1) Sizing(None) Flow(Right)
Define_Com Class(#PRIM_TBLO.Item) Name(#Layout1Item4) Alignment(CenterLeft) Column(#Layout1Column1) Manage(#BTN_Go) Parent(#Layout1) Row(#Layout1Row1) Sizing(None) Flow(Right)
Define_Com Class(#PRIM_TBLO.Item) Name(#Layout1Item5) Alignment(CenterLeft) Column(#Layout1Column1) Manage(#BTN_Stop) Parent(#Layout1) Row(#Layout1Row1) Sizing(None) Flow(Right)

Define_Com Class(#PRIM_EDIT) Name(#URL) Parent(#COM_OWNER) Left(24) Top(25) Displayposition(3) Tabposition(2) Width(1611) Height(30)

Define_Com Class(#prim_WebV) Name(#WebView) Parent(#COM_OWNER) Displayposition(1) Tabposition(1) Height(890) Top(116) Left(0) Width(1659) Defaulturl('https://docs.lansa.com/15/en/')

Define_Com Class(#PRIM_LABL) Name(#Label1) Caption('URL') Displayposition(2) Ellipses(Word) Height(25) Left(8) Parent(#COM_OWNER) Tabposition(3) Tabstop(False) Top(0) Verticalalignment(Center) Width(1643)
Define_Com Class(#PRIM_PANL) Name(#Panel1) Displayposition(5) Left(16) Parent(#COM_OWNER) Tabposition(4) Tabstop(False) Top(83) Width(1627) Layoutmanager(#Layout1) Height(30)
Define_Com Class(#PRIM_PHBN) Name(#BTN_Go) Caption('Go') Displayposition(1) Left(0) Parent(#Panel1) Tabposition(1) Top(3)
Define_Com Class(#PRIM_PHBN) Name(#BTN_Back) Caption('Back') Displayposition(2) Left(80) Parent(#Panel1) Tabposition(2) Top(3)
Define_Com Class(#PRIM_PHBN) Name(#BTN_Forward) Caption('Forward') Displayposition(3) Left(160) Parent(#Panel1) Tabposition(3) Top(3)
Define_Com Class(#PRIM_PHBN) Name(#BTN_Reload) Caption('Reload') Displayposition(4) Left(240) Parent(#Panel1) Tabposition(4) Top(3)
Define_Com Class(#PRIM_PHBN) Name(#BTN_Stop) Caption('Stop') Displayposition(5) Left(320) Parent(#Panel1) Tabposition(5) Top(3)
Define_Com Class(#PRIM_LABL) Name(#Label2) Caption('Controls') Displayposition(4) Ellipses(Word) Height(25) Left(8) Parent(#COM_OWNER) Tabposition(5) Tabstop(False) Top(58) Verticalalignment(Center) Width(1643)
Define_Com Class(#PRIM_PGBR) Name(#ProgressBar) Displayposition(6) Left(24) Parent(#COM_OWNER) Tabposition(6) Top(38) Width(1611) Height(20) Style(#Style1) Visible(False)
Define_Com Class(#PRIM_TIMR) Name(#ProgressTimer) Interval(25) Startup(Manual)
Define_Com Class(#prim_nmbr) Name(#ProgressNum)
Define_Com Class(#PRIM_BOLN) Name(#Navigating)

Evtroutine Handling(#COM_OWNER.Initialize)
#URL := #WebView.DefaultUrl
Endroutine

Evtroutine Handling(#WebView.NavigationCompleted) Options(*NOCLEARMESSAGES *NOCLEARERRORS)
#Navigating := False
#COM_SELF.ToggleControls
#URL := #WebView.Source
Endroutine

Evtroutine Handling(#WebView.NavigationStarting) Options(*NOCLEARMESSAGES *NOCLEARERRORS)
#Navigating := True
#COM_SELF.ToggleControls
Endroutine

Evtroutine Handling(#BTN_Go.Click)
#WebView.NavigateTo( #COM_SELF.FormatURL )
Endroutine

Evtroutine Handling(#URL.Enter)
#WebView.NavigateTo( #COM_SELF.FormatURL )
Endroutine

Evtroutine Handling(#BTN_Back.Click)
#WebView.NavigateBack
Endroutine

Evtroutine Handling(#BTN_Forward.Click)
#WebView.NavigateForward
Endroutine

Evtroutine Handling(#BTN_Reload.Click)
#WebView.Reload
Endroutine

Evtroutine Handling(#BTN_Stop.Click)
#WebView.Stop #COM_SELF.ToggleControls
Endroutine


Mthroutine Name(FormatURL)

Define_Map For(*RESULT) Class(#prim_dc.UnicodeString) Name(#Result)
Define Field(#Protocol) Type(*NVARCHAR) Length(8)

#Protocol := #URL.Value.Substring( 1 8 ).UpperCase

If (#Protocol.UpperCase<>'HTTPS://')
#Protocol := #URL.Value.Substring( 1 7 ).UpperCase

If (#Protocol.UpperCase<>'HTTP://')
#URL := 'https://' + #URL
Endif

Endif

#Result := #URL

Endroutine


Mthroutine Name(ToggleControls)

#BTN_Back.Enabled := #WebView.CanNavigateBack
#BTN_Forward.Enabled := #WebView.CanNavigateForward
#BTN_Stop.Enabled := #Navigating
#BTN_Reload.Enabled := #Navigating.IsFalse
#BTN_Go.Enabled #URL.Enabled := #Navigating.IsFalse

#COM_OWNER.Caption := #WebView.DocumentTitle

If (#Navigating)

#ProgressBar.FadeIn Duration(250)
#ProgressTimer.Start

Else

#ProgressTimer.Stop
#ProgressBar.Value := 0
#ProgressBar.FadeOut Duration(250) Visible(True)

Endif

Endroutine


Evtroutine Handling(#ProgressTimer.Tick) Options(*NOCLEARMESSAGES *NOCLEARERRORS)

#ProgressBar.Value += 1

If (#ProgressBar.Value >= 100)
#ProgressNum := 0
Endif

#Com_owner.UpdateDisplay

Endroutine

End_Com