CODEWITHSUNDEEP
c#imagexamarinxamarin.formsposition
skt
skt

Reputation: 599

How do I change an image's position (x and y) dynamically at runtime in Xamarin.Forms?

I am using Xamarin.Forms and would like to change the position of an image dynamically (in code behind).

I have initially loaded the image statically by define it in an .xaml file. Then I would like to update the image's position (horizontally and vertically) dynamically depending upon the a run time value from the user. The image should move as per a user input value.

Unfortunately I am not able to find a code sample for this.

How can I change the position of an image dynamically (in code behind)?

Upvotes: 3

Views: 4096

Answers (2)

muzaa18
muzaa18

Reputation: 31

image.TranslationX = 20; image.TranslationY = 20;

Upvotes: 0

Bruno Caceiro
Bruno Caceiro

Reputation: 7199

You can manipulate the X and Y coordinates of an element using TranslationX and TranslationY properties.

To animate you can use the method TranslateTo:

public static System.Threading.Tasks.Task<bool> TranslateTo (this Xamarin.Forms.VisualElement view, double x, double y, uint length = 250, Xamarin.Forms.Easing easing = null);

Where:

  • view - The view to tanslate.

  • x - The x component of the final translation vector.

  • y - The y component of the final translation vector.

  • length - The duration of the animation in milliseconds.

  • easing - The easing of the animation.

Example how to animate the translation:

await image.TranslateTo (-100, 0, 1000);    // Move image left
await image.TranslateTo (-100, -100, 1000); // Move image up
await image.TranslateTo (100, 100, 2000);   // Move image diagonally down and right
await image.TranslateTo (0, 100, 1000);     // Move image left
await image.TranslateTo (0, 0, 1000);       // Move image up

Upvotes: 2

Related Questions