Intersect detection on a transparent image - objective-c

Here's my issue. I am making a small car game in xcode. I am using around separate 20 .png images as my road. each image is around 600 x 1200 but the road itself is in the centre of the image and it's narrow and winding. I have no idea how I can get the car to detect where it has crossed the edge of the road. I really hope this is making sense to someone.
I don't have any code to share as I am completely stuck on how to do it, and I have been searching everywhere before I came here to ask.
I really appreciate some help.
Thanks
[EDIT** I have attached an image trying to illustrate what I am trying to achieve. As you can see all the white area is transparent as basically if my car crosses the the bounds of the road you die. Hopefully that makes a little more sense

Instead of using an image for your road, try using a single UIBezierPath, which you can construct from lines and arcs. You can then use containsPoint: to determine if any of the corners of your "car", return NO for that method.

Related

White Border on Photoshop Text

I am trying to match the "teletext holidays" in the image below (with the white bits connecting all the letters:
I have achieved the following by going to the layers section, right-clicking the text layer, and select “Blending Options.” Then marking the checkbox next to “Stroke.”
Any hints or tips to point me in the correct direction would be appreciated. I appreciate moving the letters within the font closer together will help so will work on that now.
Any help appreciated.
Update:
Made the letters appear closer together. However, using stroke is making the black letters "shrink" in size so think a different solution is required. Thoughts?
With regard to that final image and the black letters appearing smaller. When applying the stroke, tick to indicate that it should be outside and not center or inside
And with helping to ensure that the white parts do meet.... Hmm... Well. Difficult to do the horiztonal stroke without it also applying vertically.
I would agree with others that Illustrator would be better but in Photoshop I might try to duplicate the text, make it all white, put it on the layer behind your main text and manually create a horizontal white pattern.
^ I really hope somebody has a better idea for that last bit though.
Alan,
I would like to help you with this issue. First of all your reference design is designed in adobe illustrator not in photoshop because there is some limitation in photoshop for the stroke feature.
So I would like to suggest you design it in adobe illustrator and not waste your valuable time in photoshop for your desired output.
If you need more help regarding it feel free to contact me at niravmistrydata#gmail.com.
Thank you,
Nirav Mistry

wrap photograph into a circle in photoshop

I few years ago (or longer) I create an image where I wrapped an image around itself as in the image attached to make a sort of world. I've tried to duplicate the process but missing the step of wrapping it around. I know that I squared the image and left extra transparent space on both sides. I have the original photoshop file but the layer that I need to know what I did is flattened. Please send me to a tutorial or maybe give me an idea what I did to create this effect. Pretty lame I know!!!
Photo of barn windmill and house.
If your image is landscape, this method will work a lot better.
Make sure the image you're distorting is square, but don't do this by cropping, actually 'squish' the width of the image so that it distorts it slightly.
Then flip the image updide down (180degs)
Then apply a filter: Filter > Distort > Polar Coordinates.
From personal experience it's important to make sure the center of the square has uniform patterns and color to it, this will help avoid too much distortion in the center. Although this can be achieved post-filter.

How to make a PhysicsBody based on Alpha Values

Suppose there there is a scene as follows:
There is a scene with the same size as the frame of the device. The scene has a red ball, which is able to move throughout the 'world'. This world is defined by black and white areas, where the ball is ONLY able to move in the area that is white. Here is a picture to help explain:
Parts of the black area can be erased, as if the user is drawing with white color over the scene. This would mean that the area in which the ball can be moved is constantly changing. Now, how would one go about implementing a physicsBody for the an edge between the white and black areas?
I tried redefining the physicsBody every time it is changed, but once the shape becomes complex enough, this isn't a viable solution at all. I tried creating a two-dimensional array of 'boxes' that are invisible and specify whether most of the area within each box is white or black, and if the ball touched a box that was black, it would be pushed back. However, this required heavy rendering and iterating over the array too much. Since my original array contained boxes a little bigger than a pixel, I tried making these boxes bigger to smooth the motion a little, but this eventually caused part of the ball to be stopped by white areas and appear to be inside the black area. This was undesired, since the user could feel invisible barriers that they seemed to be hitting.
I tried searching for other methods to implement this 'destructible terrain' type scene, but the solutions that I found and tried were using other game engines. To further clarify, I am using Objective-C and Apple's SpriteKit framework; and I am not looking for a detailed class full of code, but rather some pseudo-code or implementation ideas that would lead me to a solution.
Thank you.
If your deployment target is iOS 8, this may be what you're looking for...
+ bodyWithTexture:alphaThreshold:size:
Here's a description from Apple's documentation
Creates a physics body from the contents of a texture. Only texels
that exceed a certain transparency value are included in the physics
body.
where a texel is a texture element. You will need to convert an image to the texture before creating the SKPhysicsBody.
I'm not sure if it will allow for a hole in the middle like your drawing. If not, I suspect you can connect two physics bodies, a left half and a right half, to form the hole.

Is there a way to take an image file and make its background transparent via VB .NET?

We have a system where people are being taken a face shot via a DSLR camera. We need the people's images with transparent background. What we're currently doing is taking the image and editing and cropping it in Photoshop, removing the background image with the Magic Eraser tool.
What I am looking for is a way to parse the image and automatically erase the semi-white background we have, along with the resizing and cropping. Is there some kind of library or code sample that does this without requiring manual intervention?
This is a real complex problem. Like the answer below suggested you'll need to do a fuzzy match on each pixel and set it to be transparent but you also need to detected other nearby pixels to make sure they are not close in color. A white tag on the shirt, white eyelids, hair, pale skin reflecting the flash. All are candidates to be removed by any greedy fuzzy logic.
Think about the Magic Wand tool in Photoshop. How good is it at detecting the edges of the person in the picture? Yeah, and that's the top standard of image editing software with thousands of engineering hours behind it.
This is not a feasible request for a Q&A format, and this is one of those things that humans just do better than machine. BUT, that doesn't mean it's not possible, and who knows, you might be the one to do it. Just don't do it in VB.NET please :)
Some pseudo-code to get an idea of what you need to do:
Bitmap faceShot = Bitmap.FromFile(filepath)
foreach pixel in faceShot
//the following line is where the magic happens, you can do any fuzzy match on the color that suits you
//figure out your color range and do a fuzzy match percentage wise
if (pixel between RGB(255,255,255) and RGB(250,235,215)) //white and antique white
pixel.setAlpha=0
endif
end foreach
You could start with this as a starting point for processing a single image,
http://www.java2s.com/Code/VB/2D/ProcessanImageinvertPixel.htm
Basically, if you have a constant background color (like the TV green-screen), it's just a matter of selecting pixels close to the color you are erasing and setting their Alpha level to 0 (transparent). Treating the RGB values like XYZ coordinates, you can do a 3d distance from your background color, and make everything within a certain threshold transparent.
As an improvement, you could also make everything within another threshold semi-transparent so the edges right around hair and stuff like that look softer and less harsh.
Alternatively, you could probably do the same exact thing with good results in Photoshop, as it should support batch processing.
Edit, thinking about it some more, you may want to use a green screen type background as well instead of an off-white one like you stated, as you may make people's eyes transparent. I would definitely try to batch it in Photoshop/Gimp/etc.

Drawing an Isometric image split into layers

I've seen quite a bit of questions regarding how to draw isometric tiles, and most all point at being drawn back to front, top down. However I'm trying to find a way to prevent clipping with a single isometric image.
While normally drawing a sprite ontop of a single image would not prevent overdrawing on walls and such, I split up the image into 3 layers. A floor, lower wall, and top wall. Where the player checks the floor for collision, is drawn in front of the lower wall always, and drawn behind the top wall always. The result looks like the following
While this seems to work decently well, I'd like to know what the most efficient way to draw these sort of isometric scenes are. I've considered tiles, however that raises the question of how to draw multi-tiled buildings and such. If tiling becomes a better option I will create a new question regarding those questions. For now lets assume I'm using a single image broken into layers.
This is somewhat easier, however, for my artist. To be able to draw a single scene in isometric, and split it up into layers, eliminating the need for a map creator. And then using pixel collision to get precise collision with the enviroment.
Is using a multi-layered scene even a good approach for this? My biggest concern is preventing overdrawing and breaking perspective. I've also seen many good examples of drawing everything using tiles, however then I'm limited to a certain scale, and that arises even more questions. Do you know of the best way to approach this? Should I use tiles instead of a single image split into layers?
I plan to code this in either MonoGame or Processing.
(I would have posted this on gamedev but I can not post images there)