WebViewGadget()

Syntaxe

Resultat = WebViewGadget(#Gadget, x, y, Longueur, Hauteur [, Options])
Description
Crée un nouveau gadget d'affichage Web.

Arguments

#Gadget Le numéro d'identification du gadget.

#PB_Any peut être utilisé pour générer automatiquement ce numéro.
x, y,Longueur, Hauteur La position et les dimensions du nouveau gadget.
Options (optionnel) Modifie le comportement du gadget :
   #PB_WebView_Debug : Active l'élément de menu contextuel 'Inspecter' pour afficher l'inspecteur Web et la console.

Valeur de retour

Renvoie une valeur non nulle en cas de succès, zéro sinon.

Si #PB_Any a été utilisé comme paramètre #Gadget alors la valeur de retour est le numéro de gadget généré automatiquement, en cas de succès.

Remarques

Si nécessaire, un proxy peut être défini avec WebViewProxy().

Après la création, utilisez BindWebViewCallback() pour interagir avec le code JavaScript de l'interface utilisateur.
De plus, les commandes de gadget courantes telles que ResizeGadget() ou HideGadget() peuvent également être utilisées.

Les fonctions suivantes peuvent être utilisées pour agir sur un WebViewGadget :

- SetGadgetText() : Modifie l'URL actuelle. Il peut s'agir d'un URL de fichier local tel que "file://c:/purebasic/svn/webview.html" ou d'une URL HTTP standard. Lors de l'utilisation d'un URL de fichier local, il doit s'agir du chemin d'accès complet. Vous pouvez facilement construire l'URL local en ajoutant 'file://' au chemin d'accès.

- SetGadgetItemText() : Avec #PB_WebView_HtmlCode comme 'élément', le code HTML peut être diffusé (streamé) dans le gadget. Toutefois, le code HTML est traité comme un contenu local non fiable et certaines autorisations ne sont pas autorisées.

- GetGadgetAttribute() : Avec #PB_WebView_ICoreController comme 'attribut' permet d'utiliser les fonctions du ICoreWebView2 (Windows seulement).

Le WebViewGadget() n'est pas pris en charge par le sous-système QT.

Exemple: Utiliser des fichiers HTML et CSS locaux

  Procedure IncrementJS(ParametreJSON$)
    Static i
    Debug "IncrementJS "+ParametreJSON$
    i+1
    ProcedureReturn UTF8(~"{ \"count\": "+Str(i)+ "}")
  EndProcedure

  Procedure ComputeJS(ParametreJSON$)
    Debug "ComputeJS "+ParametreJSON$
    ProcedureReturn UTF8(~"150")
  EndProcedure

  OpenWindow(0, 100, 100, 400, 400, "Salut", #PB_Window_SystemMenu)

  WebViewGadget(0, 0, 0, 400, 400)
  SetGadgetText(0, "file://" + #PB_Compiler_Home + "examples/sources/Data/WebView/webview.html")
    
  BindWebViewCallback(0, "increment", @IncrementJS())
  BindWebViewCallback(0, "compute", @ComputeJS())

  Repeat 
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow

Exemple: En utilisant du code HTML en ligne

  Procedure IncrementJS(ParametreJSON$)
    Static i
    Debug "IncrementJS "+ParametreJSON$
    i+1
    ProcedureReturn UTF8(~"{ \"count\": "+Str(i)+ "}")
  EndProcedure

  Procedure ComputeJS(ParametreJSON$)
    Debug "ComputeJS "+ParametreJSON$
    ProcedureReturn UTF8(~"150")
  EndProcedure

  OpenWindow(0, 100, 100, 400, 400, "Salut", #PB_Window_SystemMenu)

  WebViewGadget(0, 0, 0, 400, 400)

  SetGadgetItemText(0, #PB_WebView_HtmlCode, 
                    ~"<button id=\"increment\">Cliquez moi !</button>\n"+
                    ~"<div>Vous avez cliqué <span id=\"count\">0</span> fois.</div>\n"+
                    ~"<button id=\"compute\">Calculer</button>\n"+
                    ~"<div>Resultat du calcul: <span id=\"compute-result\">0</span></div>\n"+
                    ~"<script>\n"+
                    ~"  const [incrementElement, countElement, computeElement, "+
                    ~"computeResultElement] =\n"+
                    ~"    document.querySelectorAll(\"#increment, #count, #compute, "+
                    ~"#compute-result\");\n"+
                    ~"  document.addEventListener(\"DOMContentLoaded\", () => {\n"+
                    ~"    incrementElement.addEventListener(\"click\", () => {\n"+
                    ~"      window.increment().then(result => {\n"+
                    ~"        countElement.textContent = result.count;\n"+
                    ~"      });\n"+
                    ~"    });\n"+
                    ~"    computeElement.addEventListener(\"click\", () => {\n"+
                    ~"      computeElement.disabled = true;\n"+
                    ~"      window.compute(6, 7).then(result => {\n"+
                    ~"        computeResultElement.textContent = result;\n"+
                    ~"        computeElement.disabled = false;\n"+
                    ~"      });\n"+
                    ~"    });\n"+
                    ~"  });\n"+
                    ~"</script>")
    
  BindWebViewCallback(0, "increment", @IncrementJS())
  BindWebViewCallback(0, "compute", @ComputeJS())

  Repeat 
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow

Exemple: Avec menu contextuel désactivé

  Html$ = ~"<html style=\"margin:0px;height:100%;width:100%\">"+
          ~"<body oncontextmenu=\"return false;\" style=\"margin:0px;min-height:100%;width:100%\">"+
          ~"<button id=\"displayInfo\">Info</button>"+
          ~"</body></html>\n"
  
  OpenWindow(0, 100, 100, 400, 400, "Pas de clic droit", #PB_Window_SystemMenu)

  WebViewGadget(0, 0, 0, 400, 400)
  SetGadgetItemText(0, #PB_WebView_HtmlCode, Html$)

  Repeat 
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow

Exemple: En utilisant les fonctions du ICoreWebView2Controller (Windows seulement)

  OpenWindow(0, 100, 100, 800, 600, "Salut", #PB_Window_SystemMenu)
  
  TrackBarGadget(1, 0 , 0, 800, 30, 10, 400):SetGadgetState(1, 100) 
  WebViewGadget(0, 0, 30, 800, 600, #PB_WebView_Debug)
  
  ; Obtenir l'interface ICoreController  
  ;
  Controller.ICoreWebView2Controller = GetGadgetAttribute(0, #PB_WebView_ICoreController)
  
  ; Obtenir l'interface ICoreWebView2
  ;
  Controller\get_CoreWebView2(@Core.ICoreWebView2)
  Core\Navigate("https://www.purebasic.com")
  
  ; core\
  DataSection
    IID_ICoreWebView2Controller2:
    Data.l $C979903E
    Data.w $D4CA, $4228
    Data.b $92, $EB, $47, $EE, $3F, $A9, $6E, $AB
  EndDataSection
  
  If Controller\QueryInterface(?IID_ICoreWebView2Controller2, @Controller2.ICoreWebView2Controller2) = #S_OK
    Debug "ICoreWebView2Controller2 trouvé : " + Controller2
  Else
    Debug "Impossible d'utiliser ICoreWebView2Controller2"
  EndIf
  
  Repeat 
    Event = WaitWindowEvent()
    If event = #PB_Event_Gadget And EventGadget() = 1
      Controller\put_ZoomFactor(GetGadgetState(1)/100)
    EndIf
  Until Event = #PB_Event_CloseWindow

Voir aussi

WebViewExecuteScript(), BindWebViewCallback(), WebViewProxy()

OS Supportés

Tous

<- WebViewExecuteScript() - WebView Index - WebViewProxy() ->