Arrière-plan transparent dans le WebView dans JavaFX

1

Vous pouvez Chroma Key votre WebView sur votre contenu en utilisant Blend effets.

Mise à jour

J'ai essayé ceci et mettre en œuvre une véritable clé chroma avec les effets Blend intégrés de JavaFX 2.2 dans JavaFX est en fait assez difficile (et dépassé mes capacités de mise en œuvre). J'ai réussi à faire fonctionner la technique avec des formats vidéo flv pré-chroma keyed, mais pas avec des nœuds arbitraires tels que WebView.

encore, pour l'instant, vous pouvez obtenir quelque chose assez similaire d'une manière simple en utilisant l'assombrir et d'alléger les effets comme le suggère martini dans sa réponse. Ce n'est pas parfait, mais devra probablement suffire jusqu'à RT-25004 est mis en œuvre ou la plate-forme JavaFX fournit un ensemble plus complet d'opérations alpha compositing.

Source

2012-09-14 11:56:58 jewelsea

4

Si u ont un arrière-plan lumineux utiliser

webView.setBlendMode(BlendMode.DARKEN);

et quand fond sombre, puis

webView.setBlendMode(BlendMode.LIGHTEN);

Ce sera probablement fixé dans un certain temps, cette fonction est demandé sur le bug JavaFX Tracker #RT-25004

Source

2013-02-04 17:54:31 drzymala

+0

Il me travaille à 8 avec JDK (1.8.0_40-ea), mais ce n'est pas le cas avec JDK 7 (1.7.0_65) –

-1

Je ressuscite parce que je trouve une meilleure solution pour le problème d'avoir un WebView sur une gradien t. Supposons que vous ayez un gradient like this et que vous voulez afficher une chaîne HTML dessus en couleur blanche qui ressemble à ceci:

<p>Integer semper, est imperdiet mattis porttitor, massa vulputate ipsum</p>

L'astuce est de convertir votre dégradé en chaîne base64:

iVBORw0KGgoAAAANSUhEUgAAAAEAAAHDCAYAAADlQnCCAAAAq0lEQVRIib2VwRWAMAhDaSdwCtd1No8uUzzp0ydBgjwvnmhCPrTKtKxbb73NXcaQLiL5j/olyhQH5JXu4H4sUGyWHAIa9VWjU9qtyAh6JGicIMJno2HcGSX3gJsCKH5EfUfHJUed+qFzekrpuVzM/oq4uFKGr/pI4B7wiP2Vgno0F/uCUQ9ZXWg4vM/JL1Hpt10Nt+hZjhCDKepxV8H3soZGWOqHP3ZSGYDdATTkg3iGU3JnAAAAAElFTkSuQmCC

Puisque WebView charge n'importe quelle chaîne HTML, cela peut impliquer <body> qui a un arrière-plan. Dans mon exemple, le WebView n'occupait pas tout l'espace avec le dégradé, donc je devais positionner l'arrière-plan aussi. Voici le code HTML j'ai ajouté à la chaîne HTML ci-dessus à l'beggining:

<html> 
<head> 
</head> 
<body style="margin: 0px; padding: 0px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAHDCAYAAADlQnCCAAAAq0lEQVRIib2VwRWAMAhDaSdwCtd1No8uUzzp0ydBgjwvnmhCPrTKtKxbb73NXcaQLiL5j/olyhQH5JXu4H4sUGyWHAIa9VWjU9qtyAh6JGicIMJno2HcGSX3gJsCKH5EfUfHJUed+qFzekrpuVzM/oq4uFKGr/pI4B7wiP2Vgno0F/uCUQ9ZXWg4vM/JL1Hpt10Nt+hZjhCDKepxV8H3soZGWOqHP3ZSGYDdATTkg3iGU3JnAAAAAElFTkSuQmCC); background-repeat: repeat-x; background-position: 0 -152px;"> 
<span style="font-family: Arial; font-size: 12px; color: white; display: block; margin:0px;">

Et à la fin:

</span></body></html>

donc la production de ce code:

String desc = "<html><head></head><body style=\"margin: 0px; padding: 0px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAHDCAYAAADlQnCCAAAAq0lEQVRIib2VwRWAMAhDaSdwCtd1No8uUzzp0ydBgjwvnmhCPrTKtKxbb73NXcaQLiL5j/olyhQH5JXu4H4sUGyWHAIa9VWjU9qtyAh6JGicIMJno2HcGSX3gJsCKH5EfUfHJUed+qFzekrpuVzM/oq4uFKGr/pI4B7wiP2Vgno0F/uCUQ9ZXWg4vM/JL1Hpt10Nt+hZjhCDKepxV8H3soZGWOqHP3ZSGYDdATTkg3iGU3JnAAAAAElFTkSuQmCC); background-repeat: repeat-x; background-position: 0 -152px;\"><span style=\"font-family: Arial; font-size: 12px; color: white; display: block; margin:0px;\">" + description + "</span></body></html>"; 
wv_desc.getEngine().loadContent(desc);

Vous pourriez probablement mettre les styles dans le <head> ou les charger d'une autre manière pour plus de clarté, je suppose, mais cela est un bien meilleur travail autour de tout ce que je trouve sur le net pour cette question.

Source

2013-03-01 16:58:35 Dreen

7

Webview transparent je reçois une bonne solution ici: https://javafx-jira.kenai.com/browse/RT-29186 lire les commentaires Harry Hur

import java.lang.reflect.Field; 
    import javafx.application.Application; 
    import javafx.beans.value.ChangeListener; 
    import javafx.beans.value.ObservableValue; 
    import javafx.scene.Scene; 
    import javafx.scene.web.WebEngine; 
    import javafx.scene.web.WebView; 
    import javafx.stage.Stage; 
    import javafx.stage.StageStyle; 
    import org.w3c.dom.Document; ` 

    public class TestTranparentApps extends Application { 

    @Override 
    public void start(Stage primaryStage) { 
     new WebPage(primaryStage); 
     primaryStage.show(); 
    } 

    /** 
    * @param args the command line arguments 
    */ 
    public static void main(String[] args) { 
     launch(args); 
    } 

    class WebPage{ 

     WebView webview; 
     WebEngine webengine; 
     public WebPage(Stage mainstage){ 
      webview = new WebView(); 
      webengine = webview.getEngine(); 

      Scene scene = new Scene(webview); 
      scene.setFill(null); 

      mainstage.setScene(scene); 
      mainstage.initStyle(StageStyle.TRANSPARENT); 
      mainstage.setWidth(700); 
      mainstage.setHeight(100); 

      webengine.documentProperty().addListener(new DocListener()); 
      webengine.loadContent("<body style='background : rgba(0,0,0,0);font-size: 70px;text-align:center;'>Test Transparent</body>"); 
     } 

     class DocListener implements ChangeListener<Document>{ 
      @Override 
      public void changed(ObservableValue<? extends Document> observable, Document oldValue, Document newValue) { 
       try { 

        // Use reflection to retrieve the WebEngine's private 'page' field. 
        Field f = webengine.getClass().getDeclaredField("page"); 
        f.setAccessible(true); 
        com.sun.webkit.WebPage page = (com.sun.webkit.WebPage) f.get(webengine); 
        page.setBackgroundColor((new java.awt.Color(0, 0, 0, 0)).getRGB()); 

       } catch (Exception e) { 
       } 

      } 
     } 
    } 
}

Source

2014-10-23 01:25:01 Haryanto

+0

C'est trop cool! –

+0

'WebEngine.page' est final, vous pouvez donc exécuter la réflexion sans avoir besoin d'écouter les changements de document dès la création de webView. Bien que ma version (JDK 1.7.80) utilise 'com.sun.webpane.platform', mais c'est probablement la même chose. – TWiStErRob

8

Cela peut être utile

final com.sun.webkit.WebPage webPage = com.sun.javafx.webkit.Accessor.getPageFor(engine); 
webPage.setBackgroundColor(0);

Source

2015-07-11 10:27:02

+0

parfait. Pour rendre WebView transparent, il suffit de dépasser deux lignes de code. ou vous pouvez en faire un doublure 'com.sun.javafx.webkit.Accessor.getPageFor (webviewgetEngine()). setBackgroundColor (0)' – Vishrant

Arrière-plan transparent dans le WebView dans JavaFX

Répondre

Questions connexes