Start An Event After Scrolling

Question

I'm new to Windows Phone apps development, and I've created a scrolling menu using the following xaml code :

    <ScrollViewer  HorizontalAlignment="Left" Margin="18,0,0,0" Name="scrollViewer1" VerticalAlignment="Top" Width="450" HorizontalScrollBarVisibility="Auto" Grid.Row="1">
        <StackPanel Height="Auto" Name="stackPanel1" Width="Auto">
            <Button Height="620" FontSize="120" Name="gotoGmail" Width="Auto">Gmail</Button>
            <Button Height="620" FontSize="120" Name="gotoYahoo" Width="Auto">Yahoo</Button>
        </StackPanel>
    </ScrollViewer>

I'd like to know whether it's possible to start an event once the user scrolls the menu from one button to another. If it is possible, i'd be grateful if you could explain how. If it's not , i'd like to hear about how could I do it using different tools rather than ScrollViewer. Thanks in advance !

Answer 1

There's no "Scrolled" event on the ScrollViewer, but what you can do is two-way bind a property to VerticalOffset. That lets you trigger an event/command from your view/viewmodel when the scroll changes.

Something like this:

<ScrollViewer VerticalOffset="{Binding VerticalOffset,Mode=TwoWay}" ...

And then in the data context:

public double VerticalOffset
{
    get { return _verticalOffset; }
    set
    {
        _verticalOffset = value;
        // call "on scroll changed" actions here
    }
}
private double _verticalOffset = 0;

---

how could I do it using different tools rather than ScrollViewer

You can of course make a scrolling menu using other approaches. I'll bet there is some nifty approach you could figure, using the WinRT transitions/animations stuff, but I'm not familiar enough with those to say. Here are some others (not sure which would be best/easiest for your scenario):

• Probably using Canvas would be a quick-and-dirty way to do it (just set up buttons that set off Canvas.Left and Canvas.Top animations).
• Extending ItemsControl along with a custom ControlTemplate would be a good approach if you want to create a re-usable component.
• I like extending Panel, but you have to do the animations manually using a DispatcherTimer, and you have to lay out the buttons yourself using Measure and Arrange.