QtWebkit实现视频透明区域

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/myaccella/article/details/7175898
 

今天,想在页面上开一个区域来播放视频, 因为当前的图形层叠在视频上上面,

想要让视频露出来,就不能有任何的图形东东挡在上面。

 

首先,我在页面上设计了一块div区域来显示视频,这块区域被设置成全透明:

<div style='position:absolute; left:256px; top:96px; width:720px; height:576px; opacity:0;''></div>

注意最后一个opacity, 设置为0的话, 就表示该div区域就是全透明了,webkit支持这一个属性。

 

加载该页面, 发现这个区域的确是透出来了,但不符合我们要求, 因为,这个区域透明出来以后,就显示页面的背景色了。

视频被背景色挡住了,自然是显示不出来的,看来要把页面的背景也透掉。

把<body>也加上opacity:0?  悲剧了,这个属性加上以后, 整个页面只显示背景色,其它内容都没了,原来body的opacity是让

页面上所有的东东都消失啊,显然不能这样。

 

把<body>的背景色设置成#00000000, 就是把前2位(argb的a位)填0。 结果是白底,马上想到webview是建立在mainwindow上,

应该是mainwindow未透明的原因吧。 于是设置mainwindow为透明:

QMainWindow window;

QWebView *view = new QWebView(&window);

window.setAttribute(Qt::WA_TranslucentBackground, true);

 

结果还是悲剧, 仍然是白底。

问题应该还是出在webview上面,为body设置background的a没有起作用。

不管, 试试调色板,用QT的QPalette来设置一个透明调色板来看看。

QPalette pal = view->page()->palette();
 pal.setBrush(QPalette::Base, Qt::transparent);
 view->setPalette(pal);

搞定了! 视频终于透出来了。

 

总结下, 要想在页面上挖个显示视频的洞,要做如下工作:

1.  <div style='opacity:0;'></div>

2. <body style='background:#00000000;'>

3.  透明palette:

QPalette pal = view->page()->palette();
 pal.setBrush(QPalette::Base, Qt::transparent);
 view->setPalette(pal);

4. webview在mainwindow之上的话, 还必须让mainwindow透明

window.setAttribute(Qt::WA_TranslucentBackground, true);

 

Over!

展开阅读全文

关于qtwebkit

02-23

由于本人需要实现[url=http://blog.csdn.net/tingya/archive/2006/02/18/601836.aspx]VIPS算法[/url],需要用到qtwebkit。简单来说,就是需要是用qtwebkit来对网页进行渲染,从而知道网页中每个字符图片等等在渲染后的页面中的坐标,字体大小,背景颜色等视觉信息。据我所知就是要用qtwebkit生成一颗render tree。由于本人以前没有qt开发经验,加上导师逼得紧,因此有几个问题请教各位高手:rn测试的网页(存储在本地磁盘)rn[code=HTML]rnrn rn rn rn test rn rn rn rn rn rn center rn rn rnrn[/code]rnrn测试代码:rn[code=C]/C++rnvoid traversal(QWebElement node)rnrn if(node.isNull())rn rn return;rn rn QRect ss = node.geometry();rn printf("Tag Name:%s Start: X-%d,Y-%d End: X-%d,Y-%d\n", qPrintable(node.tagName()), ss.topLeft().x(), ss.topLeft().y(), ss.bottomRight().x(), ss.bottomRight().y() );rn //printf("Tag Name:%s Width: %d Height: %d\n", qPrintable(node.tagName()), ss.width(), ss.height());rn QWebElement eee = node.firstChild();rn if(!eee.isNull())rn rn traversal(eee);rn rnrn eee = node.nextSibling();rn if(!eee.isNull())rn rn traversal(eee);rn rnrn return ;rnrnrnint main(int argc, char *argv[])rnrn FILE* fp = fopen("./tt.html", "rb");rn if(fp == NULL)rn rn printf("Can't read file!\n");rn return -1;rn rn char* source = new char[1024*1024];rn memset(source, 0, 1024*1024);rn fread(source, 1, 1024*1024, fp);rn fclose(fp);rnrn QString content(source);rn QUrl url("file:///home/rmss/zp/1_files");rn QApplication a(argc, argv);rn QWebView *view = new QWebView;rnrn QWebSettings * settings = QWebSettings::globalSettings();rn //settings->setAttribute(QWebSettings::AutoLoadImages, false);rn settings->setAttribute(QWebSettings::JavascriptEnabled, false);rn settings->setAttribute(QWebSettings::JavaEnabled, false);rn settings->setAttribute(QWebSettings::PluginsEnabled, false);rn settings->setAttribute(QWebSettings::PrivateBrowsingEnabled, true);rn settings->setDefaultTextEncoding("GB2312");rnrn view->setHtml(content, url);rn view->show();rn rn QWebPage* page = view->page();rn QWebFrame* frame = page->mainFrame();rnrn QString str = frame->renderTreeDump();rn printf("RENDER:%s\n", qPrintable(str));rnrn QWebElement document = frame->documentElement();rn QWebElement eee = document.findFirst("body");rn if(eee.isNull())rn rn printf("failed!\n`");rn rn QString info = eee.styleProperty("background-color", QWebElement::ComputedStyle);rn printf("background:%s\n", qPrintable(info));rnrn traversal(eee);rn return 0;rnrn[/code]rn我在遍历dom树时,对每个node调用geometry函数,文档上说这个函数应该是返回该node中内容对应的区域,但是我发现输出的坐标不对,请问qtwebkit中有没有这个功能,输出每个node中内容在渲染后的页面中的位置,比如我想知道字符串“center”在网页中哪个位置显示,是什么字体,是什么颜色。rnrn 论坛

没有更多推荐了,返回首页