How Drop an imahe inside a Grid?

Posted on 2011-04-27
Last Modified: 2013-11-12
I have build a chess board from a Silverlight Grid control .The 64 squares are painted  by
creating 8 rows and 8 columns. I also have png images for the pieces. When I drag by the mouse a piece(png image) and drop it inside the board I would like the droped piece
to be inserted to the appropriate cell which is under the droped piece so that this piece will be a child of the grid. how can I do that?  
Question by:fara2000
    LVL 11

    Expert Comment

    Hi, I would suggest using a Uniform grid instead of a grid, just because a UniformGrid will automatically order 64 items in a 8x8 pattern.

    You can also define it the number of Columns and Rows in XAML.

    However, using a Grid/UniformGrid isn't enough. Something need to catch the Drop event. Although you can probably do it the way you want, I'm suggesting a different way.

    Have an ItemsControl.
    Make the ItemsPanel of the ItemsControl to be a UniformGrid .

    Bind the ItemsControl ItemsSource to an ObservableCollection of your own class that represents a cell.
    Have your ObservableCollection contain 64 cell items.

    Define a DataTemplate for your Cell class, so it will be shown on the UI as you would like (For example, border with either black or white background).

    On Drop, get the item the mouse was over.

    Have the picture added to the content of the cell.

    Author Comment

    Thank you saraqani for your answer
    Your suggestion seems to be interesting, However I couldn't find the UniformGrid in Silverlight packages... What do you think?
    LVL 11

    Accepted Solution

    Well, I'm working with WPF, so there might be small differences.

    You can implement a UniformGrid yourself by creating a class that inherits Panel and then overriding the MeasureOverride and ArrangeOverride.
    I've done this many times in WPF.

    Anyway, I wrote a little example in WPF, have a look:


    Author Closing Comment

    Thank you!!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Do You Know the 4 Main Threat Actor Types?

    Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

    zlib is a free compression library (a DLL) on which the popular gzip utility is built.  In this article, we'll see how to use the zlib functions to compress and decompress data in memory; that is, without needing to use a temporary file.  We'll be c…
    Whether you've completed a degree in computer sciences or you're a self-taught programmer, writing your first lines of code in the real world is always a challenge. Here are some of the most common pitfalls for new programmers.
    This is Part 3 in a 3-part series on Experts Exchange to discuss error handling in VBA code written for Excel. Part 1 of this series discussed basic error handling code using VBA.…
    In this sixth video of the Xpdf series, we discuss and demonstrate the PDFtoPNG utility, which converts a multi-page PDF file to separate color, grayscale, or monochrome PNG files, creating one PNG file for each page in the PDF. It does this via a c…

    737 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now