如何在C# Xamarin.Forms Android中用ImageButton实现水平切换

步骤1：修改XAML为ScrollView添加名称 #

首先给ScrollView添加一个命名引用，方便在代码中调用滚动方法：

<AbsoluteLayout>
    <ScrollView x:Name="horizontalScrollView" 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>

步骤2：添加索引跟踪与滚动逻辑 #

在代码后台添加以下内容：

1. 声明变量跟踪当前显示的项索引：

private int currentIndex = 0;

2. 实现左右按钮的点击事件：

private void btnMoveLeft(object sender, EventArgs e)
{
    if (currentIndex > 0 && imgs.Children.Count > 0)
    {
        currentIndex--;
        // 滚动到上一个项并居中显示
        horizontalScrollView.ScrollToAsync(imgs.Children[currentIndex], ScrollToPosition.Center, true);
    }
}

private void btnMoveRight(object sender, EventArgs e)
{
    if (currentIndex < imgs.Children.Count - 1)
    {
        currentIndex++;
        // 滚动到下一个项并居中显示
        horizontalScrollView.ScrollToAsync(imgs.Children[currentIndex], ScrollToPosition.Center, true);
    }
}

3. 更新删除按钮逻辑，确保删除后索引保持有效：

deleteButton.Clicked += async (sender, args) => {
    int itemIndex = imgs.Children.IndexOf(stackLayout);
    listDelete.Add(Convert.ToInt32(deleteButton.ClassId));
    imgs.Children.Remove(stackLayout);

    // 如果删除的是当前项或之前的项，调整索引
    if (itemIndex <= currentIndex)
    {
        currentIndex = Math.Max(0, currentIndex - 1);
    }
    // 确保索引不超出剩余项范围
    currentIndex = Math.Min(currentIndex, imgs.Children.Count - 1);
};

核心说明 #

• 使用ScrollToAsync方法可以直接将指定元素滚动到视图中，ScrollToPosition.Center确保项居中显示，最后一个参数控制是否启用动画过渡。
• currentIndex变量用于跟踪当前焦点项，避免滚动超出边界。
• 删除项时调整索引，保证后续滚动操作的正确性。

内容的提问来源于stack exchange，提问作者F205