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 に答える