locked
Why when I switch my semantic zoom, doesn't it navigate to the section? RRS feed

  • Question

  • Something is strange with my semantic zoom. I have two sections in it:

     

    And when I set the the ZoomOut, the grouping is okay, here is the image:

     

    But for example if I choose the second option, semantic zoom does not navigate me to the item clicked.

    Here are the most important parts of my program.

            <!-- from resources -->
            <CollectionViewSource
                x:Name="groupedItemsViewSource"
                Source="{Binding Groups}"
                IsSourceGrouped="False">
            
            ...
    
            <!-- Horizontal scrolling grid used in most view states -->
            <SemanticZoom x:Name="semanticZoomControl" Grid.Row="1" >
                <SemanticZoom.ZoomedInView>
                    <ListView x:Name="itemGridView" SelectionMode="None" IsItemClickEnabled="False"
                              ScrollViewer.VerticalScrollBarVisibility="Disabled"
                              ScrollViewer.VerticalScrollMode="Disabled"
                              ScrollViewer.HorizontalScrollBarVisibility="Auto"
                              ScrollViewer.HorizontalScrollMode="Auto"
                              Margin="0,-3,0,0"
                              Padding="116,0,40,46"
                              ItemTemplateSelector="{StaticResource StartItemSelector}"
                              ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
                              ItemContainerStyle="{StaticResource ListViewItemStyleFlat}">
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                    </ListView>
                </SemanticZoom.ZoomedInView>
                <SemanticZoom.ZoomedOutView>
                    <ListView x:Name="groupGridView" CanDragItems="False"
                              CanReorderItems="False" SelectionMode="None" IsItemClickEnabled="True"
                              ScrollViewer.HorizontalScrollBarVisibility="Auto"
                              ScrollViewer.HorizontalScrollMode="Auto"
                              ScrollViewer.VerticalScrollBarVisibility="Disabled"
                              ScrollViewer.VerticalScrollMode="Disabled"
                              ItemContainerStyle="{StaticResource ListViewItemStyleSimple}"
                              ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
                              ItemTemplateSelector="{StaticResource ZoomedOutSelector}">
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal"  Height="330"
                                            HorizontalAlignment="Left" VerticalAlignment="Top" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                    </ListView>
    

    What could be the reason which is happening this?

    If you feel more confortable, you can download the project from SkyDrive: http://sdrv.ms/Ma0LmE


    Thursday, July 26, 2012 4:17 PM

Answers

  • I was doing this code. And until now is so far so good.

            private void semanticZoom_ViewChangeStarted(object sender, SemanticZoomViewChangedEventArgs e)
            {
                if (!e.IsSourceZoomedInView)
                {
                    itemGridView.ScrollIntoView(e.SourceItem.Item);
                    //e.DestinationItem.Item = e.SourceItem.Item;
                }
            }

    What do you think?
    • Proposed as answer by Jesse Jiang Monday, July 30, 2012 9:35 AM
    • Marked as answer by Jesse Jiang Wednesday, August 1, 2012 8:44 AM
    Thursday, July 26, 2012 10:13 PM

All replies

  • That is because of the way you set the source of the zoomed out view. Set the item source of the zoomed out view in code as shown below

    More info in my blog post http://blogs.msdn.com/b/going_metro/archive/2012/07/04/semantic-zoom-in-windows-8-metro-applications.aspx

    Thanks.

    Mark as answer if this solves ur problem.

    Thursday, July 26, 2012 4:44 PM
  • No, it didn't work out! I don't have a grouped data. Please Shiva, can you try it in the example project?
    Thursday, July 26, 2012 5:12 PM
  • Hello Oscar,

    The feature you are trying to implement is called the Scroll Jump and it depends on implementing a grouped collection view source. As far as I know you should implement grouping in your app.

    Thanks.

    Thursday, July 26, 2012 8:34 PM
  • I was doing this code. And until now is so far so good.

            private void semanticZoom_ViewChangeStarted(object sender, SemanticZoomViewChangedEventArgs e)
            {
                if (!e.IsSourceZoomedInView)
                {
                    itemGridView.ScrollIntoView(e.SourceItem.Item);
                    //e.DestinationItem.Item = e.SourceItem.Item;
                }
            }

    What do you think?
    • Proposed as answer by Jesse Jiang Monday, July 30, 2012 9:35 AM
    • Marked as answer by Jesse Jiang Wednesday, August 1, 2012 8:44 AM
    Thursday, July 26, 2012 10:13 PM
  • Looks good.

    Thursday, July 26, 2012 11:58 PM