Drag & Drop OnTouch irregular shaped images - android

I am working on a simple app, which will allow moving one ImageView & dropping it on another ImageView. I am having problems with how onTouch works. It seems that it always takes rectangular input.
Let's say I have a shape like that:
Link
All small dots represent places which will trigger onTouch. But only green ones should... So in other words, I do not want Drag to be triggered when I am touching transparent part of the image.
Is this possible?
BR,
Kuba

If anyone will stumble upon this question, here is an answer: You must extend the DragShadowBuilder class to achieve that. More details in below question:
Set custom anchor when dragging a View

Related

android ImageView vs canvas for game

I´m new in android development. I want to create a game where the user needs to quickly drag and drop balls with the finger in the screen to specific locations in order to win.
I don´t know if i can do this with simple ImageViews or i need to use canvas or other thing to draw in the screen.
I have tried to drag and drop an ImageView on top of another ImageView but it does not seem to work very well and i'm hesitating if i need to do it drawing figures instead of using the ImageViews or to do something else.
Please advice. Any help is apreciated. Thank you.
ImageViews are Views designed to hold image drawables, which isn't really needed in your case - you can use a simple View with a color background or implemended onDraw method, you can use an ImageView just as well.
Asfor the drag and drop, what you need is any View with implemented onTouch method so that the view changes its position on screen with ACTION_MOVE touch events.
If you're interested, i have implemented a simple frame layout with drag and drop functionality. My layout requires long-click to start drag, but it can be easily modified so it won't. Check it out at my github page. You can clone the project and run demo activity to see how it works, and start from there.

What options are there for arranging custom ImageViews

I have recently completed a simple drag and drop shapes game. It had the user drag a shape (ImageView) to another "empty place holder" ImageView.
I now want to make this a little more advanced, instead of dragging a simple shape, I want to make a puzzle of various non-orthogonal shapes, for example breaking a circle into 5 different pieces. What I'm having a problem with right now is how to design the layout. I do not know how to make a truly "custom" shaped ImageView, as far as I can find from my research it's not possible. So my idea for now is to overlap a number of square ImageViews, each of which will have only a subset of an image and the rest transparent. Thus the final output will look like it's a number of custom shaped ImageViews.
Example:
+ + +
Because only the internal sections are "visible" and the rest of the circle is transparent, when all of these pieces are placed in the same spot on the screen, the final image will look like:
I haven't tried this yet... but I foresee at least one problem. When I go to drag the pieces over to this puzzle, they will all "snap" into place when dragged to the same place. Because in reality all I really have here is a picture of a circle inside a ImageView which has some invisible rectangular boundary around it.
Hopefully this situation is clear. Now my questions:
Is it possible to have truly custom shaped ImageViews instead of my idea of overlapping images?
If what I'm thinking is the best way to handle this puzzle idea, then what property can be changed such that the "drop" action does not happen at the same place for all of these puzzle pieces? If I wanted to "drop" the pizza shaped piece, I'd like it to only snap into place when it go close to the top left of the circle.
Note: I am new to Android programming, and somewhat new to Java/XML as well, it’s very likely I’m overlooking something, so please feel free to suggest other approaches as you see fit.
Not really. Overlapping views is generally the way it's done. You could also use one View and override the drawing action yourself (multiple bitmaps drawn at relative locations within the View), but that would make the drag-drop aspect significantly harder.
If the Views are all the same size, with the visible portions in the correct relative placement in each, they should snap together correctly. This is because the snap is (I believe) based on the position of the upper-left corner of the View. If the pizza-shaped piece's visible portion is correct with regards to that, it should snap in at exactly the right spot.
So you have certain places you want to accept the drops, and I'm assuming you know their coordinates, say (d_x,d_y).
Then why not simply monitor the coordinate of the center (p_x,p_y) of image view of the piece you are dragging, say the "pizza" piece, and when the distance between the the piece and drop point is within an acceptable amount accept the drop.
But if you are asking if there is some way to make non-rectangular image views I don't believe that is possible.
However I don't think it is necessary in your case, because I believe even if you want them to drag the piece precisely into place you can calculate the coordinates where the draggable rectangle needs to go with knowledge of the shape of the piece and the assumption that the rectangle wraps the piece.

android MotionEvent when finger enter or leaves view

I wan't to develop game named "Balda".
I have a 2d grid of imageviews (or buttons, maybe).
User should be able move his finger on the grid, and app should know wich images in grid was touched in this move.So, in the picture below is what I'm trying to achieve. A - is start point where user pressed on screen. B is end point where finger leaves the screen. And I need to know what images were touched (There are blue in the picture).
I know that I can do something like this. But I think that this is a wrong solution, because It contradicts the principle of giving functionality by responsibilitys.
I think that it is responsibility of the imageView to know when finger enters its borders and when it is leaving its borders.
I thought, that this would be in android API. And it has MotionEvent like EVENT_HOVER_ENTER and EVENT_HOVER_LEAVE but it's not working with finger. After finger is pressed on some View it will recieve all other MotionEvents, if I get it right.
I think that this is wrong. What can I do to get this functionality? Maybe I could create some custom listeners and custom Views, that supports them?
I think your requirement is slightly similar to custom gridview.
You can try below steps-
1)Create Custom view
2)Attach TouchListener to it.
3)Divide this view into 4*3 matrix.
4)Map your images to this 4*3 matrix
5)Write a function which gives the cell number respective toTouched Co-ordinates
6)After getting cell number;get the mapped image for that cell number
7)Put this image in arraylist
8)When user lifts his finger you will get arraylist of touched images(do whatever you want with it).
9)Remember to put this custom view in your activity
Tell me,if you have any doubt or concern

Curved buttons and a circle

Hey I was wondering if there is any way to do this without going insane with lil buttons built up to make it but basically what I want to do is make two curved buttons around a circle one, is there any way of doing this?
Hers an example of what I kinda want, sorry for how crude the drawing is.
There are two parts in answering this question : how to have buttons looking like this, and getting the touch on the areas you draw.
For the first part, you can use a FrameLayout or a Relative Layout to draw your buttons exactly where you want, and custom images as background (maybe for the circle you can make a ShapeDrawable).
For the second part, it can be very simple : if the Circle (biggest button) is on top of the other two, then this can be ok. But I guess the touchable area on each button will be a rectangle.
Another way to do this is create a custom view, handle the Touch events yourself and based on the X and Y, detect which part has been touched

How can I add a Button to a custom scrolling and zooming SurfaceView?

I wanted to add a custom ImageButton on top of my SurfaceView so it essentially scrolls with the View. The canvas scrolls and zooms with a matrix. How could I go about doing this? Thanks.
Assuming I understand the question correctly, can you not just do button.draw(canvas) in your SurfaceView.onDraw() method? You definitely want to bypass the normal layout engine (because it's terribly slow for moving things around) so you'll also have to fake up hit-detection etc.

Categories

Resources