0

I'm writing normal jigsaw puzzle game. For convenience I've created a custom view: PuzzleView extends ImageView. It overiddes onTouchEvent(), so I can move my View with a finger. Nice.

However, I have a problem with putting these Views close to each other, so they fit in themselves. Puzzles are not squares, their shape look like this:

enter image description here

And the problem is that these views must overlap a little bit to look good. But when squares overlap, touch events works bad in the intersection area. If I naively put that puzzle as a background of PuzzleView, 4 of them will look like this:

enter image description here

They have transparency, so I could squeeze them to look good. But it's not a good idea, because of the touch events. If we touch in the border, the puzzle which is "higher" (in z-index) will be touched. And maybe user wants to pick up the other one and he can't.

I've read a bit about Android'sShape class. It would be great if I have a Shape of a puzzle - then I can use it as a background of my PuzzleView and I hope that MotionEvent will only come when I touch the shape, not some rectangular area around it.

The question is: how to get a Shape of a puzzle? Ideally, I will point my image and it will give me a Shape taken from that image. If it's not possible (or very hard) maybe we can somehow make this puzzleShape with Path, but how to do it? Maybe it is too complicated shape to use Path? Maybe there is an easier way?

Adam Stelmaszczyk
  • 19,665
  • 4
  • 70
  • 110

2 Answers2

1

It's difficult to answer all of your questions (they are not really specific), so I'll just give you my point of view :

I would say that android built-in views are not the best for this kind of app. Drawing directly on a View (or a SurfaceView) is probably a better choice, it makes it easy to draw an image on top of another. For example, let's say your shapes have a width of 100, you can draw the first at x=0, and the second at x=90 and they will overlap.

You may think that it requires more work but you will most likely run into other problems and performance issues (if you have large puzzles) if you stick with ImageViews.

Dalmas
  • 26,409
  • 9
  • 67
  • 80
0

Can you not just make the white portion of the image transparent? If you want to match them, I would be tempted to store a representation of the shape as a logical object rather than trying to match up pixel by pixel. If you want to match pixel by pixel though, see Pixel-Perfect Collision Detection Android (you'll need to consolidate bitmap co-ordinates and the view's relative position on the screen).

Community
  • 1
  • 1
Dororo
  • 3,420
  • 2
  • 30
  • 46
  • It is transparent. Problem is that the `ImageView` are is a square. Imagine, how you will put puzzle shape in a square? Puzzle will be either cropped or with too much blank space on the border. And logic is not a problem, I'm not detecting collision. – Adam Stelmaszczyk Jun 19 '13 at 21:49
  • I would like that `ImageView` have a shape of a puzzle. Not square. Then I can put them close to each other and the touch events will work perfectly. – Adam Stelmaszczyk Jun 19 '13 at 21:57