topic Re: How to overlay picture or text on top of another picture? in Discussions

How to overlay picture or text on top of another picture?

miguello — Thu, 12 Dec 2024 07:07:48 GMT

I'd like to have a banner as a title of my app with my company's logo. But I would also like to display other image and some text on top of that banner. How can I overlay several display boxes?

Re: How to overlay picture or text on top of another picture?

jthi — Thu, 12 Dec 2024 07:21:24 GMT

Depends on how you wish it to look like. Can you provide some sort of mock-up of the final result?

Re: How to overlay picture or text on top of another picture?

miguello — Thu, 12 Dec 2024 07:51:23 GMT

Re: How to overlay picture or text on top of another picture?

jthi — Thu, 12 Dec 2024 08:25:52 GMT

Do you have banner which covers the whole top part of the app? And you wish to add image/text on top of it?

Re: How to overlay picture or text on top of another picture?

miguello — Thu, 12 Dec 2024 09:04:26 GMT

Yep!

Re: How to overlay picture or text on top of another picture?

jthi — Thu, 12 Dec 2024 09:24:32 GMT

Maybe this gives some ideas

Names Default To Here(1);

banner = Open("$SAMPLE_IMAGES/tile.jpg", jpg);
banner_extra_image = Open("$SAMPLE_IMAGES/pi.gif", jpg);
banner_text = "Version 1.0.0";

// https://community.jmp.com/t5/Uncharted/Add-Text-to-a-Picture/ba-p/513376
{xSize, ySize} = banner << size;
gb = Graph Box(
	<<backgroundcolor("orange"), 
	FrameSize(xSize + 1, ySize + 1),
	X Scale(0, xSize + 1),
	Y Scale(0, ySize + 1), 
	<< Add Image(image(banner_extra_image), bounds(top(10), Left(1), bottom(10), Right(10))),
	<< Add Image(image(banner), bounds(top(0), Left(0), bottom(ySize), Right(xSize + 1))), 
	Text Color("White"),
	Text Font("Helvetica", 30, "Bold"),
	Text(Counterclockwise, {xSize, 10}, banner_text),
);

updated = gb[framebox(1)] << getpicture;
updated << crop(Left(1), top(1), Right(xSize + 1), bottom(ySize + 1));

nw = New Window("",
	V List Box(
		updated
	)
);

Re: How to overlay picture or text on top of another picture?

miguello — Thu, 12 Dec 2024 09:46:26 GMT

Hmmm.... Very interesting. And yes, it works!