This is a migrated thread and some comments may be shown as answers.

Draw Lines with Arrows.

1 Answer 221 Views
ImageEditor
This is a migrated thread and some comments may be shown as answers.
George
Top achievements
Rank 1
George asked on 07 Dec 2020, 08:49 PM

 

I am using the new Arrow shape in the ImageEditor.

My users are complaining that when they draw an arrow that have to 1st select the arrow shape and then change the thickness.

They adding the arrows to many images (pictures).
Can I create a new item (draw arrow), under 'Draw Shape' on left that will open the draw shape toolbox when the arrow shape pre selected and the thickness set to the last thickness used?

-George

1 Answer, 1 is accepted

Sort by
0
Nadya | Tech Support Engineer
Telerik team
answered on 08 Dec 2020, 06:01 PM

Hello, George,

Yes, you can add a new RadMenuItem to the CommandsStackElement.Children collection. In order to achieve the desired functionality, you should create a custom dialog that inherits from the DrawShapeDialog and customize its behavior. Please refer to the following code snippet which result is illustrated in the attached gif file:

 public partial class RadForm1 : Telerik.WinControls.UI.RadForm
 {
     decimal lastUsedThickness;
     public RadForm1()
     {
         InitializeComponent();
         RadMenuItem arrowButton = new RadMenuItem("DrawArrow");
         arrowButton.Click += this.ArrowButton_Click;
        radImageEditor1.ImageEditorElement.CommandsElement.CommandsStackElement.Children.Insert(14, arrowButton);
     }

     private void ArrowButton_Click(object sender, EventArgs e)
     {
         MyArrowDialog arrowDialog = new MyArrowDialog(this.radImageEditor1.ImageEditorElement);
         arrowDialog.TopMost = true;
         
         ((RadSpinEditor)arrowDialog.Controls[0].Controls["radSpinEditorBorderThickness"]).ValueChanged += spinEditor_ValueChanged;
         if (lastUsedThickness > 0)
         {
          ((RadSpinEditor)arrowDialog.Controls[0].Controls["radSpinEditorBorderThickness"]).Value = lastUsedThickness;
         }

         arrowDialog.Show();
     }

     private void spinEditor_ValueChanged(object sender, EventArgs e)
     {
         lastUsedThickness = (sender as RadSpinEditor).Value;
     }
 }

 public class MyArrowDialog : DrawShapeDialog
 {
     public MyArrowDialog(RadImageEditorElement imageEditorElement) : base(imageEditorElement)
     {  
        ((RadDropDownList) this.Controls[0].Controls["radDropDownListShape"]).SelectedIndex = 6;

         var spinEditor = this.Controls[0].Controls["radSpinEditorBorderThickness"] as RadSpinEditor;
         ((RadSpinEditor)this.Controls[0].Controls["radSpinEditorBorderThickness"]).ValueChanged += this.MyDialog_ValueChanged;
       
         this.ApplySettings();
     }

     private void MyDialog_ValueChanged(object sender, EventArgs e)
     {
         this.ApplySettings();
     }
 }

I hope this helps. Should you have other questions please let me know. 

Regards,
Nadya
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
ImageEditor
Asked by
George
Top achievements
Rank 1
Answers by
Nadya | Tech Support Engineer
Telerik team
Share this question
or