I am trying to create a draggable map image but seem unable to set fixed sizes to the canvas. On the App inventor all looks fine but on the Phone it just crashes.
What i have is a 3000x6000px work area with various horizontal and vertical blocks then a canvas set to 2000x4000px.
Any ideas why this situation would crash. The online example using a map of india works but that’s not using fixed pixel sizes.
The idea is its the plan of the inside of a building and has to be done so that i can but sprites at fixed pixel positions regardless of what device its viewed on . If i do what i think you have said which is rather than use the background as the plan us a sprite i wont be able to lock other sprites to fixed locations on the plan sprite. (think Zelda and assets to collect)
Got it working with a diagram, making heavy use of the displayAreaWidth and displayAreaHeight variables to replace screen1 width and height. Also had to adjust the conditions for when zoomed as I guess the calculations are not return exact values.
so it looks like the limits on canvas size are about 1000x2000px which I can work with by scaling a sprite to only 500x1000 so I have got that all working now but I did not realise how annoying the drag feature is. For a big sprite you ideally want to drag it from where you start touching within the sprite but the default isto drag from top left
The limits will be highly dependent on the device and the version of Android it is running. A 1000x2000 px image is going to need 8 MB minimum of RAM to store. Some older versions of Android, and Android running on resource limited devices, might only allocate 16 MB RAM total to your app, which means you’ll very quickly run into out of memory issues. Newer devices with more RAM and newer versions of Android tend to up this to 64 MB per process unless the large heap size flag for the app is turned on (e.g., games).
Force of habit!
It may not be necessary on all devices, but on some older/slower ones when the screen initialises it doesn't have enough time to capture the height and width before do the setting of things. It wasn't necessary on my Genymotion Emulator on my computer, but real devices might struggle.
One of my suggestions was to try the html Canvas. This works in a similar fashion to the AI2 canvas, you just have to hand code everything and learn a different syntax! I have worked up a demo, which shows a few of the features:
fit image to canvas
fit page to screen
allows pinch zoom in / out
programmatically display markers (2) - you could place text instead
touch on point returns coordinates (then makes a red circle). This can be used to return data through the webviewstring to provide a location name - e.g. in my example pressing on number 5 would return “Battery”. I used an alert to demonstrate.
I had to use Luke Gackle’s webviewer tools extension to get the scaling to work
In testing, scrolling and zooming response was very smooth. Use a high resolution image for the background, so that it doesn’t distort with the scaling. This runs locally on the device, but you could call a remote url.
Most of the image files used nowadays are compressed formats (jpg, png, etc). That means an image file is comparable to a zip or rar file. If you want to see what's inside, you need to decompress it. Where is an image decompressed to see it? In memory.
So the size of the image file doesn't really has anything to do with the amount of memory needed to display that image.
@Italo already answered this (compression), but more specifically, each pixel will usually be represented using 8 bits for the red, green, blue, and alpha channels. Therefore, per pixel you need 3 or 4 bytes. If you have an image that is 1000x2000px, then it is 2,000,000 pixels, and at 4 bytes per pixel that is 8 MB of RAM to store the uncompressed image to draw it on the screen.
Hi All, I managed to go from the back door as @TIMAI2 mentioned through HTML Canvas. I will create a extension for that when I have time. Now I just fixed my problem for my application. Only problem with that is when you have the bigger size picture you cannot zoom out enough to scale the picture into App inventor webviewer size. After I share the extension may be some of the developer might solve that issue. I will keep you update you soon.