如何在运行时动态使用图像文件作为 WPF 中的按钮内容？

Question

我当前的实现循环遍历一个文件夹中的 PNG 文件，并使用该文件夹中的文件创建许多带有背景图像的按钮。

为此，在 Visual Studio 的设计时，我必须将该文件夹中的每个 PNG 的构建操作设置为 resource，然后使用如下内容

button.Content = new Image { 
             Source = new BitmapImage(new Uri(product.ImageLink ?? "",UriKind.Relative)),
             Stretch = Stretch.Fill 
             }

此方法的问题在于，每次将新的 PNG 文件添加到文件夹时，我都需要将该 PNG 文件的构建操作设置为 resource 并重新发布解决方案。

是否可以在运行时遍历文件夹中的所有 PNG 文件以将它们用作按钮内容？

Answer 1

只需枚举文件夹并将感兴趣的文件路径添加到 List 或 ObservableCollection 并将其绑定到 ListBox（或任何选择的 ItemsControl） .定义一个 DataTemplate 来呈现图像按钮。您可以使用 FileSystemWatcher 来观察目录的变化。

MainWindow.xaml.cs

public partial class MainWindow : Window
{
  private const string ImageFolderPath = @"C:\SomeImages";
  public ObservableCollection<string> ImageFilePaths { get; } = new ObservableCollection<string>();

  private void OnClick(object sender, RoutedEventArgs e)
  {
    this.ImageFilePaths.Clear();
    var directoryInfo = new DirectoryInfo(ImageFolderPath);
    var enumerationOptions = new EnumerationOptions();
    foreach (string imageFilePath in directoryInfo.EnumerateFiles("*", enumerationOptions)
      .Where(fileInfo => fileInfo.Extension is ".png" or ".jpg")
      .Select(fileInfo => fileInfo.FullName))
    {
      this.ImageFilePaths.Add(imageFilePath);
    }
  }
}

MainWindow.xaml

<Window>
  <Button Content="Load Images" 
          Click="OnClick" />
  <ListBox ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=Window}, Path=ImageFilePaths}">
    <ListBox.ItemTemplate>
      <DataTemplate>
        <Button>
          <Image Height="96"
                 Width="96"
                 Source="{Binding}" />
        </Button>
      </DataTemplate>
    </ListBox.ItemTemplate>
  </ListBox>
</Window>

如何在运行时动态使用图像文件作为 WPF 中的按钮内容？

How to use image files dynamically at runtime as button content in WPF?

c#

wpf

resources

xaml

visual-studio