how to move horizontally using ImageButton in C# xamarin forms android?

Issue

I'm trying to move horizontally using ImageButtons in C# xamarin forms android.

My app looks like this:

What I want to do if it's possible is move horizontally using those ImageButtons. I'd like to touch the ImageButton and go through each StackLayout that my code generate dynamically. But I don't know how could I do that. I will let my code here:

code page.xaml:

<AbsoluteLayout>
    <ScrollView HorizontalScrollBarVisibility="Never" Orientation="Horizontal" HorizontalOptions="Center">
        <StackLayout x:Name="imgs" Orientation="Horizontal" HorizontalOptions="Center">

        </StackLayout>
    </ScrollView>
    <ImageButton x:Name="btnLeft" Clicked="btnMoveLeft" Source="drawable/left.png" WidthRequest="50" HeightRequest="50" AbsoluteLayout.LayoutBounds="0.009,0.5,100,100" AbsoluteLayout.LayoutFlags="PositionProportional"></ImageButton>
    <ImageButton x:Name="btnRight" Clicked="btnMoveRight" Source="drawable/right.png" WidthRequest="50" HeightRequest="50" AbsoluteLayout.LayoutBounds="0.95,0.5,100,100" AbsoluteLayout.LayoutFlags="PositionProportional"></ImageButton>
</AbsoluteLayout>

code Page.xaml.cs:

private void btnMoveLeft(object sender, EventArgs e)
    {
        
    }
    private void btnMoveRight(object sender, EventArgs e)
    {

    }
public void generateImg(MediaFile file2)
    {
        StackLayout stackLayout = new StackLayout();
        stackLayout.Orientation = StackOrientation.Vertical;
        StackLayout stackLayoutMinimo = new StackLayout();

        Image im = new Image();
        im.ClassId = contador.ToString();
        im.Source = ImageSource.FromFile(file2.Path);

        im.HeightRequest = 600;
        im.WidthRequest = 400;
        im.MinimumHeightRequest = 600;
        im.MinimumWidthRequest = 400;

        im.VerticalOptions = LayoutOptions.End;
        im.HorizontalOptions = LayoutOptions.End;
        im.Aspect = Aspect.AspectFill;

        stackLayout.Children.Add(im);

        Button deleteButton = new Button();
        deleteButton.ClassId = contador.ToString();
        deleteButton.Text = "Borrar imagen";
        deleteButton.VerticalOptions = LayoutOptions.CenterAndExpand;
        deleteButton.HorizontalOptions = LayoutOptions.Center;
        deleteButton.MinimumWidthRequest = 100;
        deleteButton.ClassId = contador.ToString();
        deleteButton.AutomationId = contador.ToString();
        deleteButton.Clicked += async (sender, args) => {
            listDelete.Add(Convert.ToInt32(deleteButton.ClassId));
            stackLayout.Children.Remove(im);
            stackLayout.Children.Remove(deleteButton);
        };        
        stackLayout.Children.Add(deleteButton);

            imgs.Children.Add(stackLayout);
}

I hope someone can guide me. Thank you very much!

Solution

SOLUTION

Finally, I use a CarouselView, it worked perfectly. With this code I resolved my problem. I left my code here. Maybe it helps someone.

code page.xaml:

      <AbsoluteLayout>
          <StackLayout Padding="5">
              <CarouselView x:Name="carousel" HeightRequest="600" IndicatorView="{x:Reference contImgs}">
                  <CarouselView.ItemTemplate>
                      <DataTemplate>
                          <Image x:Name="activeImg" Source="{Binding Source}" Aspect="AspectFill"></Image>
                      </DataTemplate>
                  </CarouselView.ItemTemplate>
              </CarouselView>
             <IndicatorView x:Name="contImgs" IndicatorColor="#bbb" SelectedIndicatorColor="#000" IndicatorSize="12" IndicatorsShape="Circle"></IndicatorView>
          </StackLayout>
          <ImageButton Source="drawable/icon_trash.png" WidthRequest="100" Clicked="btnDeleteImg" HeightRequest="100" AbsoluteLayout.LayoutBounds="0.98,0.07,50,50" AbsoluteLayout.LayoutFlags="PositionProportional"></ImageButton>
          <ImageButton x:Name="left" Clicked="btnMoveLeft" Source="drawable/left.png" WidthRequest="50" HeightRequest="50" AbsoluteLayout.LayoutBounds="0.009,0.5,100,100" AbsoluteLayout.LayoutFlags="PositionProportional"></ImageButton>
          <ImageButton x:Name="right" Clicked="btnMoveRight" Source="drawable/right.png" WidthRequest="50" HeightRequest="50" AbsoluteLayout.LayoutBounds="0.95,0.5,100,100" AbsoluteLayout.LayoutFlags="PositionProportional"></ImageButton>
      </AbsoluteLayout>

code Page.xaml.cs:

private List<Image> imgsCarrousel = new List<Image>();

public void generarImg (MediaFile file2)
{
    StackLayout stackLayout = new StackLayout();
            stackLayout.Orientation = StackOrientation.Vertical;
            StackLayout stackLayoutMinimo = new StackLayout();

            Image im = new Image();
            im.ClassId = contador.ToString();
            im.Source = ImageSource.FromFile(file2.Path);

            im.HeightRequest = 600;
            im.WidthRequest = 400;
            im.MinimumHeightRequest = 600;
            im.MinimumWidthRequest = 400;

            im.VerticalOptions = LayoutOptions.End;
            im.HorizontalOptions = LayoutOptions.End;
            im.Aspect = Aspect.AspectFill;

            stackLayout.Children.Add(im);

            ImageButton deleteButton = new ImageButton();
            deleteButton.ClassId = contador.ToString();
            deleteButton.Source = "drawable/icon_trash.png";
            deleteButton.HeightRequest = 50;
            deleteButton.WidthRequest = 50;
            deleteButton.VerticalOptions = LayoutOptions.CenterAndExpand;
            deleteButton.HorizontalOptions = LayoutOptions.Center;
            deleteButton.MinimumWidthRequest = 100;
            deleteButton.ClassId = contador.ToString();
            deleteButton.AutomationId = contador.ToString();
            deleteButton.Clicked += async (sender, args) => {
                listDelete.Add(Convert.ToInt32(deleteButton.ClassId));
                stackLayout.Children.Remove(im);
                stackLayout.Children.Remove(deleteButton);
            };        
            stackLayout.Children.Add(deleteButton);

            
            ImageButton imChica = new ImageButton();
            imChica.ClassId = contador.ToString();
            imChica.Source = ImageSource.FromFile(file2.Path);
            imChica.HeightRequest = 100;
            imChica.WidthRequest = 100;
            imChica.MinimumHeightRequest = 100;
            imChica.MinimumWidthRequest = 100;
            imChica.VerticalOptions = LayoutOptions.End;
            imChica.HorizontalOptions = LayoutOptions.End;
            imChica.Aspect = Aspect.AspectFill;
            imChica.Clicked += async (sender, args) => {
                
            };

            stackLayoutMinimo.Children.Add(imChica);
            imgsMinimo.Children.Add(stackLayoutMinimo);


            imgsCarrousel.Add(im);
}

Of course, finally i need this line to set the images in my Page.xaml.cs:

carousel.ItemsSource = imgsCarrousel;

Answered By - F205