將兩個不同類型的列表鏈接到一個ListView

Question

我想讓一個ListView同時顯示一個圖像和所選圖像的名稱。到目前爲止，我已成功將List<BitmapImage>綁定到ListView.ItemsSource，它在ItemTemplate內同時顯示Image元素和Textblock元素，我還成功地將每個Image的名稱添加到單獨的List<string>。現在，這是我卡住的地方，我如何將List<BitmapImage>和List<string>綁定到單個ListView，因此每個List Item的尊重字段。

代碼片段如下：

XAML ListView控件：

<ListView x:Name="listView_ViewPhotos" Visibility="Collapsed"> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <Grid Margin="0,5,0,5"> 
       <Grid.ColumnDefinitions> 
        <!--Image Column--> 
        <ColumnDefinition Width="150"/> 
        <!--Name Column--> 
        <ColumnDefinition MinWidth="{Binding ActualWidth, ElementName=pageRoot, Mode=OneWay}"/> 
       </Grid.ColumnDefinitions> 
       <Image Source="{Binding ImageList}" Height="100" Width="150" Stretch="UniformToFill" Grid.Column="0"/> 
       <TextBlock x:Name="txt_Listimg_Caption" Foreground="{ThemeResource ButtonForegroundThemeBrush}" Style="{StaticResource CaptionTextBlockStyle}" TextWrapping="WrapWholeWords" Height="40" Margin="15,0,15,0" FontSize="25" Text="{Binding ImageName}" Grid.Column="1" /> 
      </Grid> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

C＃

public List<string> ImageName = new List<string>(); 
private async void appBar_GetFiles_Click(object sender, RoutedEventArgs e) 
{ 
    FileOpenPicker filePicker = new FileOpenPicker(); 
    filePicker.ViewMode = PickerViewMode.List; 
    filePicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary; 
    filePicker.FileTypeFilter.Add(".bmp"); 
    filePicker.FileTypeFilter.Add(".png"); 
    filePicker.FileTypeFilter.Add(".gif"); 
    filePicker.FileTypeFilter.Add(".jpg"); 
    filePicker.FileTypeFilter.Add(".jpeg"); 

    IReadOnlyList<StorageFile> filelist = await filePicker.PickMultipleFilesAsync(); 
    foreach (var file in filelist) 
    { 
     if (file != null) 
     { 
      string FileName = file.Name; 
      //var imageData = await activeFolder.GetFileAsync(FileName); 
      //var imageData = await KnownFolders.PicturesLibrary.GetFileAsync(FileName); 
      BitmapImage bitmapImage; 
      using (var stream = await file.OpenAsync(FileAccessMode.Read)) 
      { 
       bitmapImage = new BitmapImage(); 
       bitmapImage.SetSource(stream); 
      } 
      ImageName.Add(FileName); 
      ImageList.Add(bitmapImage); 
     } 
     else break; 
    } 
    listView_ViewPhotos.ItemsSource = null; 
    listView_ViewPhotos.ItemsSource = ???; 

    gridView_ViewPhotos.ItemsSource = null; 
    gridView_ViewPhotos.ItemsSource = ???; 

Answer 1

而不是2所列出，只需要使用1：

1，創建一個新的我們稱之爲ImageDetails。 該類包含2個屬性，1是圖像本身，圖1是圖像的名字

public class ImageDetails 
{ 
    public BitmapImage Image{get;set:} 
    public string ImageName{get;set;} 
} 

所以，現在，你不是裝2列出，只需撥打List<ImageDetails>

舉例地址：

List<ImageDetails> list = new List<ImageDetails>(); 
ImageDetails _imgDetails = new ImageDetails(); 
_imgDetails.Image = bitmapImage; 
_imgDetails.ImageName = FileName; 
list.Add(_imgDetails); 

示例GETALL：

foreach(var img in list) 
{ 
    var image = img.Image; //this is your BitmapImage 
    var name = img.ImageName; //this is your image Name 
    //other work 
}