如何添加下一個和上一個按鈕在Windows Phone 8列表框中的所有項目

Question

在我的Windows Phone 8應用程序中，我在列表框中顯示結果。每次我只在列表中顯示20個項目。

現在顯示接下來的20個項目，我想添加NEXT按鈕，並顯示我想添加PREVIOUS按鈕的舊項目。

下面是我的代碼塊。在這裏，我使用另一個列表框內的列表框來顯示列表後面的按鈕。但列表不滾動。

<Grid x:Name="ContentPanel" Grid.Row="3" Background="White" Margin="0,-3,0,0"> 
     <ListBox x:Name="outerList"> 
      <ScrollViewer Margin="0,0,0,0"> 
       <ListBox x:Name="companiesList" SelectionChanged="companiesList_SelectionChanged" ScrollViewer.VerticalScrollBarVisibility="Auto"> 
        <ListBox.ItemTemplate> 
         <DataTemplate> 
          <Grid x:Name="listItem"> 
           <Grid.RowDefinitions> 
            <RowDefinition Height="50"/> 
            <RowDefinition Height="30"/> 
            <RowDefinition Height="30"/> 
            <RowDefinition Height="10"/> 
           </Grid.RowDefinitions> 

           <StackPanel x:Name="namePanel" Grid.Row="0" Orientation="Horizontal" Margin="5,0,0,5" Height="50"> 
            <TextBlock x:Name="nameTextBlock" Text="{Binding CompanyName}" Foreground="#FF501F6E" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="28" MaxHeight="40" TextTrimming="WordEllipsis" Margin="0,0,0,0" Width="460" FontWeight="Bold"/> 
           </StackPanel> 

           <StackPanel x:Name="addressPanel" Grid.Row="1" Orientation="Horizontal" Margin="5,0,0,5" Height="30"> 
            <TextBlock x:Name="addressTextBlock" Text="{Binding Address}" Foreground="#FF1F1F1F" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="20" MaxHeight="30" TextTrimming="WordEllipsis" Margin="0,0,0,0" Width="460"/> 
           </StackPanel> 

           <StackPanel x:Name="phonePanel" Grid.Row="2" Orientation="Horizontal" Margin="5,0,0,0" Height="30"> 
            <Image x:Name="phone" Stretch="Uniform" Margin="0,0,0,0" Height="25" Source="Images/list_phone.png" /> 
            <TextBlock x:Name="phoneTextBlock" Text="{Binding Phone1}" Foreground="#FF501F6E" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="20" MaxHeight="30" TextTrimming="WordEllipsis" Width="460"/> 
           </StackPanel> 

           <Image x:Name="line" Grid.Row="3" Width="460" HorizontalAlignment="Center" Source="Images/separator.png" /> 
          </Grid> 
         </DataTemplate> 
        </ListBox.ItemTemplate> 
       </ListBox> 
      </ScrollViewer> 
      <StackPanel Height="50" Orientation="Horizontal"> 
       <Button Content="Previous" Height="70" HorizontalAlignment="Left" Margin="-5,1,0,0" Name="prevbutton" VerticalAlignment="Center" Width="160" Foreground="#FF501F6E"> 
        <Button.Background> 
         <ImageBrush Stretch="Fill" ImageSource="Images/blank_button_nav.png"/> 
        </Button.Background> 
       </Button> 
       <Button Content="Next" Height="70" HorizontalAlignment="Left" Margin="170,1,0,0" Name="nextbutton" VerticalAlignment="Center" Width="160" Foreground="#FF501F6E"> 
        <Button.Background> 
         <ImageBrush Stretch="Fill" ImageSource="Images/blank_button_nav.png"/> 
        </Button.Background> 
       </Button> 
      </StackPanel> 
     </ListBox> 
    </Grid> 

請問我可以幫助我如何將按鈕添加到可滾動的列表框中。

Answer 1

你可以把你的ListBox另一個列表框，其中項目的結果列表框和按鈕，如內：

<Grid x:Name="ContentPanel" Grid.Row="3" Background="White" Margin="0,-3,0,0"> 
    <ListBox x:Name="outerList"> 
      <ListBox x:Name="companiesList" Height="{Binding ActualHeight, ElementName=ContentPanel}" SelectionChanged="companiesList_SelectionChanged" ScrollViewer.VerticalScrollBarVisibility="Auto"> 
       <ListBox.ItemTemplate> 
        <DataTemplate> 
         <Grid x:Name="listItem"> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="50"/> 
           <RowDefinition Height="30"/> 
           <RowDefinition Height="30"/> 
           <RowDefinition Height="10"/> 
          </Grid.RowDefinitions> 

          <StackPanel x:Name="namePanel" Grid.Row="0" Orientation="Horizontal" Margin="5,0,0,5" Height="50"> 
           <TextBlock x:Name="nameTextBlock" Text="{Binding CompanyName}" Foreground="#FF501F6E" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="28" MaxHeight="40" TextTrimming="WordEllipsis" Margin="0,0,0,0" Width="460" FontWeight="Bold"/> 
          </StackPanel> 

          <StackPanel x:Name="addressPanel" Grid.Row="1" Orientation="Horizontal" Margin="5,0,0,5" Height="30"> 
           <TextBlock x:Name="addressTextBlock" Text="{Binding Address}" Foreground="#FF1F1F1F" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="20" MaxHeight="30" TextTrimming="WordEllipsis" Margin="0,0,0,0" Width="460"/> 
          </StackPanel> 

          <StackPanel x:Name="phonePanel" Grid.Row="2" Orientation="Horizontal" Margin="5,0,0,0" Height="30"> 
           <Image x:Name="phone" Stretch="Uniform" Margin="0,0,0,0" Height="25" Source="Images/list_phone.png" /> 
           <TextBlock x:Name="phoneTextBlock" Text="{Binding Phone1}" Foreground="#FF501F6E" Style="{StaticResource PhoneTextNormalStyle}" HorizontalAlignment="Left" FontSize="20" MaxHeight="30" TextTrimming="WordEllipsis" Width="460"/> 
          </StackPanel> 

          <Image x:Name="line" Grid.Row="3" Width="460" HorizontalAlignment="Center" Source="Images/separator.png" /> 
         </Grid> 
        </DataTemplate> 
       </ListBox.ItemTemplate> 
      </ListBox> 
     <StackPanel Height="50" Orientation="Horizontal"> 
      <Button Content="Previous" Height="70" HorizontalAlignment="Left" Margin="-5,1,0,0" Name="prevbutton" VerticalAlignment="Center" Width="160" Foreground="#FF501F6E"> 
       <Button.Background> 
        <ImageBrush Stretch="Fill" ImageSource="Images/blank_button_nav.png"/> 
       </Button.Background> 
      </Button> 
      <Button Content="Next" Height="70" HorizontalAlignment="Left" Margin="170,1,0,0" Name="nextbutton" VerticalAlignment="Center" Width="160" Foreground="#FF501F6E"> 
       <Button.Background> 
        <ImageBrush Stretch="Fill" ImageSource="Images/blank_button_nav.png"/> 
       </Button.Background> 
      </Button> 
     </StackPanel> 
    </ListBox> 
</Grid> 

當按鈕竊聽，你可以修改內部列表框的內容：