How to Achieve Scrolling marquee using qml

[imxiangpeng]

I want to achieve the effect whick liking scroll marquee in webpage(html), does someone have some suggest?

[xsacha]

This works fine here:

@
import QtQuick 1.0
import QtWebKit 1.0

WebView {
width: 200; height: 30
html: "<marquee>GOOG 544.59 (+95.05) | TWX 14.88 (+0.27) | IBM 124.96 (+1.88)</marquee>"
}
@

Edit:

You can achieve the same thing in JavaScript, if you do not want to use marquee. JavaScript allows a little more manipulation, such as this:

@

import QtQuick 1.0
import QtWebKit 1.0

WebView {
width: 200; height: 100
html: "[removed]\n" +
"var marqueecontent='<p>GOOG 544.59 (+95.05)</p><p>TWX 14.88 (+0.27)</p><p>IBM 124.96 (+1.88)</p>'\n" +
"var cross_marquee, cross_marquee2\n" +

      "function populate(){\n" +
          "cross_marquee= document.getElementById(\"iemarquee\")\n" +
          "cross_marquee2= document.getElementById(\"iemarquee2\")\n" +
          "cross_marquee2[removed]=cross_marquee[removed]=marqueecontent\n" +
          "cross_marquee2.style.top=(parseInt(cross_marquee.style.top)+105)+\"px\"\n" +
          "lefttime=setInterval(\"scrollmarquee()\",16)\n" +
      "}\n" +
      "window.onload=populate\n" +

      "function scrollmarquee(){\n" +
          "if (parseInt(cross_marquee.style.top)<-105)\n" +
          "cross_marquee.style.top=105+\"px\"\n" +
          "if (parseInt(cross_marquee2.style.top)<-105)\n" +
          "cross_marquee2.style.top=105+\"px\"\n" +
          "cross_marquee2.style.top=parseInt(cross_marquee2.style.top)-1+\"px\"\n" +
          "cross_marquee.style.top=parseInt(cross_marquee.style.top)-1+\"px\"\n" +
      "}\n" +

      "with (document){\n" +
          "write('<div style=\"position:relative;width:'+200+';height:'+100+';overflow:hidden\">')\n" +
          "write('<div id=\"iemarquee\"  style=\"position:absolute;top:0px;\"></div>')\n" +
          "write('<div id=\"iemarquee2\" style=\"position:absolute;\"></div>')\n" +
          "write('</div>')\n" +
      "}\n" +
      "[removed]"

}
@

The [removed] are script type "javascript"

Edit: Thread is closed, but for future readers, I'll mention in reply to blam:
You can use QML objects within the HTML code if you want.

[blam]

Do you mean you want to implement a scrolling marquee within a web page in QML, or do you want to take the scrolling marquee effect from html and apply it in QML?

[fcrochik]

Thread is closed? What does it mean?

[Guest]

[quote author="fcrochik" date="1291653792"]Thread is closed? What does it mean?[/quote]

When a thread is closed, you cannot post new replies to it. this seems still open :)

[fcrochik]

That is what I imagined... Don't think I came across any yet... Just added a suggestion to allow to use for "closed" or "open" as a search criteria and also display status (open or closed) on search results.

[xsacha]

Uh, this was definitely closed! I couldn't reply. Don't know why it was closed as I was expecting a reply by OP.

But, as blam says, did you want the marquee within a webpage (like just scrolling text object) or did you want to use marquee for QML objects.

Both are possible using the WebView. You can define QML objects in the WebView as a plugin.
See this example: http://qt.gitorious.org/qt/kinetic/blobs/43199af242918b3c77bb47bdcc3ec60f8236b0d3/examples/declarative/webview/qml-in-html.qml

[Guest]

[quote author="xsacha" date="1291681522"]Uh, this was definitely closed! I couldn't reply. Don't know why it was closed as I was expecting a reply by OP.

[/quote]

xsacha maybe the page hadn't loaded fully or the script failed. I've seen it happen sometimes but very rare. a refresh should usually solve this issue