Question

我有一个观点：

 <Grid>
    <Canvas Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch" x:Name="ImageHolder">
        <!-- there is something to do here !!! -->
        <!-- like 
             <ImageCollection>
             <DataTemplate For One Image>
                <Image Canvas.Left="{Binding Path=posX}" 
                       Canvas.Top="{Binding Path=posY}" 
                       Source="{Binding Path=fileName}"
                       x:Name="{Binding Path=fileName}"
                       MouseDown="Img_MouseDown" 
                       MouseUp="Img_MouseUp" /> 
             </DataTemplate For One Image>
             </ImageCollection> -->
     </Canvas>
 </Grid>

并且是.cs

public partial class WindowBoard : Window
{

    protected MyCollectionVM _myCollection; // this class inherits of INotifyPropertyChanged

    public WindowBoard()
    {
        InitializeComponent();
        _myCollection = new MyCollectionVM();
    }
}

我会在此XAML中添加动态图像，以便将dataBinding与我的ViewModelClass一起使用。

换句话说，我会知道如何使用一个dataTemplate图像创建一个userControl，但是对于许多图像动态添加。

我知道如何用listview做到这一点，但我不知道如何使用画布，没有gridView / gridviewCellTemplate等...

Answer 1

您可以使用ItemsControl将ItemsPanel设置为Canvas

这将创建一个父控件（在本例中为Canvas），然后循环遍历一组对象并将每个对象添加到父面板。您可以使用ItemTemplate属性

指定如何绘制对象

请注意ItemsControl包裹<ContentPresenter>中的每个项目，因此您需要将ContentPresenter放置在ItemContainerStyle的Canvas上，而不是{{1}本身。

您的结束代码如下所示：

Image

Answer 2

请参阅此question

 <Window x:Class="WpfApplication1.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Width="750" Height="350" 
            FontSize="16">
        <Grid>
            <ComboBox x:Name="cb" ItemsSource="{Binding}" IsSynchronizedWithCurrentItem="True" VerticalAlignment="Top"
                      DisplayMemberPath="Title" SelectedValuePath="Image">
            </ComboBox>
            <Canvas Margin="0,50,0,0" Width="100" Height="100" >
                <Canvas.Background>
                    <ImageBrush ImageSource="{Binding ElementName=cb, Path=SelectedValue}"/>
                </Canvas.Background>
            </Canvas>
        </Grid>
    </Window>

和c＃

using System.Collections.Generic;
using System.Windows;
using System.Linq;

namespace WpfApplication1
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            cb.DataContext = new[] 
            {
                new { Title="title1", Image=@"C:\img001.jpg" },
                new { Title="title2", Image=@"C:\img002.jpg" }
            };
        }
    }
}

在Canvas中动态添加XAML中的图像

2 个答案: