36 votes

Est-il possible d'afficher du contenu Web sur un fond clair à l'aide de WebKit?

Je suis en train d'évaluer la possibilité d'un patch de WebKit qui permettrait à toutes les rendus graphiques à être rendu sur une totale transparence d'arrière-plan.

L'effet recherché est de rendre le contenu web sans aucune arrière-plan, il semble flotter au-dessus du bureau (ou tout ce qui est affiché derrière la fenêtre du navigateur).

Quelqu'un a vu une app faire cela? (Je pense à certains émulateurs de terminal qui peut.) Si quelqu'un a travaillé à l'intérieur de WebKit (ou peut-être Gecko?) pensez-vous qu'il serait possible de faire cela?


Mise à jour: je viens de réaliser que Mac OSX widgets dashboard d'utiliser cette technique exacte. Donc, ce doit être possible.


Mise à jour 2: j'ai compilé WebKit sur linux et a remarqué l'configurer les options comprennent:

--enable-dashboard-support
enable Dashboard support default=yes

Je suis sur la bonne voie. Quelqu'un peut-il aider?


Mise à jour 3: je continue à trouver de références dans les messages sur les différentes listes de diffusion.

31voto

Mark Renouf Points 13128

Résolu!

Par ses activités de recherche, à récurer les forums et les dépôts de code source, je peiced ensemble les mesures nécessaires pour accomplir cela en utilisant uniquement libwebkit et une norme de compiz bureau (toute Xorg bureau avec le compositing devrait faire).

Pour un courant libwebkit (1.1.10-SVN), il y a un PPA Ubuntu:

deb http://ppa.launchpad.net/webkit-team/ppa/ubuntu jaunty main
deb-src http://ppa.launchpad.net/webkit-team/ppa/ubuntu jaunty main

Aussi loin que le code va, la clé est l'appelant webkit_web_view_set_transparent.

Et bien sûr, le système que vous êtes en cours d'exécution, il doit avoir une carte graphique compatible (intel, radeon ou nvidia) et l'exécution d'un gestionnaire de fenêtres composite (comme Compiz).

Et enfin, de voir réellement la transparence, le contenu que vous êtes en train de visualiser devez définir un arrière-plan transparent à l'aide de CSS3, sinon c'est toujours complètement opaque.

C'est aussi simple que:

BODY { background-color: rgba(0,0,0,0); }

C'est la totalité de l'échantillon pour le plus simple possible navigateur webkit app, avec support de la transparence:

#include <gtk/gtk.h>
#include <webkit/webkit.h>

static void destroy_cb(GtkWidget* widget, gpointer data) {
  gtk_main_quit();
}

int main(int argc, char* argv[]) {
  gtk_init(&argc, &argv);

  if(!g_thread_supported())
    g_thread_init(NULL);

  // Create a Window, set colormap to RGBA
  GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  GdkScreen *screen = gtk_widget_get_screen(window);
  GdkColormap *rgba = gdk_screen_get_rgba_colormap (screen);

  if (rgba && gdk_screen_is_composited (screen)) {
    gtk_widget_set_default_colormap(rgba);
    gtk_widget_set_colormap(GTK_WIDGET(window), rgba);
  }

  gtk_window_set_default_size(GTK_WINDOW(window), 800, 800);
  g_signal_connect(window, "destroy", G_CALLBACK(destroy_cb), NULL);

  // Optional: for dashboard style borderless windows
  gtk_window_set_decorated(GTK_WINDOW(window), FALSE);


  // Create a WebView, set it transparent, add it to the window
  WebKitWebView* web_view = web_view = WEBKIT_WEB_VIEW(webkit_web_view_new());
  webkit_web_view_set_transparent(web_view, TRUE);
  gtk_container_add (GTK_CONTAINER(window), GTK_WIDGET(web_view));

  // Load a default page
  webkit_web_view_load_uri(web_view, "http://stackoverflow.com/");

  // Show it and continue running until the window closes
  gtk_widget_grab_focus(GTK_WIDGET(web_view));
  gtk_widget_show_all(window);
  gtk_main();
  return 0;
}

Screenshot!

2voto

Paul D. Waite Points 35456

De retour dans Safari 1.3 et 2, il y avait un caché menu debug (invoqué par le Terminal: defaults write com.apple.Safari IncludeDebugMenu 1) qui comprend une Utilisation Transparente de la Fenêtre" option.

Pas sûr que ce soit une WebKit chose ou un Safari chose de bien.

(Dans Safari 3, le menu déboguer semble avoir été remplacé par le "Développer" menu (activer dans les Préférences > Avancé) qui n'a pas la fenêtre transparente option.)

1voto

ewanm89 Points 785

Fondamentalement, vous souhaitez définir l'espace colorimétrique ARGB à envoyer au gestionnaire de fenêtres. De toute évidence, seuls les gestionnaires de fenêtres qui prennent en charge le compositing pourront en profiter.

Vous voudrez peut-être parler au screenlet et aux développeurs de compiz, ils devraient être en mesure d'aider davantage.

1voto

Pouria Points 47

Cet essentiel fonctionne pour moi, à partir de 2013, testé uniquement avec ubuntu:

https://gist.github.com/pouria-mellati/7771779

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X