Click here to Skip to main content
Licence CPOL
First Posted 6 Apr 2008
Views 15,498
Downloads 217
Bookmarked 11 times

A simple jigsaw

By | 6 Apr 2008 | Article
Manipulate WinForms controls to make a simple jigsaw puzzle.

Introduction

This article explains how to make a simple jigsaw puzzle, and make a handsome monkey laugh :-)

Background

This is pretty simple, and works mainly on location mathematics and the Bitmap object's Clone method. I did a cooler version of this, but lost it to Shift + Del :-O ...oooooooooooh! When I have a less busy head, I will do it again. But, you could have this to play with. It's not bad.

Using the code

The most important part of this application is the gettokenpictures() method. Here, a Bitmap object's Clone function is used to slash the main image into 60x60 parts, having set the size of the image to 300x300 (which gives us 25 parts of 5x5).

Actually, set the image size by stretching it against the main picture box.

mainpic.Size = new Size(300, 300);

private void gettokenpictures()
{
    mainpic = new PictureBox();
    mainpic.Size = new Size(300, 300);
    mainpic.Location = new Point(0, 0);
    // Image.FromFile("main.jpg");
    mainpic.Image = JigsawCS.Properties.Resources.Main;
    mainpic.SizeMode = PictureBoxSizeMode.StretchImage;
    int top = 0;
    int left = 0;
    int k = 0;
    Bitmap bmp = new Bitmap(mainpic.Image);
    for (int i = 0; i < 5; i++)
    {
        for (int j = 0; j < 5; j++)
        {
            PictureBox tokenpic = (PictureBox)tokens[k];
            if (k == 24)
                tokenpic.Image =JigsawCS.Properties.Resources.blank;
                // Image.FromFile("blank.jpg");
            else
                tokenpic.Image = bmp.Clone(new Rectangle(left, top, 60, 60), 
                                 System.Drawing.Imaging.PixelFormat.DontCare);
            left += 60;
            k++;
        }
        left = 0;
        top += 60;
    }
}

So the line:

tokenpic.Image = bmp.Clone(new Rectangle(left, top, 60, 60), 
                 System.Drawing.Imaging.PixelFormat.DontCare);

creates an image from a rectangular part of the main image, and assigns it to a token, which is a picture box. A simple loop is used to manipulate the offsets (left and top).

You could add your own image(s) by uploading them into the application's resources, or keeping it/them in a location of your choice.

The line:

mainpic.Image = JigsawCS.Properties.Resources.Main;

in the above code sets the image, which you can do at runtime or before. So you could have:

mainpic.Image = JigsawCS.Properties.Resources.[You imagefile's name];

or

mainpic.Image =  Image.FromFile([You imagefile's name]);

Enjoy :-)

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

spidergeuse

Software Developer

United Kingdom United Kingdom

Member



Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board. (secure sign-in)
 
Search this forum  
 FAQ
    Noise  Layout  Per page   
  Refresh
GeneralOn top of what Luc said... PinmvpDave Kreskowiak6:10 25 Mar '11  
Generalpuzzling PinmvpLuc Pattyn3:42 25 Mar '11  

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Mobile
Web04 | 2.5.120517.1 | Last Updated 6 Apr 2008
Article Copyright 2008 by spidergeuse
Everything else Copyright © CodeProject, 1999-2012
Terms of Use
Layout: fixed | fluid