Let me start by saying that our OutSystems version is at 11 and this is a mobile application. I have added the .oml as an attachment. The problem is in the PhotoOverview screen -> EditImage Client Action. And I also made this video to show the problem (for some reason the embedding shows up in the preview but not in the post itself so here is the url of the problem: https://youtu.be/9H6Hs4UpSg4)


The application works as follows:

First screen
1.  Enter an order number
2. Choose photo type
3. Start making picture (button)

Second screen

1. Take the picture

Third screen
1. The photo will be displayed in the photo overview. In the photo overview you can choose to take another photo, you can delete the photo or you can adjust the photo (here is the problem at the moment)
2. When you are completely done, the photos can be uploaded (this feature is not currently available)

The problem

The problem is adjusting the photo. In the photo overview I have added two buttons (draw and delete) to the photo. When I choose to draw for the first time, a new photo is made neatly. When I perform the same process for the second time, the application is closed. No messages are displayed in ServiceCenter, so I can't see what the problem is there.


In the EditImage client action I try to ensure that you can draw over the photo and it is then saved with the addition you just drew. I have already tried to use the update entity, but it does not work (I am not sure why). That is why you now first see a delete entity and then a create entity.


Does anyone have an idea where exactly it goes wrong or what I should implement to prevent it from crashing? I also tried to do it with an IF but that did not work out properly. Basicly what I did is hide the button when it is clicked for the first time, but what happened is that all buttons got hidden and not the only one that I clicked (on multiple photos). UPDATE: it seems that the app is not crashing totally, because when I check my application it is still open. But when I click the application again it is restarting the application.


PS.I am using https://www.outsystems.com/forge/component-overview/2489/sketch-plugin for the sketching part (but I am not using that one, since I forked the github module to change some stuff in the module to make it work for our organization). I also tried using https://www.outsystems.com/forge/component-overview/6370/image-editor-plugin but it is not working with my Android version (allready made a post about it so the component owner can check it)

First off, great job providing detail on the issue you're having...makes it much easier to answer.

That said, can you upload an OML with only the dependencies required to reproduce the issue. There are broken references including a couple of themes, and several components that I can't find on the Forge, that prevent testing the OML as provided.

Also, can you share where you've looked for error info in Service Center?

G. Andrew Duthie wrote:

First off, great job providing detail on the issue you're having...makes it much easier to answer.

That said, can you upload an OML with only the dependencies required to reproduce the issue. There are broken references including a couple of themes, and several components that I can't find on the Forge, that prevent testing the OML as provided.

Also, can you share where you've looked for error info in Service Center?

Hi G. Andrew Duthie,

I checked at the monitoring part as you can see below. There are several errors, but when I am doing the actions to come to the error part there is nothing showing up. Are there any other parts that I could check? 

I tried removing a few dependencies. I hope this works? Don't mind the styling in the OML because I removed our themes and did change it back to the default OutSystems UI theme.

Still missing "TekenApp" dependency...

G. Andrew Duthie wrote:

Still missing "TekenApp" dependency...

Basicly that's the Sketch module on the forge (https://www.outsystems.com/forge/component-overview/2489/sketch-plugin), only difference is the Github repo behind it. I changed the OML to that component so hopefully it is working now? 


Was able to get this version running on my device, and I can reproduce the issue.

I did find one error in my error log:

A fatal error has occurred. Please contact OutSystems support: Unable to start activity ComponentInfo{com.outsystemscloud.[environment].PhotoSketch/au.com.blinkmobile.cordova.sketch.TouchDrawActivity}: java.lang.NullPointerException: Attempt to invoke virtual method 'boolean android.graphics.Bitmap.isMutable()' on a null object reference

It appears to me that on the second attempt to edit, the StartSketch action is not getting a valid image, and if the DeleteImage then runs, there is no image stored for the resource, so the second time, you end up crashing the app.

As a next step, I'd recommend debugging the app while running on hardware. Docs can be found here:

https://success.outsystems.com/Documentation/11/Developing_an_Application/Troubleshooting_Applications/Debugging_Applications

If you step through the logic for EditImage, you may be able to find out where and why your image data is going missing, which should help you remedy the issue.

I'd also recommend taking a look at the support forum for the Sketch plugin (https://www.outsystems.com/forge/component-discussions/2489/Sketch+Plugin) to see if any of the issues listed there are related to what you're seeing.

I guess I found out what is going wrong by using the debugger. As you allready mentioned somehow I am loosing the binary image. To check if the binary was really losing the application I placed an IF to check if StartSketch.Image = NullBinary and yes.. it came out in the True branch as I was seeing the message implemented over there. And as you can also see in the debugging results, the Binary is empty on a second attempt to edit the image. 

The error message is saying "Failed to generate sketch, invalid data url:data:image/jpeg;base64 ....................................."


Still, I see what is going wrong now.. but still no clue on how to solve this problem. Anyone have any ideas? In the meantime I'll try some things to see if I can get it to work.

I am not sure why it is losing it's binary data because in the first StartSketch I am telling it to use the 

GetLocalResources.List.Current.LocalResource.BinaryContent

How can that be empty the next time?

Step by step using the debugger to see what is happening the first time and what is happening the second time.

First time 

1. Push the edit picture button


2. Check if binary is empty

3. Assign data to localstorage 

4. Delete image I just assigned

5. Create a new image with the data I just assigned to EditImage local variable and you can see the binary is filled

6. Refresh the data so I see the new image on my screen


Second time

1. Push the edit picture button again


For some reason it does not continu to the IF after this and the app closes again. And I am getting some errors in ServiceCenter. Hopefully somebody sees a problem within this flow and this debugger info helps finding the problem.


Unfortunately, I'm heading out the door, so I don't have time to dig deeper into this, but it's seeming it could be an issue in the component itself.

You might take a look at opening up the Sketch Plugin component and place some breakpoints there, and step through...perhaps there's an issue there that's causing the binary data to get lost on the second invocation.

Solution

I Think the app is crashing because the image is getting too big. As soon as I place a resize in the flow and make use of the resized image, the app does not crash anymore. I did not think of this known issue (as stated in the Sketch component), because when I make the initial photo I allready resize it. But somehow I need to resize it here again to prevent the app from crashing.

Solution

Interesting...I'm a bit surprised, though, given that it looks like your image is just 250kB, and I wouldn't expect that to be too big.

Is resizing an acceptable workaround for your use case?


G. Andrew Duthie wrote:

Interesting...I'm a bit surprised, though, given that it looks like your image is just 250kB, and I wouldn't expect that to be too big.

Is resizing an acceptable workaround for your use case?


Yeah I know. It is a bit strange because 250kB should not be too big. Resizing works but is no final solution, because for example: If I edit the image like 10 times, the quality of the image keeps decreasing because of the resizing. For the development purposes I can still use this for now. And.. I think the issue persists in the component and since I am not an Android developer it's hard for me to debug that part.

I guess for now this is how far I can get.




I see that you commented on the ImageEditorPlugin component, so I'm assuming you've tried using that. Interestingly, I tried that one and did not get the error you saw, but instead I get a black screen for the editor, rather than the photo. I may play with it a bit more to see if I can get it to work, but it seems like the editor isn't getting the image data correctly, and errors out.

G. Andrew Duthie wrote:

I see that you commented on the ImageEditorPlugin component, so I'm assuming you've tried using that. Interestingly, I tried that one and did not get the error you saw, but instead I get a black screen for the editor, rather than the photo. I may play with it a bit more to see if I can get it to work, but it seems like the editor isn't getting the image data correctly, and errors out.

As far as I know and have been told by guys in that forum post, the component is not compatible with the latest Android version. As you can see in the thread the component owner is going to make a fix for it, but I am not sure when that is available.