Text over image using viewports

[Job Van Dam]

I'm probably gonna get reamed out for this but I just want to let everyone know I looked around for help with this and tried for a few hours to do it via trial and error in the simulator but really got no where.

What I'm trying to do is display text over a image, a changing image.
Specifically display the battery percent over a changing battery image.

I put the main body of the WPS in a viewport then added another viewport with the %bl tag specfiying the position I want it at.
The text isn't another layer but "overwrites" the image. The part of the image the text is covering is totally gone, I can see the background.

I've tried putting the battery images in a viewport then adding a another viewport with the battery tag. Same thing happens.


If you can help me please provide a small example of how to do this, I would greatly appreciate it. Thank you.

[ZincAlloy]

I think this is impossible.

[NicolasP]

The WPS engine isn't meant to allow overlapping elements.

[hhannah]

@Job Van Dam: Instead you might try leaving static the part of the image where the text goes (a viewport just for displaying that text of course, would be displayed over a part of the background main image), and make the images which form the battery around the text change (in separate viewports). Not exactly want you wanted initially, but it could be a good approach... although a bit more complicated depending on your general design... it depends on how important the "% inside the battery" is for you I guess

Edit:



Putting it only in words is not so easy, so I made a little sketch. On the first image, the red lines define the viewports (central part is the % text viewport). You would use four %?bl tags, one within each viewport, all of them with exactly the same amount of conditionals inside. On the first power stages, only the %?bl tag placed in viewport 1 would contain the appropiate filling images for those stages. The %?bl tag conditionals for those stages in viewports 2,3 & 4 would be empty. In the middle power stages, the %?bl tags in viewports 2 & 3 would place the "battery filling" images, while in viewport 1 images for initial power stages would be loaded, and for viewport 4 conditionals would be empty. Similar logic for the final stages. In that way you would achieve displaying something like the 2nd and 3rd icons... using perhaps something more ellaborated under the % text (in my example simulating maybe a lable or a different battery inside look...) again, all this depending of how important it is for you to display this

[Job Van Dam]

Thanks guys, especially hhannah I appreciate the feedback.

I think most likely I'll stick with the way I had it before, timed battery % to battery time.

[pixelma]

Maybe it's not a very nice solution but now that bitmap strips are supported you could achieve something like this with a picture of the text. Of course one part each for every percentage is still a lot even if it was just the text with transparent magenta background, but maybe 5% steps could already be grainy enough and still ok to handle? Just thought I'd mention my quick idea even if it's not that handy...