SemanticZoom使用GridView.Items而不是GridView.ItemsSource

Question

在我的應用程序的主頁上我有這樣的東西，顯示不同的小節和尊重節之間的80像素的餘地。

<GridView> 
    <GridView.Style> 
     <Style TargetType="GridView"> 
      <Setter Property="ItemContainerStyle"> 
       <Setter.Value> 
        <Style TargetType="GridViewItem"> 
         <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
         <Setter Property="Margin" Value="0, 0, 80, 0"/> 
         <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate TargetType="GridViewItem"> 
            <ContentPresenter/> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </Setter.Value> 
      </Setter> 
      <Setter Property="ItemsPanel"> 
       <Setter.Value> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Horizontal"/> 
        </ItemsPanelTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </GridView.Style> 
    <Grid> 
     <TextBlock Text="SubTitle1"/> 
     ... 
    </Grid> 
    <Grid> 
     <TextBlock Text="SubTitle2"/> 
     ... 
    </Grid> 
    <Grid> 
     <TextBlock Text="SubTitle3"/> 
     ... 
    </Grid> 
</GridView> 

現在我想語義縮放添加到這一點，所以，當我縮小我看到子節的標題有點像天氣應用程序。我已經使用ItemsSource在過去做過SemanticZoom，但是如果我將實際項目直接放入GridView並且沒有進行分組，那麼我該如何做。

編輯：其他人如何處理創建這些類型的80個像素的分開的子部分？爲了讓SemanticZoom工作，兩個GridView必須綁定到相同的集合？

Answer 1

您的GridView上面將需要一個名稱，我們將其稱爲ZoomedInGV。這當然成爲SemanticZoom.ZoomedInView中的控件。然後你需要創建另一個GridView，我們稱之爲ZoomedOutGV。最後，您需要在兩個視圖之間創建一個綁定。解決方案應該看起來像這樣：

<SemanticZoom> 
    <SemanticZoom.ZoomedInView> 
     <GridView x:Name="ZoomedInGV"> 
     ... 
     </GridView> 
    </SemanticZoom.ZoomedInView> 
    <SemanticZoom.ZoomedOutView> 
     <GridView x:Name="ZoomedOutGV" ItemsSource="{Binding ElementName=ZoomedInGV, Path=Items}"/> 
    </SemanticZoom.ZoomedOutView> 
</SemanticZoom>