We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Issues with SFImageEditor Control

Thread ID:

Created:

Updated:

Platform:

Replies:

147091 Sep 1,2019 05:05 AM UTC Sep 5,2019 02:13 PM UTC Xamarin.Forms 5
loading
Tags: SfImageEditor
Riz Mawani
Asked On September 1, 2019 05:05 AM UTC

Hi,

I'm just wondering about the following:

1. Is it possible for me to add a TapGestureRecognizer to the control such that, when double-tapped, it would zoom into a particular point on the image? I tried adding a GestureRecognizer but the event associated with it will not fire.
2. Can I make the SfImageEditor control take up the entire Height and/or Width of its parent container? I have tried a combination of different things but cannot get the desired result.
3. Is there any way at all that I can add rounded corners to the SfImageEditor control?

Thanks in advance for any assistance you can provide for this great set of controls!

Looking forward to hearing from you soon.

Sincerely,
Riz

Rachel A [Syncfusion]
Replied On September 4, 2019 01:38 AM UTC

Hi Riz, 
 
Greetings from Syncfusion. 
 
Query 1: when double-tapped, it would zoom into a particular point on the image? 
  
As per current implementation of SfImageEditor, you can pinch zoom in and zoom out the loaded image rather than pointing to particular position on the image using double tap. Also, we would like to inform you that we have handled the gestures internally for zooming purpose. 
  
Query 2: Can I make the SfImageEditor control take up the entire Height and/or Width of its parent container?  
  
Yes, by default SfImageEditor control will take its parent height and width value accordingly. Please find the below code snippet which depicts how to set parent bounds to image editor, 
 
[XAML] 
 <Grid HeightRequest="500" WidthRequest="300" HorizontalOptions="Center" VerticalOptions="Center">
          
        <imageeditor:SfImageEditor  x:Name="editor">
        
    </imageeditor:SfImageEditor>
          </Grid>
 
 
Screenshot: 
   
If you face any problems in adapting to the layout, provide the detailed information on scenario. This will be helpful to provide you a solution. 

Query 3: Is there any way at all that I can add rounded corners to the SfImageEditor control?
 
  
Yes, this can be achieved with the help of SfBorder control "CornerRadius" property and please find the below code snippet, 
[XAML] 
  
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
                          xmlns:imageeditor="clr-namespace:Syncfusion.SfImageEditor.XForms;assembly=Syncfusion.SfImageEditor.XForms"
                          xmlns:border="clr-namespace:Syncfusion.XForms.Border;assembly=Syncfusion.Core.XForms"

             x:Class="ImageEditor.MyPage1">
    <ContentPage.Content>
        <border:SfBorder CornerRadius="20">
        <imageeditor:SfImageEditor  x:Name="editor">
        
    </imageeditor:SfImageEditor>
            </border:SfBorder>
    </ContentPage.Content>
</ContentPage>
 
 

Screenshot:
 
 
 
 
Please let us know if you have any concerns. 
 
Thanks, 
Rachel. 


Riz Mawani
Replied On September 4, 2019 04:05 AM UTC

Hi Rachel,

Thanks for your quick reply and sample code.

What I'm really trying to achieve on my end is to use the SfImageEditor Control without the built-in Toolbar and somehow remove the margin that seems to surround the image component itself. Is this possible?

Thanks again!
R

Rachel A [Syncfusion]
Replied On September 4, 2019 12:40 PM UTC

Hi Riz, 

Please find the response for the queries below.
 
 
Query 1: “SfImageEditor Control without the built-in Toolbar and somehow remove the margin that seems to surround the image” 
 
Yes, we can disable the image editor toolbar visibility using ToolbarSettings “IsVisible” property as in the below code snippet. 
[XAML]  
<border:SfBorder CornerRadius="20">
       <imageeditor:SfImageEditor x:Name="editor">
        <imageeditor:SfImageEditor.ToolbarSettings>
            <imageeditor:ToolbarSettings IsVisible="false" />
        </imageeditor:SfImageEditor.ToolbarSettings>
       </imageeditor:SfImageEditor>
      </border:SfBorder>
 
  
Query 2: “Remove the margin that seems to surround the image “
 
 
By default, image will be displayed based on its aspect fit along with some padding value which we are added internally. 
 
Thanks, 
Rachel. 


Riz Mawani
Replied On September 4, 2019 03:58 PM UTC

Thanks once again for your quick reply, Rachel.

I am easily able to display the image without the ToolBar but need to be able to remove the default padding around the image. Is there any type of workaround for this or a new feature being built that will allow the default Padding to be changed in future? I've tried to modify the Control's Margin but that does not fully solve my problem and is not always consistent.

Thanks again!

Bharathiraja K [Syncfusion]
Replied On September 5, 2019 02:13 PM UTC

Hi Riz, 
 
We are using the default padding space to display the resizing cursor that appears when shape selection and cropping image. For your requirement, we will expose a property to customize control padding and consider as a feature report. Please find the feedback link below here. 
 
 
Please cast your vote to make it count. We will prioritize the features every release based on the demands and we do not have immediate plan to implement this feature since we committed with already planned work. So, this feature will be available any of our upcoming release. 
 
Regards, 
Bharathi.  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon