How can I bind index value to element param in Scr

Question

I am new to programming. I am trying to bing index value of an element in scrollview to a scrollview property called ScrollToAsync, so that it will automatically centre the selected element of scrollview.

Below is my code for INotifyPropertyChanged

class LVItem : INotifyPropertyChanged
{
    private int _tIndex;

    public int TIndex
    {
        get { return _tIndex; }
        internal set
        {
            _tIndex = value;
            OnPropertyChanged("TIndex");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

and the ScrollToAsnyc property of ScrollView

scroll.ScrollToAsync(sLayout.Children[index], ScrollToPosition.Center, true);

I want here 'index' to be binded.. can we bind it? If yes, how? please help me on this..

Below is the code of horizontal scrollview

//horizontal list
StackLayout sLayout = new StackLayout()
{
  Orientation = StackOrientation.Horizontal
 };
for (int i = 0; i<itemLst.Count; i++)
 {
    Label label = new Label()
    {
       HorizontalTextAlignment = TextAlignment.Center,
       TextColor = Color.Black,
       FontSize = Device.GetNamedSize(NamedSize.Medium, new Label())
     };
    label.Text = itemLst[i];

    gestureRecognizer = new TapGestureRecognizer
    {
       Command = new Command(TapL_Tapped),
       CommandParameter = label,
     };

    label.GestureRecognizers.Add(gestureRecognizer);

    sLayout.Children.Add(label);
 }
   ScrollView scroll = new ScrollView
   {
      Orientation = ScrollOrientation.Horizontal,
      Content = new StackLayout
      {
        Children =
        {
            sLayout
        }
      }
   };

Answer 1

You can create a custom ScrollView with a custom bindable Index property.

public class CustomScrollView : ScrollView
{
    public static readonly BindableProperty IndexProperty = BindableProperty.Create (
        propertyName: nameof (Index),
        returnType: typeof (int),
        declaringType: typeof (CustomScrollView),
        defaultValue: 0,
        defaultBindingMode: BindingMode.TwoWay,
        propertyChanged: HandleIndexChanged
    );

    static void HandleIndexChanged (BindableObject bindable, object oldValue, object newValue)
    {
        var view = (CustomScrollView)bindable;
        view.Index = (int)newValue;

        // Call your view.ScrollToAsync here.
        // Depending on the structure of your XAML you could call
        // it using view.Content to go through the control tree.
        // Such as (view.Content as StackLayout).Children[newValue]
    }

    public int Index
    {
        get { return (int)GetValue (IndexProperty); }
        set { SetValue (IndexProperty, value); }
    }
}

You can then reference this custom ScrollView in your XAML page instead of the normal one by adding this part to your ContentPage declaration:

xmlns:custom="clr-namespace:[YourNamespace];assembly=[YourAssembly]"

And referencing the control as follows:

<custom:CustomScrollView Index="{Binding TIndex}" />