Question

我有随机的2到6个图像控件dynamically added，每个我都有包含该控件数据的字典/数组，即x1, x2, y1, y1, ans。

如何将数组分配或绑定到每个图像控件？

基本上我正在制作拖放功能，为此我使用了画布并将图像放入其中。所以当我将image1拖到区域rect_1（空格以放弃图片1）时，我想测试image1.ans，其中包含与1匹配的数字rect_1.ans ，查看image1是否在rect右侧以标记为正确的展示位置。

我搜索过但没有找到如何实现我的情况， This帖子使用xaml，但我需要在后面的代码中创建它。请指导我。

这是添加image1的代码 For now i am not dynamically creating dictionary

_draggedImageData = new Dictionary<string, int>
{
    {"x1", 11},
    {"x2", 144},
    {"y1", 123},
    {"y2", 143},
    {"ss", 0},
    {"a", 0}
};
_draggedImageData["width"] = (int)Math.Sqrt(Math.Pow(_draggedImageData["x2"] - _draggedImageData["x1"], 2) + Math.Pow(_draggedImageData["y2"] - _draggedImageData["y1"], 2)); //Math.Sqrt( Math.Pow(x2 - x1, 2) + Math.Pow(y2 - y1, 2))
_draggedImageData["height"] = _draggedImageData["y2"] - _draggedImageData["y1"]; // y2-y1

// Create a CroppedBitmap.
_cb = new CroppedBitmap(bitmapImage, new Int32Rect(_draggedImageData["x1"], _draggedImageData["y1"], _draggedImageData["width"], _draggedImageData["height"])); //x1, y1 : select region rect

var croppedImage = new Image{Source = _cb};
Canvas.SetLeft(croppedImage, _draggedImageData["x1"]); //x1
Canvas.SetTop(croppedImage, _draggedImageData["y1"]); //y1
_canvas.Children.Add(croppedImage);

这是检查它是否位于相同位置的代码。

private void CanvasMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    if (_draggedImage == null) return;

    var position = e.GetPosition(_canvas);
    //<m x1="332" x2="465" y1="68" y2="86" ss="1" a="0"></m>
        _draggedImageData2 = new Dictionary<string, int>
        {
            {"x1", 332},
            {"x2", 465},
            {"y1", 68},
            {"y2", 86},
            {"ss", 1},
            {"a", 0}
        };
        _draggedImageData2["width"] = (int)Math.Sqrt(Math.Pow(_draggedImageData2["x2"] - _draggedImageData2["x1"], 2) + Math.Pow(_draggedImageData2["y2"] - _draggedImageData2["y1"], 2)); //Math.Sqrt( Math.Pow(x2 - x1, 2) + Math.Pow(y2 - y1, 2))
        _draggedImageData2["height"] = _draggedImageData2["y2"] - _draggedImageData2["y1"]; // y2-y1


    var myRectangle = new Rect { Location = new Point(Canvas.GetLeft(_draggedImage), Canvas.GetTop(_draggedImage)), Size = new Size(_draggedImageData["width"], _draggedImageData["height"]) };
    var myRectangle2 = new Rect { Location = new Point(_draggedImageData2["x2"], _draggedImageData2["y2"]), Size = new Size(_draggedImageData2["width"], _draggedImageData2["height"]) };
    var doesIntersect = myRectangle.IntersectsWith(myRectangle2);


    if (doesIntersect)
    {
        var croppedImage = new Image
        {
            Source = _cb,
            Margin = new Thickness(_draggedImageData2["x1"], _draggedImageData2["y1"], 0.0, 0.0)
        };
        _canvas.Children.Add(croppedImage);

       //here i want to test if (draggedImageData2["a"] == myRectangle2["a"]) qArr[0].ans = 1; but i don't have myRectangle2 with dictionary values attached.
    }

    Canvas.SetLeft(_draggedImage, _draggedImageData["x1"]);
    Canvas.SetTop(_draggedImage, _draggedImageData["y1"]);

    _canvas.ReleaseMouseCapture();
    _draggedImage = null;
}

Answer 1

使用控件的“标记”对象属性并向其添加自定义数据，但Rect没有Tag属性。

_draggedImageData = new Dictionary<string, int>
{
    {"x1", 11},
    {"x2", 144},
    {"y1", 123},
    {"y2", 143},
    {"ss", 0},
    {"a", 0}
};

var croppedImage = new Image{Source = _cb};
croppedImage.Tag = _draggedImageData;

var _draggedImageData3 = new Dictionary<string, int>();
_draggedImageData3 = (Dictionary<string, int>)croppedImage.Tag;

Answer 2

感谢上面的澄清。如果您查看an answer I gave a few weeks ago to someone who was trying to draw a chess board，可能会有所帮助。本质上问题是相同的，即尝试在画布上呈现图像列表。我个人会创建一个类来封装你的字典中的所有这些字段，但如果你确实需要一个字典，那么它也可以工作，你只需调整你的XAML绑定来使用字典。

如何将字典或数组绑定到UIelement / Image控件

2 个答案: