Did't find something like running string (marquee) in qooxdoo
. Running string is needed for qx.ui.basic.Label
for cases when string is to long and widget length is not enough. I would write my own wrapper for html marquee tag by myself but it is deprecated component. I know it could be done via CSS. Any code or easy solution suggestions would be nice.
Here are a couple of options.
I find marquees annoying and distracting, so an alternative that I prefer to use is a tooltip that contains the complete text, so that mouseover will reveal it:
let doc = this.getRoot();
let text = "This is a test of the emergency broadcasting system. This is only a test.";
let label = new qx.ui.basic.Label(text);
label.set(
{
width : 100,
toolTipText : text
});
doc.add(
label,
{
left : 100,
top : 50
});
In the very distant past, we had a demo of a marquee, but I'm pretty sure it was implemented with a JavaScript timer. For the short term, while the <marquee>
tag is still working in all standard browsers, you could simply make use of it like this:
let doc = this.getRoot();
let text = "This is a test of the emergency broadcasting system. This is only a test.";
let label = new qx.ui.basic.Label(`<marquee>${text}</marquee>`);
label.set(
{
width : 100,
rich : true,
toolTipText : text
});
doc.add(
label,
{
left : 100,
top : 50
});
I'd be careful that text
is sanitized, when using rich
.
You're right, though, that with it deprecrated, you should be working towards a standards-compliant implementation.
Finally, you can implement a marquee style sheet as described at https://www.w3schools.in/css3/css-marquee or many other places, by adding a style sheet for it (look at the source code for qx.ui.table.cellrenderer.Abstract
in method _createStyleSheet() for an example of creating a style sheet
), and then manipulating the attributes of your label's label.getContentElement().getDomElement()
.