How to overlay color on texture in libgdx? - colors

I'm using texture and textureAtlas in libgdx.
This textures loads images of white circle.
How can I overlay its color with another color?
Or maybe their is another approach for this?
private final static TextureAtlas textureAtlas = new TextureAtlas(Gdx.files.internal("spritesheet.atlas"));
private final static TextureAtlas.AtlasRegion texture = textureAtlas.findRegion("Bubble.001");
EDIT:
As I said I have a white circle and I want to make it red (without the need for another image with a red circle)

You can use the lerp method in Color class.
actor.setColor(Color.WHITE.cpy().lerp(tintingColor, .5f));
lerp changes your Color object, so use the cpy command before it to preserve the original color. In this case I use WHITE as my original color, which preserves the color of your Actor's texture. lerp will overlay the tintingColor with a strength of 50% in this case.

Related

LibGDX - change the inside color, not border

I have a rounded square texture, drawn in paint, with black border. How can I change only the inner color without changing the border color?
EDIT: I did it, but I want to ask if it can be done without using another texture? I also wonder if there is a connection between this and 9patch as in scaling. Can we use that or is there something like that?
You can tint whatever it is what you are drawing, using SpriteBatch. This means that color you specify is multiplied with the color of the image. For example if your image is a white rounded rectangle with a black border and you tint it using the color purple then the inside will be purple and the border will remain black. You didn't provide enough information to be more specific. But if you are for example using the Sprite class then you can use the setColor method to tint it. Likewise if you are using the Image class. If you are drawing the "texture" directly using SpriteBatch then you can use the setColor method of the SpriteBatch.

MeshBasicMaterial color tints texture map three.js

I'm working with a MeshBasicMaterial to which I have applied a color.
var material = new THREE.MeshBasicMaterial({color: myColor});
at some point I need to add a texture to the material
material.map = new THREE.ImageUtils.loadTexture(...);
this works fine but the color of the material is tinting the texture.
I realise I can change the color of the material to white to remove this tinting but cannot find a a way of deleting the material's color or changing the way the color and texture blend - is this possible ? I'm trying to avoid creating a new material and replacing if possible.
demonstrated in Lee Stemkoski's examples - change map to 'grass' and then change the material color
http://threejs.org/docs/scenes/material-browser.html#MeshBasicMaterial
By the fact you can set the material's .map after the fact, you should be able to set the material's .color after the fact.
material.color = myColor;
Of course, this new color should be white for your texture to be visible and not black.

color blending with GDI+

I am refering to a older question saying color blending with GDI+
Using GDI+ with Windows Forms, I want to be able to draw with a pen and blend color based on the destination pixel color.
For example, if I draw a line and it passes over black pixels, I want it to be a lighter color (like white for example) so that it's visible. When that same line passes over white pixels, it should be a darker color (black for example) so that it's still clearly visible.
the answers says to use a color matrix for transformation
so i started implementing it..
My image is present in raw data format in rgb48
Gdiplus::Bitmap image(input.width,input.height,input.width*6,PixelFormat48bppRGB,(unsigned char*)rgb48);
Gdiplus::Image *images= image.GetThumbnailImage(input.width,input.height);
Gdiplus::TextureBrush brush(images);
Gdiplus::Pen pen(&brush);
Gdiplus::ColorMatrix matrix={
-1.0f,0.0f,0.0f,0.0f,0.0f,
0.0f,-1.0f,0.0f,0.0f,0.0f,
0.0f,0.0f,-1.0f,0.0f,0.0f,
0.0f,0.0f,0.0f,1.0f,0.0f,
1.0f,1.0f,1.0f,0.0f,1.0f,
};
Gdiplus::Graphics gfx(&image1);
Gdiplus::ImageAttributes imageAttr;
imageAttr.SetColorMatrix(&matrix);
gfx.DrawImage(images,Gdiplus::Rect(0,0,input.width,input.height),0,0,1024,1024,Gdiplus::UnitPixel,&imageAttr);
I am not getting what i expect..Can some one help me in finding the mistake i m doing.
You can use the alpha component of a color to specify transparency, so that colors can be combined. However, if you want the combination to be something other than the alpha blend, you must draw the pixels yourself. You could first draw into a transparent bitmap, then render that onto the destination pixel by pixel.

webgl: white border when using transparency (alpha)

When rendering textures that have an alpha-channel, a white border appears around the non-transparent part (the border seems to be the pixels that have an alpha > 0 and < 1):
The original texture is created in illustrator and exported as a png. here it is:
(well, seems stackoverflow altered the image, adjusting pixels that are not completely opaque/transparent, so here is a link)
it is probably the blending, though i dont know what is wrong with the setup:
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
[Update]
Here is a rendered version, where i added a alpha-gradient to the left part of the texture (so it is getting from 0 opacity to 1 until the half)
this texture is the only texture rendered at this position. it seems to be whitest around a=0.5. really weird. the background is just a cleared color:
gl.clearColor(0.603, 0.76, 0.804, 1.0);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// render objects here
the depth-function looks like:
gl.enable(gl.DEPTH_TEST);
gl.depthFunc(gl.LEQUAL);
any ideas? thanks a lot.
[Update 2]
Answering my own question: the effect occurs when the background-color of the canvas or the body of the html-page is white. I don't have an explanation, though.
Use premultiplied alpha and this problem will go away.
See: http://home.comcast.net/~tom_forsyth/blog.wiki.html#%5B%5BPremultiplied%20alpha%5D%5D
This is problem related to texturing linear interpolation. On borders, some interpolated pixels will take half white half green, and 0.5 alpha. You should modify your texture to extend your borders with one more green pixel, even if it is totally transparent.
What's your draw order? This looks like a depth buffering issue to me — you start with a white background, draw the thing with the border so that it's composited on the white, then draw the thing behind the thing with the border. Those areas where the border was blended with the original white background will have stored a value in the depth buffer equal to the depth of their plane, so when the object behind is subsequently drawn, its pixels are discarded in that area.
The general rule is to draw transparent objects after opaque objects, usually from back to front. If you're using additive blending then it's often good enough to disable the depth buffer after the opaque draw and draw them in any order.
When setting the FragColor in the shader, try multiplying the image RGB with the image alpha.

How to draw a transparent rectangle?

How to draw a transparent rectangle in j2me?
Transparency is supported only in immutable images, i.e. images loaded from files. So you can create appropriate image. Or create transparency via filling its transparency parts with background color.
Nokia has some functions that will allow you to draw transparent rects and polygons
http://www.developer.nokia.com/Resources/Library/Java/_zip/GUID-237420DE-CCBE-4A74-A129-572E0708D428/com/nokia/mid/ui/DirectGraphics.html
However if you want it to be a generic solution you should create a transparent image in code and draw it in the appropriate position. Create a int array with size = width*height then fill it with the required color (for example 0x550000ff for semi transparent blue) and create the image using Image.createRGBImage (and setting the last parameter to true).
int[] tmpArray = new int[width*height];
for(int i=tmpArray.length;i--!=0;)
tmpArray[i] = 0x550000ff;
Image transparentRectImg = Image.createRGBImage(tmpArray,width,height,true);
Also don't forget that some old j2me devices do not support alpha transparency even in images.

Resources