Resize SemanticZoom based on contents


  • I am using C# with xaml to make a Windows 8.1 App. I have a SemanticZoom inside of the DataTemplate of a GridView. When I zoom in on the SemanticZoom, I want the width of the SemanticZoom to stretch to the size of all of the items in the GridView that is inside of the SemanticZoom. Basically this is supposed to be analogous to opening up a folder to reveal the files inside of it; the folder goes from a single folder icon to a larger folder with a bunch of files in it. I've tried setting HorizontalContentAlignment to stretch everywhere that I can find but nothing seems to work. I have a feeling that I need to bind a width somewhere but I'm not sure where. Any ideas on how to get this to work? Thanks!

    <HubSection x:Name="MyHubSection" MinWidth="400" HorizontalContentAlignment="Stretch"> <DataTemplate> <GridView x:Name="MyHubGrid" ItemsSource="{Binding}" SelectionMode="None" >
    <GridView.ItemContainerStyle> <Style TargetType="GridViewItem"> <Setter Property="HorizontalContentAlignment" Value="Stretch" /> </Style> </GridView.ItemContainerStyle>
    <GridView.ItemTemplate> <DataTemplate>
    <SemanticZoom x:Name="ProjectZoom" IsZoomedInViewActive="False" > <SemanticZoom.ZoomedOutView> <GridView x:Name="zoGrid" ItemsSource="{Binding}" IsZoomedInView="False" SelectionMode="None"> <Canvas Height="400" Width="200"> <Rectangle Height="400" Width="200" Fill="Navy" VerticalAlignment="Top" /> <TextBlock Text="{Binding Path=ProjectName}" VerticalAlignment="Top"/> </Canvas> </GridView> </SemanticZoom.ZoomedOutView> <SemanticZoom.ZoomedInView> <GridView x:Name="ziGrid" ItemsSource="{Binding Path=Segments}" Height="400"> <GridView.ItemTemplate> <DataTemplate> <Grid Height="100" Width="150" Background="Red"> <TextBlock Text="{Binding Path=Summary}" TextWrapping="WrapWholeWords"/> </Grid> </DataTemplate> </GridView.ItemTemplate> </GridView> </SemanticZoom.ZoomedInView> </SemanticZoom> </DataTemplate> </GridView.ItemTemplate> </GridView> </DataTemplate> </HubSection>

    • Edited by nol__b Tuesday, February 3, 2015 8:54 PM typo
    Tuesday, February 3, 2015 7:38 PM

All replies

  • Can you post a sample to make your question more clear?

    why don't you use SemanticZoom control in hubsection date template directly?

    Wednesday, February 4, 2015 1:47 PM
  • If I put the SemanticZoom control directly in the hubsection, then it will zoom everything at the same time. I need to be able to zoom in and out of each individual item. I'll work on a full sample to post.

    Wednesday, February 4, 2015 7:00 PM