如何爲圖像做陣列？

Question

我有20張圖片，他們是ball1，ball2，...，ball20。

據稱，我插入使用的.xaml

Image x:Name="ball1" Source="/Images/ball1.png" Canvas.Left="150" Canvas.Top="200"圖像。

目前，我試圖以這種方式來將其插入

Uri uri = new Uri("/Images/ball1.png", UriKind.Relative); 
ImageSource img = new System.Windows.Media.Imaging.BitmapImage(uri); 
image.SetValue(Image.SourceProperty, img); 
cv.Children.Add(image); 

但是，我不能使用這種方式，因爲它沒有指定我要插入的位置。

我想避免通過.xaml來實現，我怎樣才能在.cs中使用數組呢？

Answer 1

您可以在XAML中聲明Image對象，然後根據您的代碼隱藏或查看模型更新Source屬性（如果您願意）。對於這種方法，你需要每幅圖像屬性中的視圖模型或代碼背後：

public string Image1SourcePath 
{ 
    get { return image1SourcePath; } 
    set { image1SourcePath = value; NotifyPropertyChanged("Image1SourcePath"); } 
} 
... 
public string Image20SourcePath 
{ 
    get { return image20SourcePath; } 
    set { image20SourcePath = value; NotifyPropertyChanged("Image20SourcePath"); } 
} 

確保您實現某種形式的INotifyPropertyChanged接口

<Image Source="{Binding Image1SourcePath}" Canvas.Left="150" Canvas.Top="200" /> 
... 
<Image Source="{Binding Image20SourcePath}" Canvas.Left="1500" Canvas.Top="200" /> 

然後在您的視圖模型或代碼背後的：

Image1SourcePath = "/YourApplicationName;component/Images/ball1.png"; 
... 
Image20SourcePath = "/YourApplicationName;component/Images/ball20.png"; 

這是一個很大的代碼，但它可以讓你的背後更新你的代碼中Image.Source屬性並設置在XAML中的位置。

Answer 2

您可以通過在設置附加屬性（Canvas.Left & Canvas.Top）的Canvas類上調用適當的靜態方法來完成此操作。

Uri uri = new Uri("/Images/ball1.png", UriKind.Relative); 
ImageSource img = new System.Windows.Media.Imaging.BitmapImage(uri); 
image.SetValue(Image.SourceProperty, img); 
cv.Children.Add(image); 

// Position the image on the canvas 
Canvas.SetLeft(150); 
Canvas.SetTop(200); 

如果您有圖像的列表中顯示，你可以這樣做：

 List<Uri> imageUris = new List<Uri>() 
     { 
      new Uri(@"C:\Users\Grant\Pictures\Heron_zoomed.png"), 
      new Uri(@"C:\Users\Grant\Pictures\bridge.jpg") 
     }; 

     int left = 20; 
     int top = 10; 

     foreach (var uri in imageUris) 
     { 
      Image image = new Image { Source = new BitmapImage(uri) }; 
      Canvas.SetLeft(image, left); 
      Canvas.SetTop(image, top); 
      MainCanvas.Children.Add(image); 

      left += 400; 
     } 

上面的代碼假設你有這樣的事情在你的窗口XAML和在文件名以下imageUris列表存在。

<Grid> 
    <Canvas x:Name="MainCanvas"> 

    </Canvas> 
</Grid> 

我不知道你要用這​​些圖像做什麼。如果您只想在網格中顯示它們，則可以使用WPF集合控件之一在沒有任何代碼的情況下執行此操作。這樣做的

一種方法是Displaying images in grid with WPF

我懷疑有更好的選擇，但這將是一個開端。