)
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

How to show dimension of shapes while resizing?

Platform: Xamarin.Forms |
Control: SfImageEditor |
Published Date: June 27, 2018 |
Last Revised Date: June 25, 2019

SfImageEditor allows you to show dimension of shapes, while resizing.

 

Step 1: Create image editor sample with all necessary assemblies.

 

Please refer the below link to create a simple SfImageEditor sample along with the ways to configure it.

https://help.syncfusion.com/xamarin/sfimageeditor/getting-started

 

Step 2: On selecting a shape, ItemSelected event will be triggered. From this, you will get settings of selected shape with Bounds property as like below,

C#

ImageEditor.ItemSelected += ImageEditor_ItemSelected;

 

private void ImageEditor_ItemSelected(object sender, Syncfusion.SfImageEditor.XForms.ItemSelectedEventArgs args)
        {
         labelGrid.IsVisible = true;           
            if (args.Settings is PenSettings)
                label.BindingContext = (args.Settings as PenSettings);
            else if (args.Settings is TextSettings)
                label.BindingContext = (args.Settings as TextSettings);
        }

 

Step 3: Please refer the following code snippet to bind Bounds property from PenSettings to get dimension of selected shape while resizing.

Note:

The value of the Bounds will be in percentage. Using Converter to convert the Bounds value to pixel.

 

Xaml:

Text="{Binding Bounds,Converter={StaticResource dimension} }"

 

<local:CustomLabel x:Name="label" WidthRequest="100" Opacity="0.5" HeightRequest="30" 
           HorizontalOptions="Start" VerticalOptions="Start" IsVisible="False"  
           TextColor="White"  TranslationY="60" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"    
            Text="{Binding Bounds,Converter={StaticResource dimension} }" 
            CurvedBackgroundColor="Black" CurvedCornerRadius="12">
        </local:CustomLabel>

 

Sample Link:

http://www.syncfusion.com/downloads/support/directtrac/general/ze/IMAGEE_1-19153849561904368512.zip

Screenshot:

The dimension of shapes in pixel output as shown below,

Dimension of shapes using xamarin SfImageEditor control.

 

 

 

 

                 

2X faster development

The ultimate Xamarin UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

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

Up arrow icon

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