George Isaac
George Isaac

Reputation: 589

Get position of a image inside view cell listview in Xamarin forms

I have a listview with view cell.Inside the listview I have a image( using absolute layout with ratio) which i use for some animation.To do animation I need the x and y coordinates. I am extending the image as

class MyImage : Image
{
   public void AnimateImage(double value)
   {
      this.LayoutTo(new Rectangle(this.X, this.Y - (value), 20, value), 
   }
}

I need to get the x and y coordinates during the time of loading(not by using any events).Through this code am not getting the correct x,y coordinates. Value am getting with the help of bindable property.

Upvotes: 0

Views: 231

Answers (1)

nevermore
nevermore

Reputation: 15786

What do you mean by Through this code am not getting the correct x,y coordinates.? What is wrong?

I use you code and it works on my side.

I create a ListView with image in ViewCell and is a layout by absolute layout:

 <ListView  x:Name="listView" RowHeight="200">

        <ListView.ItemsSource>
            <x:Array Type="{x:Type x:String}">
                <x:String>mono</x:String>
                <x:String>monodroid</x:String>
                <x:String>monotouch</x:String>
                <x:String>monorail</x:String>
            </x:Array>
        </ListView.ItemsSource>

        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <AbsoluteLayout AbsoluteLayout.LayoutBounds="0,0,500,100" AbsoluteLayout.LayoutFlags="WidthProportional" Padding="5,0,0,0">

                        <local:MyImage Source="Images"
                         AbsoluteLayout.LayoutBounds=".5,1,.1,.5" AbsoluteLayout.LayoutFlags="All" />

                    </AbsoluteLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

And in the code behind, i use you code and the animation works well:

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
    }
}

public class MyImage : Image{

    public MyImage() {

        NSTimer.CreateScheduledTimer(3, true,  (obj) =>
        {
            AnimateImage(30);
        });
    }

    public void AnimateImage(double value)
    {
        Console.WriteLine(this.X);
        Console.WriteLine(this.Y);

        this.LayoutTo(new Rectangle(this.X, this.Y - (value), 20, value), 500);
    }
}

The Y of image reduce 50 every 3 seconds and the height of image change to 50.

Am I doing something different with you?

Here is a gif:

gif

Update:

Add a little delay before call the animation as I mentioned in my comment:

public MyImage() {

    Task.Delay(100).ContinueWith(t => AnimateImage(30));

}

Upvotes: 1

Related Questions