What is Webview2?

WebView2 allows for the embedding of an Edge browser within a Windows applications application, meaning webpages can be viewed within the application frame.

Visual LANSA V16 sees the introduction of introduces a new Primitive for Webview2 called PRIM_WEBV, this . This allows for a modern browser to be embedded into a users user's VL Windows application with , giving them access to the browser controls to build your their own UI around it.

Image RemovedImage Added

Using WebView2

Component Definition

The Visual LANSA Primitive for WebView2 allows for provides standard controls of a web page controls (Navigate, backBack, Forward, forwardStop, stop and reloadReload) and along with access to the Navigation navigation events, such as starting and completing events from the browser , to help control 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 HTML document.

DefaultURL

sets Sets the URL which will load once the webview WebView is initialized.

Source

returns Returns the current URL in the Webview 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

...

 

     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