Windows phone的水平列表框圖像中心鎖定

Question

我有圖像作爲項ListBox，我需要每個圖像採取屏幕的整個寬度，併成爲中心鎖定（如ViewPager在android系統）

這是我到目前爲止：

<Grid x:Name="ContentPanel" Grid.Row="1" VerticalAlignment="Bottom"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <ListBox Grid.Row="1" ItemsSource="{Binding Zones[0].listBannieres}" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Hidden"> 
      <ListBox.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal"></StackPanel> 
       </ItemsPanelTemplate> 
      </ListBox.ItemsPanel> 
      <ListBox.ItemTemplate> 
       <DataTemplate> 
        <StackPanel> 
         <Image Source="{Binding banniere}"/> 
        </StackPanel> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 
</Grid> 

謝謝。

解決

<phone:PivotItem Header="Zone 1" Margin="0"> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto"/> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 
        <StackPanel Grid.Row="1" VerticalAlignment="Bottom" > 
         <phone:Pivot ItemsSource="{Binding Zones[0].listBannieres}"> 
          <phone:Pivot.HeaderTemplate> 
           <DataTemplate /> 
          </phone:Pivot.HeaderTemplate> 
          <phone:Pivot.ItemContainerStyle> 
           <Style TargetType="phone:PivotItem"> 
            <Setter Property="Margin" Value="0"/> 
           </Style> 
          </phone:Pivot.ItemContainerStyle> 
          <phone:Pivot.ItemTemplate> 
           <DataTemplate> 
            <StackPanel> 
             <Image Source="{Binding banniere}"/> 
            </StackPanel> 
           </DataTemplate> 
          </phone:Pivot.ItemTemplate> 
         </phone:Pivot> 
        </StackPanel> 
       </Grid> 
      </phone:PivotItem> 

Answer 1

我會建議使用透視作爲意見或全景控制的建議，如果你把那些另一個控制裏面，你可以讓他們只在底部可見。這裏有一個關鍵的例子：

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="0"> 
    <Grid.RowDefinitions> 
     <RowDefinition /> 
     <RowDefinition Height="200" /> 
    </Grid.RowDefinitions> 

    <phone:Pivot Grid.Row="1" ItemsSource="{Binding Images}" Margin="0"> 
     <phone:Pivot.HeaderTemplate> 
      <DataTemplate></DataTemplate> 
     </phone:Pivot.HeaderTemplate> 

     <phone:Pivot.ItemContainerStyle> 
      <Style TargetType="phone:PivotItem"> 
       <Setter Property="Margin" Value="0" /> 
      </Style> 
     </phone:Pivot.ItemContainerStyle> 

     <phone:Pivot.ItemTemplate> 
      <DataTemplate> 
       <Image Source="{Binding ImagePath}" Stretch="Fill" /> 
      </DataTemplate> 
     </phone:Pivot.ItemTemplate> 
    </phone:Pivot> 
</Grid> 

這裏只有底部滾動到你想要的。它也將「滾動」到圖像滾動時，我也認爲Android viewpager所做的。 :)

如果改爲更改樞軸，以全景和PivotItem到PanoramaItem你可以得到另外一個不錯的結果，在這裏你看後面的圖像的一小部分。下面是結果的圖像：

編輯：爲了去除保證金和標題，請確保您設置HeaderTemplate中，以空單和PivotItem保證金爲0。見上面更新的代碼。