How to get x,y position of control in control library

[deepaksm1]

I am developing image crop control. Please let me know how to find control location points X,Y on screen. (In control library I want to find out location of image on screen. Image is child of my control)

[BSick7]

When you respond to a mouse event, you can use args: MouseEventArgs to find a position. https://github.com/wsick/Fayde/blob/master/src/Input/MouseEventArgs.ts

You can use args.GetPosition(...) and pass in the UIElement you want to use as a basis. The resulting Point will be relative to the top-left coordinate of that UIElement.

[deepaksm1]

I am not using it on mouse action. I want to get partial image data to crop image on another button click.

[deepaksm1]

Is there any other way to do this?

[BSick7]

I'm guessing you have some decorator that represents the crop section and you want to figure out where that section is located within the image. Is that correct?

[deepaksm1]

Yes exactly

[deepaksm1]

It's done. Used below code to get coordinates

  var startPoint = new Point(0, 0);
            var p2 = minerva.vec2.create(startPoint.x, startPoint.y);            
            minerva.mat3.transformVec2(this.ControlImage.XamlNode.LayoutUpdater.assets.absoluteXform, p2);
            startPoint = new Point(p2[0], p2[1]);

[deepaksm1]

I am able to get cropped image data using canvas functionality using below code:

var canvas = document.getElementsByTagName("canvas")[0];
var ctx = canvas.getContext("2d");
var imgData = ctx.getImageData(startx, starty, iwidth, iheight);

How can I set this cropped image data again to Image control? "imgData.data" returns number[] but BitmapImage.SetSource accepts array buffer. How I can convert number[] to ArrayBuffer?

[BSick7]

The absoluteXform is a good find; however, I would recommend against this approach as it's very internal to the system and may not operate exactly how you intend.

Instead, I would recommend putting the Image and crop visual in some Panel (Canvas, Grid, Panel, etc.). You can then use Fayde.LayoutInformation to query the layout slot. By placing the 2 visuals in the same Panel, you are guaranteed that the layout slots are relative to the parent. The difference between the 2 layout slots is exactly the information you're searching.

[BSick7]

Regarding slicing image data

imgData is ImageData.

This interface exposes data: Uint8ClampedArray which, just like other typed arrays, has a buffer member.

I will probably start making some image editing utilites that are well tested, but until then, you can use what you have now to grab the image data and send it to SetSource(imgData.data.buffer).

[deepaksm1]

Ok Thanks, I will try this approach...