Quality issues when using background image on canvas

[Matthias Buhmann]

Hi There,

I´m in progress building an app which contains a question sheet. When all questions are answered i would love to export a picture containing the given answers on top of a backgroundimage.
So far so good.
My problem is, when i export the image, the resolutioen of my backgroundimage is as it should be, but the quality has dropped extremly (so much that i cannot read the text on the backgroundimage). The text layered on top is perfect.
When i just put the image as an image (not on a canvas) it is shown properly whitout quality deficiencies.

Does anyone have an idea how to fix this?

Regards Matthias

[Matthias Buhmann]

I have tryed to save in both .jpg. and .png no noticable difference.

[Italo]

Did you try setting your project Screen1 to Sizing Responsive

[Matthias Buhmann]

Yes, Screen 1 is set Responsive

The Canvas is an another screen though.

[Italo]

Post the original image and the image App Inventor saves from your canvas. Also post your blocks or aia file.

[Taifun]

what is the image size (width and height) and what is the canvas size you are using?

see also Using Images with App Inventor 

Taifun

[Matthias Buhmann]

Sorry for the delay sometimes the easyest tasks do trouble^^

Right now the app does change my resolution dont know why.

002.png input
2017_10_46_27_PMS2  output
225036 blocks
225255 canvas settings

@Taifun

Seems my picture is a bit overscaled, 3507x2550.  Its equal to a Din A4 @ 300 dpi
Could that be the issue? And if it is, how can I export a picture which will be printable on a Din A4 sheet? I could reduce the dpi I guess?


thanks so much

[Matthias Buhmann]

Tryed to scale down to half, 1275x1754, but the result is the same. Seems like the background is being compressed in some way.

No other blocks are influencing the Canvas.

[Italo]

As you can see, App Inventor 2 is not the right platform to do what you are trying to do mostly due to its limited graphics capabilities. You should explore different solutions, maybe involving an API to create a PDF or an html form in a webviewer.

[Taifun]

after using the Canvas.SaveAs method, is the size of the image still 3507x2550?

the quality of the text you are writing using the DrawText method seems to be good...

Taifun

[Matthias Buhmann]

I could draw the whole page, I just tryed to bee free from that. A drawing on the same sized canvas would be readable i think. But much work. I am far away from being able to make use of api´s or code in somthing other than this. I have looked at many app programming softwares but it seems nothing has the abilitys Appinventor at least not that easy to understand.

Thanks for answering anyways.

[Matthias Buhmann]

I had it to do that once yes. Right now its upscaling somehow to 3825x5260.

[Taifun]

you could try to write your texts onto a transparent png file using the Canvas and after that use the Overlay method from the image extension https://puravidaapps.com/image.php to merge both images. Precondition is, the size of both images is the same...

Taifun

[Matthias Buhmann]

I will try that Method tomorrow.

Thanks a lot.

[Matthias Buhmann]

Ok i have chosen to draw the whole thing. I find out its not that big of a task.

Thanks a lot for the help anyways.

Much love to the creators of this Software.