Unable to get to “ScrollStates” in ScrollViewer Control

Question

I'm having a lot of trouble trying to get this working, and was hoping someone could help.

I have a ScrollViewer in my WindowsPhone app, and I'm trying to emulate a similar control to the "Date/Time Chooser" that you'd see in the native Calendar app. So my ScrollViewer contains a StackPanel with multiple square Canvases with rectangles and TextBlocks. My intent is to watch the "ScrollStates", and when the VisualState changes to "NotScrolling", I'd then check the VerticalOffset of the ScrollViewer and animate a slide to the nearest "snap-to" position (ie. aligning the square to the correct/middle position).

<ScrollViewer Name="sv" Width="100" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Disabled" Loaded="ScrollViewer_Loaded">
    <StackPanel>
        <Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
            <Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
            <TextBlock Text="1" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
        </Canvas>
        <Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
            <Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
            <TextBlock Text="2" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
        </Canvas>
        <Canvas MaxWidth="77" MaxHeight="80" MinWidth="80" MinHeight="80" Margin="3">
            <Rectangle Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="3" Width="80" Height="80" />
            <TextBlock Text="3" FontSize="36" FontWeight="Bold" TextAlignment="Center" HorizontalAlignment="Center" Width="70" Canvas.Left="6" Canvas.Top="14" LineHeight="48" />
        </Canvas>
        ...
    </StackPanel>
</ScrollViewer>

I've been looking at various examples that hook into the VisualStates, like http://blogs.msdn.com/b/ptorr/archive/2010/07/23/how-to-detect-when-a-list-is-scrolling-or-not.aspx ; http://developingfor.net/2009/02/16/fun-with-the-wpf-scrollviewer/ ; http://blogs.msdn.com/b/slmperf/archive/2011/06/30/windows-phone-mango-change-listbox-how-to-detect-compression-end-of-scroll-states.aspx ... all seem to have similar code to this:

// Visual States are always on the first child of the control template
FrameworkElement element = VisualTreeHelper.GetChild(sv, 0) as FrameworkElement; 

... which then goes on to seek out VisualStateGroup group = FindVisualState(element, "ScrollStates"); , from which they can hook an Event to when it changes.

However... whenever I try doing the VisualTreeHelper.GetChild(sv,0) as FrameworkElement , the app crashes with an exception of type 'System.ArgumentOutOfRangeException'. If I output VisualTreeHelper.GetChildrenCount(sv) , it is always "0". How is it seemingly working for everyone else? 8)

Any help would be greatly appreciated. Thanks!

(As an alternative, has anyone made this kind of "Select Box" already in a reusable control I could use instead of trying to reinvent it?)

Answer 1

您是否一直等到scrollviewer的Loaded事件触发后才尝试获取scrollviewer的子级？