Bubbles like smoke ..2D effect. How to? - game-engine

I'm new to game programming..What I want to achieve is an effect like bubbles which behaves like smoke in 2D. I will explain...I don't want a realistic effect or fog. I want to do something like bubbles in the background which fly in the sky and become bigger and bigger and move like they are suspended in space. They become bigger until they reach some size.
Something like this
What is the best way to achieve this ? Is there somewhere in the skynet? Some examples or ready effects? Where to start ? I program in Java but even though the examples are in C++ or other languages it really doesn't matter.

I assume you have a method to draw already, like openGL or Canvas.
You probably want to create the balls as objects with variables like x,y,size etc. Then when you draw it, make sure you updated these variables, by for example increase the size if you want it to become bigger, or the x if you want it to move to the right.
Other option is to create an animated image like a .gif ofcoarse.

Related

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.

The Right Way To Draw Normals In OpenGL?

Right now I am writing a program in OpenGl. I'm rendering some-what complex 3D figures from files. After triple checking the code, I know that all the values are being read right. The only thing thats acting weird is the normals. I'm drawing them like this:
glVertex3fv(vert1);
glVertex3fv(vert2);
glVertex3fv(vert3);
glNormal3fv(norm1);
glNormal3fv(norm2);
glNormal3fv(norm3);
The values are being read from GLFloats. Tell me the right way, or at least what I'm doing wrong.
When you call glVertex, that finishes a vertex, so you need to set all the other vertex state before that. You need to set the normal for a vertex before finishing it.
It should look like this:
glNormal3fv(norm1);
glVertex3fv(vert1);
glNormal3fv(norm2);
glVertex3fv(vert2);
glNormal3fv(norm3);
glVertex3fv(vert3);

Create mock 3D "space" with forwards and backwards navigation

In iOS, I'd like to have a series of items in "space" similar to the way Time Machine works. The "space" would be navigated by a scroll bar like feature on the side of the page. So if the person scrolls up, it would essentially zoom in in the space and objects that were further away will be closer to the reference point. If one zooms out, then those objects will fade into the back and whatever is behind the frame of refrence will come into view. Kind of like this.
I'm open to a variety of solutions. I imagine there's a relatively easy solution within openGL, I just don't know where to begin.
Check out Nick Lockwood's iCarousel on github. It's a very good component. The example code he provides uses a custom carousel style very much like what you describe. You should get there with just a few tweaks.
As you said, in OpenGL(ES) is relatively easy to accomplish what you ask, however it may not be equally easy to explain it to someone that is not confident with OpenGL :)
First of all, I may suggest you to take a look at The Red Book, the reference guide to OpenGL, or at the OpenGL Wiki.
To begin, you may do some practice using GLUT; it will help you taking confidence with OpenGL, providing some high-level API that will let you skip the boring side of setting up an OpenGL context, letting you go directly to the drawing part.
OpenGL ES is a subset of OpenGL, so essentially has the same structure. Once you understood how to use OpenGL shouldn't be so difficult to use OpenGL ES. Of course Apple documentation is a very important resource.
Now that you know a lot of stuff about OpenGL you should be able to easily understand how your program should be structured.
You may, for example, keep your view point fixed and translate the world (or viceversa). There is not (of course) a universal solution, especially because the only thing that matters is the final result.
Another solution (maybe equally good, it depends on your needs), may be to simply scale up and down images (representing the objects of your world) to simulate the movement through the object itself.
For example you may use an array to store all of your images and use a slider to set (increase/decrease) the dimension of your image. Once the image becomes too large for the display you may gradually decrease alpha, so that the image behind will slowly appear. Take a look at UIImageView reference, it contains all the API's you need for it.
This may lead you to the loss of 3-dimensionality, but it's probably a simpler/faster solution than learn OpenGL.

Translate Colors to Image?

Im not sure how else I should approach it, but if I was to (in my mac application) have a grid of NSViews, which the user can change the colour of each, is it possible to then translate this, so now I have been given a colour for each pixel by the user, make this into an exportable image?
I honestly can't think of how else to do this. I don't want to go ahead an realise I have taken a rather foolish path.
The idea is I will have a grid of squares which the user can paint, a colour in each square, a square representing a pixel in the final image. So they paint with like a paint bucket filling each one, then export it into an actual image file.
Any help much appreciated, thanks.
A grid of NSViews sounds really heavy for what you're doing. Why not write one single custom view that checks the mouse position and modifies the data appropriately? Then you'd write a custom drawing method to fill the custom view, and you could use the same exact draw method to write to an NSImage which you could export.
You'll need to do a bit o' math. For each "pixel", call -set on the appropriate NSColor, then use NSBezierPath's -fillRect method. It may help you to get out a pencil & paper to figure out the math for the rect origins & sizes.
Check http://developer.apple.com/library/mac/#documentation/Cocoa/Conceptual/CocoaDrawingGuide/Introduction/Introduction.html for help if you've never done custom drawing before. It's really not that bad, just takes a little reading. :)

How to check the color of a certain part of an image?

I am making a simple game that uses "AI players" (they aren't really AI players). I need to find out if a certain part of the "map" I am using has certain colors, so I can make the "AI players" do certain things. Is it possible to do this?
I don't know if this will help, but a game called "Warcraft 3" uses a very similar thing to determine certain things, such as movement. If you know of this game, it should be a lot easier to understand this question.
I think this may be possible if I put the image into a custom NSView subclass, but I have not yet learned how to check colors there either.
The best way to do this would be not to bother checking the colors of the actual image (which can be an expensive operation if you're checking a lot of individual pixels), but to indicate in your map's data structure the characteristics you want to have, and then take both the color and player behavior from that.
In pseudocode:
// Draw Map
foreach currSquare in listOfSquares:
if map[currSquare].hasPropertyX():
drawSquare(currSquare, blue)
else if map[currSquare].hasPropertyY():
drawSquare(currSquare, red)
// Move pieces
foreach currPlayer in listOfPlayers:
squareIAmStandingOn = currPlayer.square
if map[squareIAmStandingOn].hasPropertyX():
currPlayer.takeActionX()
else if map[squareIAmStandingOn].hasPropertyY():
currPlayer.takeActionY()
Create a NSBitmapImageRep from the NSImage and use colorAtX:y: to get the color.
Check:
NSBitmapImageRep Class Reference