首页 > 代码库 > WP8__实现ListBox横向滑动及子项绑定图片等控件

WP8__实现ListBox横向滑动及子项绑定图片等控件

 

<!--实现绑定的图片等信息 ListBox水平滚动-->
          <Grid>
              <Grid.Resources>
                  <Style x:Key="horizontalListBoxStyle" TargetType="ListBox">
                      <Setter Property="ItemsPanel">
                          <Setter.Value>
                              <ItemsPanelTemplate>
                                  <StackPanel Orientation="Horizontal"
            VerticalAlignment="Center"
            HorizontalAlignment="Center"/>
                              </ItemsPanelTemplate>
                          </Setter.Value>
                      </Setter>
                  </Style> 
              </Grid.Resources>
 
              <ListBox Height="auto" Name="imglist1"  HorizontalContentAlignment="Left" 
                ScrollViewer.HorizontalScrollBarVisibility="Auto"  
                       Style="{StaticResource horizontalListBoxStyle}">
                  <ListBox.ItemTemplate>
                      <DataTemplate>
                          <Grid>
                              <Grid.RowDefinitions>
                                  <RowDefinition Height="auto"></RowDefinition>
                                  <RowDefinition Height="60"></RowDefinition>
                                  <RowDefinition Height="*"></RowDefinition>
                              </Grid.RowDefinitions>
 
                              <Image Name="imgShow" Source="{Binding Path}" Tag="{Binding Id}" Grid.Row="0" Width="420" Height="400" Margin="30,30,30,30" Stretch="Fill" MouseLeftButtonUp="imgShow_MouseLeftButtonUp"></Image>
 
                              <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Grid.Row="1">
                                  <Button Name="btnZan" Tag="{Binding Id}" Content="赞" Height="70" Width="150" FontSize="26" Margin="20,0,10,0" Click="btnZan_Click"></Button>
                                  <Button Name="btnCai" Tag="{Binding Id}" Content="踩" Height="70" Width="150" FontSize="26" Margin="10,0,20,0" Click="btnCai_Click"></Button>
                              </StackPanel>
 
                              <Grid Grid.Row="2" ></Grid>
 
                          </Grid>
                      </DataTemplate>
                  </ListBox.ItemTemplate>
              </ListBox>
 
          </Grid>
 
 
 

实现:

即将跳转到页面A,在页面A中有一个listbox,在跳转的时候,接收参数,自动选中listbox中的某项

 

/// <summary>
      /// 接收参数,定位当前选中项
      /// </summary> 
      protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs args)
      {
          IDictionary<string, string> parameters = this.NavigationContext.QueryString;
 
          if (parameters.ContainsKey("Id"))
          {
              string id = parameters["Id"];//图片Id
 
              int index = 0;
              for (int i = 0; i < imglist1.Items.Count; i++)
              {
//ImgInfoBase为listbox的Item项; imglist1.ItemsSource=(List<ImgInfoBase>) ...
                  ImgInfoBase item = (ImgInfoBase)imglist1.Items[i];
                  if (item.Id == id)
                  {
                      index = i;
                      break;
                  }
              }
 
              if (imglist1.Items.Count > index)
              {
                  UpdateLayout();
                  imglist1.SelectedIndex = index;//使listbox滚动到指定的位置项上
 
                  //imglist1.ScrollIntoView(imglist1.Items[index]);
              }
          }
 
          base.OnNavigatedTo(args);
      }