5

我想将一个项目移动到 WPF，并且在其中我有一个ImageList（通过在设计视图中选择 25 个图像来加载），我用它来创建按钮，如下所示： 我已将项目简化为以下代码。这是我的整个项目（除了 .Designer.cs 中的自动生成代码）：

public partial class Form1 : Form
{
    Button[] buttonList = new Button[25];
    Size buttonSize = new Size(140, 140);
    public Form1()
    {
        InitializeComponent();
        this.ClientSize = new Size(142 * 5, 142 * 5);
        for (int i = 0; i < buttonImages.Images.Count; i++)
        {
            buttonList[i] = new Button();
            buttonList[i].Size = buttonSize;
            buttonList[i].Location = new Point(
                (i % 5) * (buttonSize.Width + 2) + 1,
                (i / 5) * (buttonSize.Height + 2) + 1);
            buttonList[i].Image = buttonImages.Images[i];
        }
        SuspendLayout();
        Controls.AddRange(buttonList);
        ResumeLayout(false);
    }
}

我似乎无法理解如何在 WPF 中完成这项琐碎的任务。尽我所能从这里的答案中看出（像这样）我应该是

  • 用图像填充文件夹
  • 创建引用它们的 ResourceDictionary
  • 创建另一个引用 ResourceDictionary 引用的文件
  • 创建一个其他东西（我不知道是什么），它通过 ResourceDictionary 访问图像以将它们加载到按钮（但按钮类甚至没有构造函数......？？？！！！）

有人可以帮助将其翻译成 WPF 吗？老实说，我只是不知道从哪里开始。

如果它很重要，这就是它运行时的样子： 在此处输入图像描述

4

1 回答 1

4

我们将为此使用 MVVM。

首先我们要做一个模型。

public class MyModel
{
   public BitmapSource Picture { get; set; }
   public string Description { get; set; }
}

然后我们的 ViewModel

public class MyViewModel
{
   public ObservableCollection<MyModel> Images { get; set; }

   public ICommand ButtonClicked { get; set; }

   ... Logic to populate the images
}

然后我们的观点

<Window x:Class="TestWPF.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:loc="clr-namespace:TestWPF"
        Title="MainWindow"
        Height="350"
        Width="525">
    <Window.Resources>
        <loc:MyViewModel x:Key="ViewModel" />
    </Window.Resources>
    <Grid DataContext="{StaticResource ViewModel}">
        <ListView ItemsSource="{Binding Images}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Button Command="{Binding ButtonClicked, RelativeSource=Parent}"
                            CommandParameter="{Binding Description}">
                        <Image Width="50"
                               Height="50"
                               Source="{Binding Picture}"></Image>
                    </Button>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Window>

这将创建一个应该以相同方式运行的列表。

于 2013-02-21T16:55:22.450 回答