0

I have a GridView in SemanticZoom.ZoomedOutView and a ListView in SemanticZoom.ZoomedInView. I require when clicking an item in the zoomed out view (GridView) that the zoomed in view will not show, instead it will activate the same view as when clicking an item in the zoomed in view. I have solved this by following the instructions here which uses a custom Grid implementing ISemanticZoomInformation.

Now I also need to synchronise the GridView and ListView so the items being displayed is the same just in a different format. What is the best way to achieve this?

So far I have tried to get the scroll position of the view but I haven't worked out how I can then get the first item that is visible on the display so I can make the other view display the same item position.

Here's the xaml for the two semantic zoom views:

    <SemanticZoom x:Name="semanticZoomControl" Grid.Row="2" Grid.ColumnSpan="100" ViewChangeStarted="OnViewChangeStarted" ViewChangeCompleted="OnViewChangedCompleted">
        <SemanticZoom.ZoomedInView>
            <ListView
        x:Name="itemsFullListView"
        TabIndex="1"
        Grid.Row="2"
        ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
        ItemTemplate="{StaticResource ItemsListTemplate}"
        SelectionMode="Extended"
        IsSwipeEnabled="True"
        IsItemClickEnabled="True"
        ItemClick="OnSelectedItem"
                SelectionChanged="itemsFullListView_SelectionChanged">
                <ListView.Header>
                    <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="200"/>

                    </Grid.ColumnDefinitions>

                    <TextBlock Grid.Row="1" Grid.Column="0" Text="Description" FontSize="20" FontWeight="Bold" Margin="5 0"/>

                    </Grid>

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


        <SemanticZoom.ZoomedOutView>
            <local:SemanticGrid>
            <GridView
        x:Name="itemGridView"
        AutomationProperties.AutomationId="ItemsGridView"
        AutomationProperties.Name="Items"
        TabIndex="1"
        Grid.Row="1"
        Grid.RowSpan="100"
        Grid.ColumnSpan="100"
        Padding="30,0,30,0"
        ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
        ItemTemplate="{StaticResource Standard250x250ItemTemplate}"
        SelectionMode="Extended"
        IsSwipeEnabled="True"
        IsItemClickEnabled="True"
        ItemClick="OnSelectedItem"
                SelectionChanged="itemGridView_SelectionChanged" 
                ScrollViewer.IsHorizontalScrollChainingEnabled="False"
                />
            </local:SemanticGrid>
        </SemanticZoom.ZoomedOutView>
    </SemanticZoom>

Here's SemanticGrid:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using Windows.UI.Xaml.Controls;

namespace App2
{
    public class SemanticGrid: Grid, ISemanticZoomInformation
    {
        public void CompleteViewChange()
        {

        }

        public void CompleteViewChangeFrom(SemanticZoomLocation source, SemanticZoomLocation destination)
        {
        }
    public void CompleteViewChangeTo(SemanticZoomLocation source, SemanticZoomLocation destination)
    {
    }

    public void InitializeViewChange()
    {
    }

    public bool IsActiveView
    {
        get;
        set;
    }

    public bool IsZoomedInView
    {
        get;
        set;
    }

    public void MakeVisible(SemanticZoomLocation item)
    {

    }

    public SemanticZoom SemanticZoomOwner
    {
        get;
        set;
    }

    public void StartViewChangeFrom(SemanticZoomLocation source, SemanticZoomLocation destination)
    {
    }

    public void StartViewChangeTo(SemanticZoomLocation source, SemanticZoomLocation destination)
    {
    }
}

}

star
  • 61
  • 7
  • So you want it so that when you click on an item in the ZoomedOutView, it scrolls over to that item in the ZoomedInView. Is that correct? – Nate Diamond Jul 19 '13 at 17:27
  • Almost, what I want is to be able to pinch zoom in the normal manor from the ZoomedOutView to the ZoomedInView and scroll over to the items that were displaying in the ZoomedOutView. This should also work the other way from the ZoomedInView if I pinch zoom back out to the ZoomedOutView, it scrolls over to the items I were viewing. – star Jul 20 '13 at 07:52
  • Try adding `ScrollViewer.IsHorizontalScrollChainingEnabled="False"` to your ZoomedInView. Also, what is that "SemanticGrid"? – Nate Diamond Jul 20 '13 at 16:56
  • I added ScrollViewer.IsHorizontalScrollChainingEnabled="False" to my ZoomedInView, but it still won't work. Should it be IsVerticalScrollChainingEnabled since my ZoomedInView is a ListView that scrolls vertically? I did try this as well but it still didn't work. I added the code for SemanticGrid in the original post, however I decided to remove SemanticGrid from the xaml file, to see if this was affecting the synchronised scrolling, but still it won't work. – star Jul 22 '13 at 08:44

0 Answers0