The customer has a requirement where they need to get image and display it in the image view. Few images are not displayed even though images are bind to the image view.
*It is throwing warning “[WARN] : OpenGLRenderer: Bitmap too large to be uploaded into a texture (4196x3363, max=4096x4096)”.*
I
{panel}
This issue is happening because of size 4196x3363, max=4096x4096. The log mentions the max size max=4096x4096. Is there any solution or workaround for this issue?
Note : This issue is on Nexus 7(OS 6.0.1) and Samsung s4(OS 4.4) devices. It is working fine on Pixel(9.0) device. Tested with 8.0.2.GA Ti SDK and 8.2.0.GA Ti SDK.
{panel}
Sample Test Code:
var win = Ti.UI.createWindow({
backgroundColor : '#fff'
});
win.add(Ti.UI.createImageView({
image : Ti.Filesystem.getFile(Ti.Filesystem.resourcesDirectory, 'test.png'),
width : Ti.UI.SIZE,
height : Ti.UI.SIZE,
borderColor : 'red'
}));
win.open();
*Steps to reproduce:*
1. Create a sample classic project
2. Replace the app.js with attached app.js content.
3. Place the attached test.png under “Resources” folder.
4. Run the app in Nexus 7 device.
*Expected*: Image should bee rendered properly.
*Actual:* Image not rendered and throwing warning in the console.
*Note:*
We tested it and able to reproduce with the big image as like the customer image on HTC M8 eye v6.0.1
The GPUs on devices have a limitation on texture size, this is more apparent on older devices. This is not a Titanium issue, but device specific. However, you should be able to mitigate this issue by resizing your images.
const win = Ti.UI.createWindow({ backgroundColor : 'white' }); const image = Ti.Filesystem.getFile(Ti.Filesystem.resourcesDirectory, 'test.png').read(); const scale = 4096/Math.max(image.width, image.height); const imageResized = image.imageAsResized(image.width * scale, image.height * scale); const imageView = Ti.UI.createImageView({ image: imageResized, width: Ti.UI.SIZE, height: Ti.UI.SIZE, borderColor : 'red' }); win.add(imageView); win.open();