[Question] How Set canvas size ?

[santoshgistto]

Placeholder

How Set canvas size ?

[hm21]

Can you describe more in detail what you mean?

[adamkoch]

Actually I had a similar question, not sure if the same as what @santoshgistto is asking, but in my case, I want to input a fixed ratio image and then only have edits allowed on the image and not outside the image. So canvas size == image size in my case.

Here's an example of a 1:1 ratio image being loaded and what I mean:

So ideally I want to have 1:1 image in, and edits only allowed within the image and then save and output 1:1 image.

[hm21]

It's currently not possible to do this directly in the editor, but I'm adding it to my roadmap.
However, if you need this feature right now, you can do it yourself by using the image package. An example of how to crop the image to a specific size can be seen here.
And don't forget to set in the generation configs that it capture the full editor area, like below.

 ImageGeneratioConfigs(
      generateOnlyDrawingBounds: false,
    )

[adamkoch]

Got it, thanks. Right now I crop the image myself already and pass it into pro_image_editor so it comes out the right size. generateOnlyDrawingBounds=false is a great tip for now though 👍

[santoshgistto]

Thank you

[adamkoch]

Thanks for all the fixes/updates! So is the aspect ratio thing I mentioned addressed in 3.0.5? If so, I couldn't see how to enable it?

[hm21]

@adamkoch Not yet, I just moved it to the roadmap so I closed the question.

[hm21]

@adamkoch I just added the option to capture only the background image area, which we can enable in the imageGenerationConfigs with the captureOnlyBackgroundImageArea flag. This flag is now enabled by default. If a layer is outside the background image, it will show the user a bit hidden because I overlay the background color with opacity on the layer. If you want to hide it completely, you can set the opacity from the option outsideCaptureAreaLayerOpacity to 1 in the configs of the imageEditorTheme like below:

 configs: ProImageEditorConfigs(
      imageEditorTheme: const ImageEditorTheme(
                outsideCaptureAreaLayerOpacity: 1,
   ),
)

I didn't release this version as a stable release, but as a prerelease 3.0.7-dev.1 so that you can test it first. After you test it and the case that everything works fine by you, I will release it as a stable release.

[adamkoch]

Thank you @hm21. I tried and it works really well. With outsideCaptureAreaLayerOpacity: 1, is what I was after.

I did a weird glitch in landscape mode on iphone simulator - the drawing overlay seems to show in the safearea zone even though there is a black color set for the Scaffold. It may just be a glitch on the simulator. I don't have a real device to test right now. But I think it's a fairly minor thing.

[adamkoch]

Oh also, I realized it's not a great idea to set outsideCaptureAreaLayerOpacity: 1 because deleting items means dragging the item over a completely blacked out area which is a bit confusing. So probably still better to keep it at some value <1.