What is Webview2?
WebView2 allows embedding an Edge browser within a Windows application, meaning webpages can be viewed within the application frame.
Visual LANSA V16 introduces a new Primitive for Webview2 called PRIM_WEBV. This allows a modern browser to be embedded into a user's VL Windows application, giving them access to the browser controls to build their own UI around it.
Using WebView2
Component Definition
The Visual LANSA Primitive for WebView2 provides standard web page controls (Navigate, Back, Forward, Stop, and Reload) along with access to navigation events, such as starting and completing, to help manage and customize your 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/')Properties
CanNavigateBack
Returns a Boolean as to whether the browser can navigate back in history.
CanNavigateForward
Returns a Boolean as to whether the browser can navigate forward in history.
DocumentTitle
Returns a string that is the title of the current HTML document.
DefaultURL
Sets the URL which will load once the WebView is initialized.
Source
Returns the current URL in the WebView component.
Here is an example of using these properties to control your UI:
Mthroutine Name(ToggleControls)
#BTN_Back.Enabled := #WebView.CanNavigateBack
#BTN_Forward.Enabled := #WebView.CanNavigateForward
#URL := #WebView.Source
#COM_OWNER.Caption := #WebView.DocumentTitle
Endroutine
Methods
NavigateBack
Navigates back in history.
Evtroutine Handling(#BTN_Back.Click)
#WebView.NavigateBack
Endroutine
NavigateForward
Navigates forward in history.
Evtroutine Handling(#BTN_Forward.Click)
#WebView.NavigateForward
Endroutine
NavigateTo
Navigates to the URL input as the URL parameter.
Evtroutine Handling(#BTN_Go.Click)
#WebView.NavigateTo( #COM_SELF.FormatURL )
Endroutine
Reload
Reload the current webpage.
Evtroutine Handling(#BTN_Reload.Click)
#WebView.Reload
Endroutine
Stop
Stops the loading of a webpage.
Evtroutine Handling(#BTN_Stop.Click)
#WebView.Stop
Endroutine
Events
NavigationComplete
Fired when the loading of a webpage has finished.
Evtroutine Handling(#WebView.NavigationCompleted) Options(*NOCLEARMESSAGES *NOCLEARERRORS)
#Navigating := False
#COM_SELF.ToggleControls
#URL := #WebView.Source
Endroutine
NavigationStarting
Fired when the Loading of a webpage commences.
Evtroutine Handling(#WebView.NavigationStarting) Options(*NOCLEARMESSAGES *NOCLEARERRORS)
#Navigating := True
#COM_SELF.ToggleControls
Endroutine
Sample
* **************************************************
*
* COMPONENT: 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
