How do you use DwmGetColorizationColor?
The documentation says it returns two values:
a 32-bit 0xAARRGGBB containing the color used for glass composition
a boolean parameter that is true "if the color is an opaque blend" (whatever that means)
Here's a color that i like, a nice puke green:
You can notice the color is greeny, and the translucent title bar (against a white background) shows the snot color very clearly:
i try to get the color from Windows:
DwmGetColorizationColor(dwCcolorization, bIsOpaqueBlend);
And i get
dwColorization: 0x0D0A0F04
bIsOpaqueBlend: false
According to the documentation this value is of the format AARRGGBB, and so contains:
AA: 0x0D (13)
RR: 0x0A (10)
GG: 0x0F (15)
BB: 0x04 (4)
This supposedly means that the color is (10, 15, 4), with an opacity of ~5.1%.
But if you actually look at this RGB value, it's nowhere near my desired snot green. Here is
(10, 15, 4) with zero opacity (the original color), and
(10,15,4) with 5% opacity against a white/checkerboard background:
Rather than being Lime green, DwmGetColorizationColor returns an almost fully transparent black.
So the question is: How to get glass color in Windows Vista/7?
i tried using DwmGetColorizationColor, but that doesn't work very well.
A person with same problem, but a nicer shiny picture to attract you squirrels:
So, it boils down to –
DwmGetColorizationColor is completely
unusable for applications attempting
to apply the current color onto an
opaque surface.
i love this guy's screenshots much better than mine. Using his screenshots as a template, i made up a few more sparklies:
For the last two screenshots, the alpha blended chip is a true partially transparent PNG, blending to your browser's background. Cool! (i'm such a geek)
Edit 2: Had to arrange them in rainbow color. (i'm such a geek)
Edit 3: Well now i of course have to add Yellow.
Undocumented/Unsupported/Fragile Workarounds
There is an undocumented export from DwmApi.dll at entry point 137, which we'll call DwmGetColorizationParameters:
HRESULT GetColorizationParameters_Undocumented(out DWMCOLORIZATIONPARAMS params);
struct DWMCOLORIZATIONPARAMS
{
public UInt32 ColorizationColor;
public UInt32 ColorizationAfterglow;
public UInt32 ColorizationColorBalance;
public UInt32 ColorizationAfterglowBalance;
public UInt32 ColorizationBlurBalance;
public UInt32 ColorizationGlassReflectionIntensity;
public UInt32 ColorizationOpaqueBlend;
}
We're interested in the first parameter: ColorizationColor.
We can also read the value out of the registry:
HKEY_CURRENT_USER\Software\Microsoft\Windows\DWM
ColorizationColor: REG_DWORD = 0x6614A600
So you pick your poison of creating appcompat issues. You can
rely on an undocumented API (which is bad, bad, bad, and can go away at any time)
use an undocumented registry key (which is also bad, and can go away at any time)
See also
Is there a list of valid parameter combinations for GetThemeColor / Visual Styles API
How does Windows change Aero Glass color?
DWM - Colorization Color Handling Using DWMGetColorizationColor
Retrieving Aero Glass base color for opaque surface rendering
i've been wanting to ask this question for over a year now. i always knew that it's impossible to answer, and that the only way to get anyone to actually pay attention is to have colorful screenshots; developers are attracted to shiny things. But on the downside it means i had to put all kinds of work into making the lures.
Colorization color != the base color chosen. It's misleading, I know.
But I'm confused. The image you borrowed was from my post entitled "Retrieving Aero Glass base color for opaque surface rendering". Is this not what you want to do? I also indicated in the post the registry location in which all the color information is stored (HKEY_CURRENT_USER\Software\Microsoft\Windows\DWM) for retrieval purposes.
Edited 8/26
DwmGetColorizationColor (dwmapi.dll) returns the "colorization color", which is a blend of various colors (incl. your selected base color) and shader logic to achieve the overall glass effect.
All the color information you need/want can be found in the registry key noted above. The base color, the colors used in blending, and the resulting colorization color are all there.
(The key above is present on Windows Vista and above.)
I believe I have solved the Aero Color. The color given by ColorizationColor is in fact AARRGGBB but it is not being used in the way that you think at all. And in order to solve the final color, you also need to get the Color Intensity as shown here: http://www.codeproject.com/Articles/610909/Changing-Windows-Aero-Color
First step is to parse AARRGGBB. Then take the resulting RGB and convert to HSV. The pure Hue plus Saturation at full brightness is the base color. Now overlay Value as a grayscale at Alpha over top of pure Hue and Saturation to get the Aero color. Then overlay that color over the frame color: rgb(235, 235, 235) at Intensity to get the final Composite Aero color result.
Lastly, I've also provided an example of how to extract a useable toolbar color that matches the Aero frame color, but will always work with black text and other basic Aero features. This is accomplished by limiting Intensity to 35%.
Here is the math:
function dwmToRgb() {
// Input Values
var colorizationColor = "a84f1b1b"; // dwmcolor.clrColor = ColorizationColor
var colorizationColorBalance = 60; // dwmcolor.nIntensity = ColorizationColorBalance
var F = 235; // Frame base grayscale color when Transparency is disabled
// Parse the input values
var A = Math.round(parseInt(colorizationColor.substr(0,2),16)/2.55)/100;
var R1 = parseInt(colorizationColor.substr(2,2), 16);
var G1 = parseInt(colorizationColor.substr(4,2), 16);
var B1 = parseInt(colorizationColor.substr(6,2), 16);
var I = colorizationColorBalance/100;
// Solve for HSV Value and pure Hue+Sat
var V = Math.max(R1, G1, B1);
var R2 = R1*255/V;
var G2 = G1*255/V;
var B2 = B1*255/V;
// Aero Frame Pure Hue: Overlay Value # Alpha over pure Hue+Sat
var R3 = Math.round(V+(R2-V)-((R2-V)*A));
var G3 = Math.round(V+(G2-V)-((G2-V)*A));
var B3 = Math.round(V+(B2-V)-((B2-V)*A));
var hexRGB3 = "#" + ((1 << 24) + (R3 << 16) + (G3 << 8) + B3).toString(16).slice(1);
// Aero Frame Composite Color: Overlay RGB3 # Intensity over Frame base color
var R4 = Math.round(R3+(F-R3)-((F-R3)*I));
var G4 = Math.round(G3+(F-G3)-((F-G3)*I));
var B4 = Math.round(B3+(F-B3)-((F-B3)*I));
var hexRGB4 = "#" + ((1 << 24) + (R4 << 16) + (G4 << 8) + B4).toString(16).slice(1);
// Aero Toolbar Color: Overlay RGB3 # max 35% Intensity over Frame base color
if (I > 0.35) { I5 = 0.35;} else { I5 = I;}
var R5 = Math.round(R3+(F-R3)-((F-R3)*I5));
var G5 = Math.round(G3+(F-G3)-((F-G3)*I5));
var B5 = Math.round(B3+(F-B3)-((F-B3)*I5));
var hexRGB5 = "#" + ((1 << 24) + (R5 << 16) + (G5 << 8) + B5).toString(16).slice(1);
How does A0F040 look to you?
OP Edit: This is how 0xA0F040 looks to me:
Related
Bitmap is constructed by pixel data(purely pixel data). The construction was done by properly setting the bitmap parameters like hieght,width, bitcount etc. Bitmap is actually constructed with CreateDIBsection. And the bitmap is loaded onto a CStatic object having Bitmap as property.
Image is getting displayed with proper width and content. But only difference is the content color is colored instead of scale of gray. For eg image is a white H letter on black Bground, instead of displaying it as whitish, say a blue colored H letter is displayed. Similar color changes applies for different images. Also, sometimes junk colored data appears deviating from original content of image apart from just the color change.
Bitmap is a 16 bit bitmap.
Please see below for code used for creating BitMap.
HDC is device context of CStatic variable in which the created bitmap is loaded;
I directly set the BitMap returned by below function to this variable using setbitmap function. CStatic varibale has also BitMap as one of its property. See below for function used to create bitmap.
Function parameter definitions.
PixMapHeight = number of rows in pixel matrix.
PixMapWidth = number of columns in pixel matrix.
BitsPerPixel = The bits stored for one pixel.
pPixMapBits = Void pointer to pixel array.(raw pixel data only! 16 bit per pixel).
DoBitmapFromPixels(HDC Hdc, UINT PixMapWidth, UINT PixMapHeight, UINT BitsPerPixel, LPVOID pPixMapBits)
BITMAPINFO *bmpInfo = (BITMAPINFO *)malloc(sizeof(BITMAPINFOHEADER) + sizeof(RGBQUAD) * 256);
BITMAPINFOHEADER &bmpInfoHeader(bmpInfo->bmiHeader);
bmpInfoHeader.biSize = sizeof(BITMAPINFOHEADER);
LONG lBmpSize = PixMapWidth * PixMapHeight * (BitsPerPixel / 8);
bmpInfoHeader.biWidth = PixMapWidth;
bmpInfoHeader.biHeight = -(static_cast<int>(PixMapHeight));
bmpInfoHeader.biPlanes = 1;
bmpInfoHeader.biBitCount = BitsPerPixel;
bmpInfoHeader.biCompression = BI_RGB;
bmpInfoHeader.biSizeImage = 0;
bmpInfoHeader.biClrUsed = 0;
bmpInfoHeader.biClrImportant = 0;
void *pPixelPtr = NULL;
HBITMAP hBitMap = CreateDIBSection(Hdc, bmpInfo, DIB_RGB_COLORS, &pPixelPtr, NULL, 0);
if (pPixMapBits != NULL)
{
BYTE* pbBits = (BYTE*)pPixMapBits;
BYTE *Pix = (BYTE *)pPixelPtr;
memcpy(Pix, ((BYTE*)pbBits + (lBmpSize * (CurrentFrame - 1))), lBmpSize);
}
free(bmpInfo);
return hBitMap;
The supposed output is the figure in the left of attached file. But I am getting a blue toned image as in right(never mind the scaling and exact match issue, put the image to depict the problem).
And also it will be very helpful if I know how RGB values are stored in 16 bits!
You never actually said what format pPixMapBits is in, but I'm guessing that it contains 16-bit values where 0 represents black, 32768 represents gray, and 65535 represents white.
You are creating a BITMAPINFOHEADER with bitBitCount = 16 and biCompression = BI_RGB. According to the documentation, if you set the fields that way, then:
Each WORD in the bitmap array represents a single pixel. The relative intensities of red, green, and blue are represented with five bits for each color component. The value for blue is in the least significant five bits, followed by five bits each for green and red. The most significant bit is not used.
This is not the same format as your source data, and you are doing no conversion, so you get junk. Note that the bitmap format you chose is capable of representing only 2^5 = 32 shades of gray, not 65536, so you will suffer loss of quality during the conversion.
I am new to WP7 development and I would like to know how can I write text to image?
First is it possible to do so?
As in GDI we can write text to image as shown below:
Dim pth As New GraphicsPath()
pth.AddString(txtSample.Text, New FontFamily(DropFont.SelectedValue), 0, Integer.Parse(DropFontSize.SelectedValue), New Point(left, top), StringFormat.GenericTypographic)
But in WP7 as I came to know that GDI is not supported.So how Can I do this?
Edit:
I need to select an image from the pictures hub or take a picture using camera and display it in an image control and write some text and save back with a different name.
Any suggestions are most welcome.
You need to get hold of a WriteableBitmap, which can then be manipulated.
This can be done by either adding a UIElement using the Render method or you can manipulate the pixels directly using the Pixels array.
You probably only need to add TextBlock elements to the bitmap, but if you are curious about pixel manipulation here is how that is done:
I have only experience with pixel manipulation. This is not entirely straight forward, but you access pixel (x, y) in the one-dimensional array by translating y * width + x.
The value is in a format called argb32, ie values for alpha-channel (opacity), red, green and blue. Translation between regular Color and argb32 below:
int ColorToInt(Color c)
{
var argb32 = c.A << 24 | c.R << 16 | c.G << 8 | c.B;
return argb32;
}
Color IntToColor(int argb32)
{
const int mask = 0x000000FF;
byte a, r, g, b;
a = (byte)((argb32 >> 24) & mask);
r = (byte)((argb32 >> 16) & mask);
g = (byte)((argb32 >> 8) & mask);
b = (byte)(argb32 & mask);
return Color.FromArgb(a, r, g, b);
}
Why do you need them embedded in the Image?
You could simply place your image and Text in a Grid such as:
<grid>
<image source="YourImageSource"/>
<TextBlock Text="Your Text Here"/>
</grid>
That will overlay your image with Text without having to modify the image so you can use it later. It also provides more freedom with bindings etc as you can bind both to different things and switch them in and out independently.
If you are using XNA this can also be done by manipulating the Pixels of the Texture2D the same way as faester said.
I'm drawing an image using rgb pixel data. I need to set transparent background color for that image. What value I can set for alpha to be a transparent image? Or is there any other solution for this?
If I understand what you need, you basically want to turn specific colors on an image transparent. To do that you need to use getImageData check out mdn for an explanation on pixel manipulation.
Heres some sample code
var imgd = ctx.getImageData(0, 0, imageWidth, imageHeight),
pix = imgd.data;
for (var i = 0, n = pix.length; i <n; i += 4) {
var r = pix[i],
g = pix[i+1],
b = pix[i+2];
if(g > 150){
// If the green component value is higher than 150
// make the pixel transparent because i+3 is the alpha component
// values 0-255 work, 255 is solid
pix[i + 3] = 0;
}
}
ctx.putImageData(imgd, 0, 0);
And a working demo
With the above code you could check for fuschia by using
if(r == 255 && g == 0 && b == 255)
I think you want the clearRect canvas method:
http://www.w3schools.com/html5/canvas_clearrect.asp
This will let you clear pixels to transparent (or any other RGBA color) without fuss or pixel manipulation.
an alpha of 0 indications that pixel is completely transparent an alpha value of 255 is completely opaque meaning that it will have no transparency.
if you portions of your image are completely transparent (an alpha of 0) it doesn't matter what you use for the RGB values as long as use an Alpha of 0. On a side note some older windows programs that I have used make an assumption like the upper left pixel or the lower right pixel is to be used as the transparency color. It would then loop through all of the pixels and set the alpha to 0 when it encountered this specific RGB value.
If you use an Alpha of 127 and the image appeared on top of another image it would look like the two images are equally visible or that the bottom image is bleeding 50% of it's colors through to the top image.
Set a variable for alpha if you want to test and see what it looks like when you apply it to the entire image.
I'm trying to generate a color that could highlight an item as "selected" based on the color of the current object. I've tried increasing some of the HSB values, but I can't come up with a generalized formula. Particularly, I have problems when working with white (a brighter white doesn't look much different than a regular white). There's no requirement that says I need to make it brighter, so some sort of "inverse" color would work well too. Are there any standard algorithms or techniques for doing something like this (I'm guessing yes, but I couldn't find any -- I'm not sure if there's a name for this)?
thanks,
Jeff
Maybe the negatif effect:
pseudo:
int red = originalColor.red
int green = originalColor.green
int blue = originalColor.blue
int newRed = 255 - red
int newGreen = 255 - green
int newBlue = 255 - blue
Color negativeColor = new Color(newRed, newGreen, newBlue)
Or adding a blue color-effect:
int red = originalColor.red
int green = originalColor.green
int blue = originalColor.blue
int newRed = 255 - red
int newGreen = 255 - green
int newBlue = 255 - blue + 100
if newBlue > 255 {
newBlue = 255
newRed = newRed - 50
newGreen = newGreen - 50
if newRed < 0 {newRed = 0}
if newGreen < 0 {newGreen = 0}
}
Color negativeColor = new Color(newRed, newGreen, newBlue)
If you're using HSB, try shifting the hue by half the maximum value either up or down, that should give you the "opposite" color (also called the complementary color). However, this doesn't do you any good for the grey spectrum, which has no hue and will thus look identical.
If you do this with both hue and brightness, you will get a kind of "negative", which works in all cases. A true negative would have you "flip" the brightness value around the mid-point, but that doesn't work for medium-gray, which would still be medium-gray.
It not always possible to make a color brighter (what do you do with white?), so shifting both hue and brightness by half is the most reliable if you're looking for contrast.
One technique you can use is to swap the item's foreground (text) color and its background color. If the text and background colors of your item already have a pleasing contrast, the selected item should continue to look good.
(source: wordpress.com)
That is the technique used on this site (Stack Overflow) when you mouse-over the tags in your post. They turn from DarkBlue-on-LightBlue to LightBlue-on-DarkBlue. Try it to see the effect.
You might find the tools at http://www.easyrgb.com/ give you some ideas.
This should be a simple question, but I haven't been able to find a way to make it work.
Essentially, I have a silly localhost page that I use in my webdevelopment. When I am surfing between our development server and my local version of the C# code (redirected from the dev url via host file) I have been known to sometimes forget what 'dev.foo.com' points at - local or server.
So I created a page which will run locally as my default web page's default page, so I can easily identify my localhost from the server.
This page does a lot of things randomly (including generating a character's starting stats for D&D), including setting a random background color. I do this by generating 3 random numbers between 0 and 255, and setting them as the RGB value for the body background color in CSS.
Given the 3 ints R, G, and B, how do I determine R2, G2, and B2 such that the second color will have high contrast with the first? I like having the page have random background colors (it keeps me from getting used to the look of the landing page) but I also like to be able to read the text.
You need a difference in brightness for text to be readable, as color vision itself has too low resolution.
So as an algorithm I'd suggest the following:
Pick a random background color.
Then decide whether it is a light or a dark color. For example you could check whether the average of the three primary colors is greater or equal 128.
For a light color use black text, for a dark one white text.
Update: Here is an example image I made while playing with the split_evenly example of the Rust crate plotters. It shows the colors in Palette99:
"Contrast" is a loaded word. If you just care about being able to read the text, then one easy way is to work in a luminance-based color space like HSL, and pick foreground and background colors with big differences in luminance.
The conversion between HSL and RGB is well-known--see Wikipedia for the details.
If you're talking about actual color contrast, it's not nearly as cut-and-dried (there are a lot of perceptual factors that, as far as I know, haven't been reduced to a single colors space), but I suspect you don't need that level of sophistication.
Check out this PHP solution: Calculating Color Contrast with PHP by Andreas Gohr. It can be ported to any language of course.
He also has a very nice demonstration of his contrast analyzer where you can find some minimal contrast levels to work with.
You can use method GetBrightness() on Color class. It returns a float value from 0.0 (brightness of black) to 1.0 (white).
A simple solution would be:
var color1 = new Color.FromArgb(r1, g1, b1);
var brightness = color1.GetBrightness();
var color2 = brightness > 0.5 ? Color.Black : Color.White;
I did something like this in a Palm OS application. This is what I came up with. It doesn't give you "high contrast" colors but it gives you a background color that's different enough from the text color to be quite readable:
// Black background is a special case. It's fairly likely to occur and
// the default color shift we do isn't very noticeable with very dark colors.
if (backColor.r < 0x20 && backColor.g < 0x20 && backColor.b < 0x20)
{
textColor.r = backColor.r + 0x20;
textColor.g = backColor.g + 0x20;
textColor.b = backColor.b + 0x20;
}
else
{
textColor.r = backColor.r + ((backColor.r < 128) ? 0x10 : -0x10);
textColor.g = backColor.g + ((backColor.g < 128) ? 0x10 : -0x10);
textColor.b = backColor.b + ((backColor.b < 128) ? 0x10 : -0x10);
}
You might not need to do black as a special case for your purposes - Palm's color handling is a bit funky (16-bit color).
These answers are more or less suggesting to use one of the two or three color choices based on whether the color is bright or dark.
I use a bit different approach and it worked elegantly in my case. Here is the implementation.
int color = your_color;
contrastColor = Color.rgb(255-(color >> 16)&0xFF, 255-(color >> 8)&0xFF, 255- color&0xFF);
It's simple and wonderful.
If you flip all the bits, you will get the "opposite" color which would be pretty good contrast.
I believe it's the ~ operator in C#:
R2 = ~R1;
G2 = ~G1;
B2 = ~B1;
Thanks to #starblue !
Here is C# code that I use
public static string GetContrastBlackOrWhiteColorAsHtmlColorCode(Color c)
{
System.Drawing.Color color = System.Drawing.ColorTranslator.FromHtml("transparent");
try
{
if (c.R >= 128 && c.G >= 128 && c.B >= 128)
{
return System.Drawing.ColorTranslator.ToHtml(Color.Black);
}
else
{
return System.Drawing.ColorTranslator.ToHtml(Color.White);
}
}
catch (Exception)
{
}
return System.Drawing.ColorTranslator.ToHtml(color);
}
For best contrast use this code
function lumdiff($R1,$G1,$B1,$R2,$G2,$B2){
$L1 = 0.2126 * pow($R1/255, 2.2) +
0.7152 * pow($G1/255, 2.2) +
0.0722 * pow($B1/255, 2.2);
$L2 = 0.2126 * pow($R2/255, 2.2) +
0.7152 * pow($G2/255, 2.2) +
0.0722 * pow($B2/255, 2.2);
if($L1 > $L2){
return ($L1+0.05) / ($L2+0.05);
}else{
return ($L2+0.05) / ($L1+0.05);
}
}
function get_the_contrast($c1, $c2) {
return (lumdiff(hexdec(substr($c1,0,2)),
hexdec(substr($c1,2,2)),hexdec(substr($c1,4,2)),
hexdec(substr($c2,0,2)),hexdec(substr($c2,2,2)),
hexdec(substr($c2,4,2))));
}
The method above ( AVG(red,green,blue) > 128 ) is not realy good.
private Color GetContrastingColor(Color color)
{
int r = color.R > 0 ? 256 - color.R : 255;
int g = color.G > 0 ? 256 - color.G : 255;
int b = color.B > 0 ? 256 - color.B : 255;
return System.Drawing.Color.FromArgb(r, g, b);
}