Divide By Zero Error in Edge Case with Automatic Image resizing

[ctsims]

Bug Description

There is a bug in automated image resizing when an image's existing/native size is exactly the width of the screen.

Current Behavior

There is a "divide by zero" error which can be triggered in a form when the app uses the multimedia images in a question label depending on the specific alignment of the width of the image and the size of the device.

This bug appears to occur when an image is exactly the width of the potential frame size, which is the screen width minus padding.

This was replicated with a specific image and replicated with the following virtual device profile:

Adding this 456x456 image as the multimedia image for a question label with the above device screen parameters should result in a crash. I can't quite remember if the bug was when this image was 456x456 or 480x480 (exact screen size or size minus padding maybe), but resizing to one of those should work.

Expected Behavior

Opening a form when the app uses the multimedia image as a question label shouldn’t cause a crash, and the form should display the multimedia image as part of the question label.

Reproduction Steps

Note: These steps assume you have basic knowledge of navigating and using the CommCare platform. If you are unfamiliar with how to perform basic setup steps, a getting started guide is available here.

1. Create an app which contains the provided image as a question label
   • Use the provided sample image inside of the form for the main label of a question. It doesn’t matter what the question type is
2. Create a virtual device for replication. Using Android Studio’s device manager, replicate the above virtual device profile. The screen resolution is presumed to be the important factor
3. Install the app onto the virtual device and navigate to the form.
   • The application should crash with the Divide By Zero bug
   • If you see the question with the multimedia label applied, the replication has failed. You can try changing the image width to one of the other options described above, or check to confirm that your virtual device display has both the correct screen size and pixel density.

Possible Solution

This bug is almost certainly the result of the math for the behaviour which resizes images for the screen.

Additional Information/Context

Further Context: https://dimagi.atlassian.net/browse/SUPPORT-16630

Environment details (OS name and version, etc.)

No response

[ctsims]

Flagging @dannyroberts for Mobile Backlog building

[kiran-tripathy]

/bounty $150

[algora-pbc[bot]]

💎 $150 bounty • Dimagi, Inc

This issue is eligible for rewards from CommCare's Open Source Bounty Program.

Contribution Prerequisites

Before you proceed, please read through the details of the CommCare Bounty Program

1. Make sure that you meet the eligibility criteria and have fulfilled all the requirements
2. We recommend creating appropriate accounts and signing the CLA ahead of time if you are planning on pursuing a bounty for your open source contribution

Steps to solve

1. Start working: Comment /attempt #2740 with your implementation plan
2. Submit work: Create a pull request including /claim #2740 in the PR body to claim the bounty
3. Receive payment: 100% of the bounty is received 2-5 days post-reward. Make sure you are eligible for payouts

Thank you for contributing to dimagi/commcare-android!

Add a bounty • Share on socials

[vineeth-vk11]

Hey @ctsims, I am trying to reproduce this issue. I wanted to clarify what a question's 'main label' means. Is it just the media content of the question as shown in the image? If not, how can I set the main label to a question.

[ctsims]

Hi @vineeth-vk11 , thanks for asking. Yes, by "Main Label" I just mean the image multimedia of the question itself, as opposed to an image multimedia associated with any other part of the question (the single/multiselect item choices also support multimedia, as do help labels).

[vineeth-vk11]

@ctsims thanks for the confirmation, I followed the steps but could not reproduce the issue. I added 3 text questions in a form, each question has one multimedia image and the questions have images with different widths of 456, 464 and 480. Does this happen with any image of width 456/480 or only with the above-attached image and any other suggestions which could help in reproducing the issue?