How to combine Semantic Zoom and Listbox for Snapped View

Question

I have a Grouped Items Page created from VS11 template. This page has a GridView for normal view and a ListView that is shown when the page is snapped. I need to implement Semantic Zoom and still be able to snap the page.

I tried moving the GridView SemanticZoom.ZoomedInView so I have

    <ScrollViewer x:Name="itemListScrollViewer" ...
       <Listview ...
    </ScrollViewer>

    <SemanticZoom Grid.Row="1"  >
        <SemanticZoom.ZoomedInView>
            <GridView ...
        </SemanticZoom.ZoomedInView>
    </SemanticZoom>

When the page is not snapped the ListView is hidden and when the page is snapped the gridView is hidden. The problem is that in snapped view the ListBox does not scroll and does not react to item clicks.

sdb · Answer 1 · 2012-04-26T15:39:20.177

Do you want the snapped view to also have semantic zoom? In those cases, what I have done is implement two different SemanticZooms, one for landscape and one for snapped, and then showed only the correct one for current visual state. So starting point would be this:

<SemanticZoom x:Name="semanticZoom" Visibility="Visible">
    <SemanticZoom.ZoomedOutView>
        <GridView  ...
    </SemanticZoom.ZoomedOutView>

    <SemanticZoom.ZoomedInView>
        <GridView  ...
    </SemanticZoom.ZoomedInView>
</SemanticZoom>


<SemanticZoom x:Name="semanticZoomSnapped" Visibility="Collapsed">
    <SemanticZoom.ZoomedOutView>
        <ListView ...
    </SemanticZoom.ZoomedOutView>

    <SemanticZoom.ZoomedInView>
        <ListView ...
    </SemanticZoom.ZoomedInView>
</SemanticZoom>

Or if you don't need semantic zoom in the snapped mode, just try your current approach but try hiding the SemanticZoom element instead of the GridView inside it. And of course make sure that ListView's isItemClickEnabled is set to true etc.

P.S. I suppose where you say ListBox you mean ListView? Since an element called ListBox also exists.

yes, I mean ListView (I am still in WP7 terminology:) This works but I do not need semantic zoom in snap, so it is quite a waste — Igor Kulman, Apr 26 '12 at 15:44
Heh ok. What about the latter approach, ie. hiding your SemanticZoom element, setting isItemClickEnabled to true etc. Also see http://stackoverflow.com/questions/10332867/the-scrollviewer-does-not-scroll in case that helps — sdb, Apr 26 '12 at 15:47
isItemClickEnabled=true from the begining but simply does not work. I found a solution: switch the order of SemanticZoom and ScrollViewer. Strange, but works. — Igor Kulman, Apr 28 '12 at 10:17

score 0 · Accepted Answer · answered Apr 28 '12 at 10:16

I found a very strange way to fix the problem. When I switch the ordet of SemanticZoom an ScrollViewer like

<SemanticZoom Grid.Row="1"  >
    <SemanticZoom.ZoomedInView>
        <GridView ...
    </SemanticZoom.ZoomedInView>
</SemanticZoom>

<ScrollViewer x:Name="itemListScrollViewer" ...
   <Listview ...
</ScrollViewer>

Than everything works. Any idea why?

How to combine Semantic Zoom and Listbox for Snapped View

2 Answers2