How to change the image to the stencil view? about react-advanced-cropper

[hamidihekmat]

I guess what I want to do it, resize the image to the stencil view

[Norserium]

@hamidihekmat, frankly, I didn't understand what do you want to achieve. Could you give some examples or draw the image of the desired result?

[hamidihekmat]

Screen.Recording.2022-10-07.at.1.18.18.PM.mp4

Okay so when you click on the crop, on save I want the the other view to change to the cropped view without having to convert the image to base64 and changing the image src, in a way I want the image to resize to the crop view

[hamidihekmat]

And also is there way to remove the black background, I tried to set it to transparent but it's shows as grey transparent

[Norserium]

@hamidihekmat, well it's the interesting request.

If I understood you correctly, I have never seen croppers like you want to get. Could you try this example (the bottom one) and tell me how close is it to the desired cropper.

And also is there way to remove the black background, I tried to set it to transparent but it's shows as grey transparent

It's not the gray background, it's the overlay around stencil.

[hamidihekmat]

@Norserium that's perfect, where can I get the code from?

[Norserium]

@hamidihekmat, well, it's not ready now, because it depends on the new unreleased features.

When I release the new version I will give you link to the source code. But I warn you:

• the code is complicated
• you have to fix react-advanced-cropper version, because the code depends on the parts that can be easily changed during the beta testing

So, how urgent is it?

In any case, test it carefully. If you want some changes in the current behavior tell me, I will look what I can do.

[hamidihekmat]

for now it's perfect, it's kinda urgent but from the looks of it you did a really nice job. I'm amazed! I'll just wait when it's fully implemented. Then ill take the example and change the styles to chakra. ui. Thank you!

[Norserium]

@hamidihekmat, very well. I will try to find time on the weekend.

[hamidihekmat]

@Norserium enjoy your weekend man and no rush. Thanks again :)

[Norserium]

@hamidihekmat, the new features are released in 0.14.0. The source code is available here.

Don't you mind to add your result to the showcase page when it will be ready? If you don't mind, send me the final result to integrate it to documentation.

[hamidihekmat]

I found a bug, the aspect ration doesn't change once you crop the image and then rotate it. Otherwise it looks great!

Screen.Recording.2022-10-23.at.10.45.48.PM.mov

[hamidihekmat]

I image rotates but the stencil stays on the same coordinates, the default full image rotation should look like the cropped image rotation

[Norserium]

I found a bug, the aspect ration doesn't change once you crop the image and then rotate it.

That's not a bug, it's the default cropper behavior. Although, it's possible to redefine it.

I image rotates but the stencil stays on the same coordinates, the default full image rotation should look like the cropped image rotation

I didn't get, what's need to do?

[hamidihekmat]

@Norserium you see how in default view when you rotate the image rotates with the aspect ratio, if it's 16/9 then rotating 90deg will turn the image to 9/16. I would to have this feature when rotating cropped area , is this possible?

[Norserium]

@hamidihekmat, there you are.

[Norserium]

@hamidihekmat, any news?

[Norserium]

@hamidihekmat, any news?

[Norserium]

@hamidihekmat, any news?

[hamidihekmat]

@Norserium hey sorry (long busy work weeks), I was working on writing tests for it and making sure it worked perfectly for my use case. I used context api to store the cropper ref and used it to decouple cropper controls. Aside from that everything else is working perfectly fine. Thanks for all your work! You wanted to use this for showcase?

[Norserium]

@hamidihekmat, it's great!

You wanted to use this for showcase?

Yes, that would be great. It was a tricky case.

[Norserium]

@hamidihekmat, is your project public available?

[hamidihekmat]

No, my company is not allowing me to make this public, until we launch. ~April - 2023

[Norserium]

@hamidihekmat, that's okay. I will wait.

[hamidihekmat]

thanks man :)

[hamidihekmat]

Screen.Recording.2022-12-08.at.12.40.18.PM.mov

Also, is there away to restrict the zoom to stay on the image aspect ratio? I'll take a look at your code though to see if I can fix it

[Norserium]

@hamidihekmat, but if you resize an image a little bit the background aspect ratio will be changed in any case. Could you draw some pictures to illustrate your idea?

[Norserium]

@hamidihekmat, any news?

[Norserium]

@hamidihekmat, I close the issue, but feel free to reopen.