Get the pixels of a string - java

While doing some stuff with the drawstring() method, I was wondering if there was a way of to extract a pixel array from a string parameter, so that the return type could fit into a 2d pixel array?
The method also needs to work with sizing and coloring.
I have already managed to draw the string to a graphics parameter that has a pixel listener attached to it, using drawstring() and then simply getting the data from that specific area.
But I was wondering if their is a way to get the pixels without having to draw it?
I want to be able to add effects like waves, 3d rotations and cool particles effects using the pixel engine i have, so to draw and then grab the pixels takes to much update space!
And remember that the string will be scaled, colored and transformed before it is extracted to a pixel array, so drawing the string once wont work.

The act of drawing a string is complex. The text data in the string first has to be decoded into a sequence of glyphs in a given font. These are then rasterized by intersecting lines with the font's curve definitions at the scale your are rendering it. (Actually, with a process called "hinting" this is even more complex.) Once you have rasterized the glyphs you have the array of pixels you can then send to the display device.
What you want to do is to interrupt this process in the middle by transforming the text into a set of curves which are created from the font glyphs. Code like the following will give you the curves:
Graphics graphics;
Font font = new Font("ComicSans", Font.PLAIN, 12);
GlyphVector vector = font.createGlyphVector(graphics.getFontMetrics(font).getFontRenderContext(), "Lorem ipsum");
Shape shape = vector.getOutline();
// transform shape

Related

How do I create a color clipping mask on a loaded png image in processing?

Im using processing with java. I have a transparent background png drawing I made, it sort of looks like an abstract leaf, sort of like matisse. I know how to create shapes with random colors chosen from an array, so i can display that shape with different background colors for each frame in a loop, saving each. what I want to do next is create another layer over the drawing that is populated with a random color from my array, but to have that layer display only on the pixels from the underlying png that is loaded.
the end result is the ability to put out an endless number of randomly colored versions of that leaf design, with a random background color. I just havent figured out how to create this kind of clipping mask effect.
You can use the leaf image as a mask for the dynamically colored object. This will apply the alpha channel (transparency) to the masked image. mask operates on images, so you’ll need to draw your color fill to a PGraphics or PImage and apply the mask to that image.
Depending on the specifics of the effect you’re trying to achieve, you might also be able to simply apply a color tint to the leaf image to change to the desired color.

How to draw text in world coordinate space?

I'm creating a game in libGDX. I want to create some UI elements (buttons and stuff), because of my app design, I would like to draw them in the world space, as other game objects.
I'm using Freetype generator that generates a bitmap font from true type font files(.ttf). The problem is that the dimension of the font is in pixels.
Orthographic camera that I use to to render the world, has viewport size of approximately 10x10, so when I generate a font at the size of 10, it covers almost whole screen(too big) and also looks very ugly because generated bitmap for the font is too small (too few pixels).
What I want is to create sprite, draw it at same size(world space) and draw text over it, and basicly create a button.
Is there some well established way how to deal with this?
Thanks to clarifying comments, I've came up with the solution.
I took a point at which I wanted to draw the text, projected it to the screen space by my world camera. Then I flipped y axis by:
point.y = viewportHeight - point.y;
Then I unprojected it with ScreenViewport (separate viewport for drawing the text, is uses camera of the size of the screen so 1unit == 1pixel).
Now I can draw text in projection where 1unit = 1pixel, on the point that is at the same place on the screen as previously chosen point in world space.
I also wanted to be able to draw text inside rectangular boundaries. For this I chose another point. At this point text should end. Did the same procedure as with start point, and then calculated width
targetWidth = endpoint.x - startpoint.x;
Then I used GlypthLayout class to get actual width of my text at some(generated) font size.
actualWidth = glyphLayout.width;
And when I scaled font like this
font.getData().setScale(targetWidth / actualWidth);
my font get scaled so drawed text is wide as target width.
But be aware of another problem! When I generate bimap font via FreetypeGenerator with size bigger when approximately 300, some letters don't draw, and are missing. (probably bug).

How can I get a certain RGB value from a canvas painted with LinearGradientPaint?

I have used the LinearGradientPaint class to draw a rectangle dynamically filled with user-defined colors. This happens by overriding the paintComponent method.
Here is how it looks like:
.
You can see the small thumbs/ handle on top. The user can move these around, delete them, and add new ones. They can also change the color. As a result the user can completely customize how the gradient looks like. This works just fine so far, no issue.
What I need now, and I tried searching for this info, is to get RGB-values anywhere on this gradient.
I only know the x-amount of colors that LinearGradientPaint uses to generate the gradient. I know at what point (fraction) these colors are located (the number below the gradient box, corresponding with the 'thumbs' on top.
Is there anyway to get the colors in between the RGB-values which are used to generate the gradient? In my example above I mean the darkened red or green areas.
If this really is a linear gradient between new Color(r1,g1,b1) and new Color(r2,g2,b2), then the colour at x, where 0 <= x <= 1 is
new Color((int)(r1*(1-x)+r2*x),(int)(g1*(1-x)+g2*x),(int)(b1*(1-x)+b2*x));
Of course, I have no idea whether this is the formula that is actually used inside LinearGradientPaint - but it ought to be something equivalent to this.
A way you might be able to do this, is to create a 1 pixel high BufferedImage of the same width of your component, render the gradient to it and simple use something like BufferedImage#getRGB.
This will return a int packed color value, which you can then use Color(int) to return a Color object, which makes it easier to extract the color components of the pixel.
Of course, this would all be easier if you used the BufferedImage as your primary output as well, then you would only have to create it once and because you'd be updating the image so it could be rendered to the screen, it would also be up-to-date

Simple image rotation

I am making a game in Java. I made a planet seen from outer space and I want to make it appear like the planet is slowly rotating. But I don't know how to rotate a image. I need a simple command that rotates my image 1 degree around its own center once. Any help?
This is what I want to do:
Image
Take a look at these tutorials:
Java2D: Have Fun With Affine Transform
Coordinate Translations and Rotations: Example Code
Transforming Shapes, Text, and Images
What you are describing is not rotating an image, but changing an image to represent a 3D rotation of the object in the image.
Ideally you wouldn't be working with this as an image but rather as a 3D object with a different camera angle. Then you would simply rotate the camera around the object and display the resulting image to the user.
However if you're set on doing this as an image, then you need to create a different images representing various states of rotation of your planet and have a separate thread that would replace the displayed image with the next one in sequence, at repeated intervals. Search the web for "java image animation" - there are plenty of tutorials on how to do this.
If you want to rotate an image in 2d space, you can use something like this:
Image image = ...
Graphics2D g2d = ...; //
g2d.translate(170, 0); // If needed
g2d.rotate(1); // Rotate the image by 1 radian
//or g2d.rotate(180.0/3.14); to rotate by 1 degree
g2d.drawImage(image, 0, 0, 200, 200, observer);

How can I cut an image using a color pattern?

I am developing a small program which cuts images by the color.
That's will be easiest to explain using this example image:
And I want to create a new image just with the purple form, without the black frame.
Does anyone have any ideas? I am using Java 2D so I think that I need to create an Object "Shape" with the purple area of the first image.
If the image is literally like the one you show, you could:
load the image into a BufferedImage (with ImageIO.read())
create a new BufferedImage of the same size, ensuring it has an alpha layer (e.g. set its type to BufferedImage.TYPE_4BYTE_ABGR)
"manually" go through each pixel in turn in the loaded BufferedImage, getting the pixel colour with getRGB() and checking if it's black
if the colour is black, set the corresponding pixel to transparent in the new image, else to the original colour from the first image (see setRGB() method)
save the new image (with ImageIO.write())
There are fancier ways, but this simple method is nice and understandable and will work fine for images of the type you showed.
You need to use some flood-fill algorithm that finds the boundries of the purple area:
Wikipedia has a page on it with excellent pseudo code and animations.
http://en.wikipedia.org/wiki/Flood_fill

Categories