n Tile Puzzle

n Tile Puzzle is an Android versn Tile Puzzleion of the classic sliding puzzle. The difficulty level can be changed by choosing the number of pieces in the puzzle and whether they should be numbered or not. The puzzle comes with several photos pre-installed, but custom images can be used or grabbed directly from the device’s camera.

Downloads

n Tile Puzzle is available for Android devices. You can install it directly from the Google Play™ store:

Get it on Google Play™

If you prefer, the apk file and source code can be downloaded directly.

Custom Images

By default, n Tile Puzzle comes with a set of pre-installed images. Whenever a new image is loaded, a random image from this set is picked. Using a file manager application, you can add your own images to this set by placing them in the directory name.schedenig.android.ntilepuzzle on your device’s external storage folder (e.g. your SD card). Your images must have the file extension jpg, jpeg or png.

If you are using your own images, you can also create a file or directory named .disable_internal_images in the image directory. The contents of the file or directory do not matter. If it is present, the internal images will not be used.

The puzzle allows you to take a photo and directly use it as the puzzle image. This photo is stored in the directory name.schedenig.android.ntilepuzzle/photo. You can copy the file to another folder if you want to keep the photo.

Disclaimer

Please understand that I will not provide documentation for the source code. There’s a reason why the code is largely uncommented: I wrote this mainly as a small side project to get familiar with the Android APIs, but without spending too much time on structuring and documentation. I’m flattered to have received many requests for explaining the source code, but writing basic source code documentation isn’t easy (or fun), and actually explaining code is much harder still. I’ll be happy to try and answer specific questions, but I will not provide documentation for the code as a whole.

Licence

n Tile Puzzle is released under the GNU General Public License (GPL). The image files included in the binary download are excluded from the GNU GPL. The source code download does not include these images.

Google Play is a trademark of Google Inc.

27 Responses to n Tile Puzzle

  1. Osmar Rojas says:

    Why this project don’t have any layout xml file?

    • The entire view content is custom drawn, with no standard GUI elements or layouts, so there’s no need for a layout.xml. The one exception is the menu button, which is handled via code in the ButtonView class.

      • Mitesh Shah says:

        I have 3 doubts
        1)I want to remove numbers assigned on each image
        2)I am unable to add images from the source folder..means when i run app it should display the images from the folder mentioned and when i select one it should start with it..
        3)View should be portrait only…whatever the image may be..
        please reply as early as possible..

  2. Mitesh Shah says:

    Issue 1 and 3 is solved…
    please help with second issue..

    • Please see my email for my reply.

      • Mitesh Shah says:

        Ya.. i got it..
        i have some other queries, please check your mail.

      • Mitesh Shah says:

        Dude, i have solved all the problems.
        now i have 2 another problems, i know the logic and code too but i don’t know where to put that code.

        Problem 1) I want to change the background color of the screen. when scrambled image appears(want to change color behind scrambled image)..(In which file shall i do this)

        Problem 2) I have designed a TextView below Scrambled image( i did code for that in ButtonView Class). I want to continuously change the text of the TextView as user moves the tiles.. means TextView should show each move as should update for every move.

        Please help me for this.

  3. Dian says:

    Is there any documentation with the source code. I am having trouble following some of what is going on in PuzzleActivity.

  4. Shawn says:

    Hey,

    I’ve been using your project as a reference to learn android development! I’ve been trying to re-create what you’ve done. Thank you so much for posting this!

    I’ve been having a hard time trying to understand some of your code in the onDraw() call. Especially with the targetRect and targetSource, as well as the matchLeft and matchRight.

    Could you please give me a general idea of what the logic behind what your doing is? It’s all a little too overwhelming for me haha 😛 And it’s bothering me that I don’t understand.

    I eagerly await your reply

    Thank you

  5. ryan says:

    since there is no layout.xml. how can you input ad sdks?

    • There is no layout.xml because all the drawing code in PuzzleView is done manually, and ButtonView programatically wraps around it to dynamically add a button on top if necessary. I’m not sure what you want to achieve though.

  6. Krishna says:

    I used this code for learning android..

    i want to do few modifications in it..

    now i want to take the image from camera (or) gallery and it should not split. when we shake our mobile i want to split… can you please tell me how to do and what to do?

    any way thank you for your support Dude

    • Sorry, I’ve never used the camera. Shouldn’t be too difficult with the official API docs and perhaps some research on Stack Overflow & Co.

      • Krishna says:

        Thanks so much for your reply i tried it for so much time and finally i came to you to do this…

        if you help me with this kind of code it should be helpful to me….

        thank you for your valuable code to me…

        if you know this please get it to me..

        thanks for your support

  7. siddhu says:

    it sawesome, can u please explain the code

  8. Yed Vanraws says:

    Hey Marian, it took a while for me to get a grip on the code. But once i figured how the flow worked, i was able to use/mold it as per my requirement.
    Awesome job man…!
    Hats off to you, keep up the good work…

  9. Sumit says:

    Hi Excellent example for the beginner like me. I have some issue i wanna remove the number from the image also i require only 2:2 matrix can you help me with it.

  10. denden says:

    hello sir! how can i put the number in the upper right side of each tile? please help me asap. thanks sir.

  11. amarnath says:

    Dude, i have solved all the problems.
    now i have 2 another problems, i know the logic and code too but i don’t know where to put that code.

    Problem 1) I want to change the background color of the screen. when scrambled image appears(want to change color behind scrambled image)..(In which file shall i do this)

    Problem 2) I have designed a TextView below Scrambled image( i did code for that in ButtonView Class). I want to continuously change the text of the TextView as user moves the tiles.. means TextView should show each move as should update for every move.

    Please help me for this.

  12. Jagrik says:

    Hi I would like to ask how I can do there that I did not have any empty field? the point is that I just want to squander and enumerate the picture, no moving nic.Díky for advice

  13. dreuce says:

    Though it was not mentioned
    load an image from the mysql local host folder
    from a gridview onto the
    puzzle gridview.
    Thats nice

  14. dreuce says:

    Though it was not mentioned
    load an image from the mysql local host folder
    from a gridview list onto the
    puzzle gridview.
    Thats nice

  15. Tri khairul says:

    Thx for share that code, it helping me for learning Android.
    Now, I have problems,
    1. How change that level in that puzzle, ex: 3×4 to nxm puzzle, where n and m is input that we need.
    2. How to change that pic?
    Thanks, please help me for solve it.

  16. Britto says:

    Hello Brother. Your source code is very helping to me. I am facing problem on settiles. The position which i given is tiles arranged as I expected. It having two problem 1. sometimes not moving. 2.if moves two empty spaces shown. please educate me to done a task. Advance Thanks bro

  17. Oscar says:

    Hi there! I’ve been trying to contact you via email or trying to post here but no avail. I’m trying to make a swap tiles game. I have fixed board, took a few things from your code and still a work in progress. I can swap with the empty tile now. I’m having this Freezes on the view, where the puzzle is unresponsive. But if a click a button or the menu that I have, it becomes responsive (the app is not frozen just the view that has the puzzle). Do you know why is this ? Thank you for replying.

    • Oscar says:

      Nevermind. I found the problem. I had created a layout file that contains a toolbar, the puzzleview as a framelayout and a bottom relative layout. I used a Relativelayout as a container, and matchparent for the layout_height of the PuzzleView. I had to use layout_below and layout_above to organize the the 3 layouts. I noticed that when I erased my bottom layout (which contains a single button), the PuzzleView didn’t freeze anymore. This freezes happened when switching to other app, or sometimes just right after starting the game. I found out that this behavior is because of the “matchparent” property on layout_height of the PuzzleView (framelayout). I changed it to 0dp, and it’s now working. I’m sorry if I somehow bothered you. Have a nice day, and thank you for reading.

  18. 1) Line 165 in PuzzleView clears the frame (selecting the colour depending on whether the puzzle has been solved or not).

    2) updateDrag() in line 439 of PuzzleView is called whenever you move a tile around. You should probably update your TextView from there. Or from finishDrag() if you only need to change the text after each drag operation.

Leave a Reply

Your email address will not be published. Required fields are marked *