Visual Studio VSPackage icon displays different colors - visual-studio-2017

I am trying to provide an icon for the button that activates my custom VSPackage extension.
When designing the icon, the following colors are used:
Foreground: #fff (white)
Background: #a375e7 (light purple)
When displaying the icon in the button within Visual Studio (Solution Explorer, top), the following colors are seen:
Foreground: #000 (black)
Background: #5c1fb7 (dark purple)
The icon is not disabled.
The icon comes from a PNG file with multiple icons in it. Each icon is 16 x 16 pixels.
Admittedly, I am not an expert on image manipulation so my educated guess is it's something simple concerning image settings at design time, prior to export.
Any ideas?

In order to make icons appear with the correct contrast ratio in the Visual Studio dark theme, an inversion is applied programmatically.
See Color inversion for dark themes in Images and Icons for Visual Studio documentation.
To opt-out from the inversion, you can try to set top-right pixel to cyan (#00FFFF). From IVsImageService2.ThemeDIBits documentation:
Applies theming to BGRA32 device-independent bitmap bits. The luminosity of the image is transformed so that the constant "halo" luminosity blends in with the background. This has the effect of eliminating the halo visually. The "halo" luminosity is an immutable constant, and is not calculated from the input image. Images which contain cyan (#00FFFF) in their top-right pixel are not inverted. Instead, the top-right pixel is cleared (RGBA are all set to 0) and S_OK is returned without otherwise modifying the image.

Related

How Do I Change NavigationBar Color For WatchOS?

I am building watchOS app and I am trying to change navigationBar background color from black to transparent, but I am not able to find anything. I saw this question which was asked in 2015, according to which it is impossible to change navigationBar color in watchOS. I was wondering if now there is any API for that.
Thanks for any help.
This is about Color in the human-interface-guidelines from apple:
Make sure your appโ€™s colors work well in both light and dark
appearance modes. With the exception of watchOS, which always uses a
pure black background, the platforms offer a dark alternative to the
default light appearance. Dark Mode uses a darker color palette for
all screens, views, menus, and controls, and can increase vibrancy โ€” a
subtle effect that dynamically blends foreground and background colors
โ€” to make foreground content stand out against darker backgrounds.
System colors automatically support both appearances; if you use a
custom color, you need to supply both light and dark variants. For
guidance, see Dark Mode.

Text drawn with DWrite is blurry

I was recently developing my own GUI library. The window is created using Win32 API and then Direct2D RenderTarget was created inside. All the drawing (buttons, labels, etc.) happens inside the RenderTarget. Everything is fine except for the quality of the text. When I look at visual studio buttons for example, the text looks so clear compared to DirectWrite method DrawTextW().
Here is an image example:
I use DirectWrite to directly draw text.
`
ID2D1SolidColorBrush* brush;
RenderTarget->CreateSolidColorBrush(D2D1::ColorF(red, green, blue, alpha), &brush);
IDWriteTextFormat* format;
HRESULT h = WriteFactory->CreateTextFormat(std::wstring(font.begin(), font.end()).c_str(), NULL, fontWeight,
fontStyle, DWRITE_FONT_STRETCH_NORMAL, fontSize, L"", &format);
// Center the text horizontally and vertically.
format->SetTextAlignment(textAllignment);
format->SetParagraphAlignment(DWRITE_PARAGRAPH_ALIGNMENT_CENTER);
// Draw text
RenderTarget->DrawTextW(std::wstring(text.begin(), text.end()).c_str(), std::wstring(text.begin(), text.end()).size(), format, D2D1::RectF(xPos, yPos, xPos+width, yPos+height), brush);
brush->Release();
format->Release();
`
I was just wondering, is this something that I should just accept and move on or do I have to tweak something with DWriteFactory?
It appears that you have high-DPI monitor and haven't defined proper manifest for your executable. By default Windows will think that your app is designed for old 96ppi systems and so each "pixel" will span four physical pixels if your monitor uses 192ppi for example.
Check this for how to add high-DPI awareness to your application.
In Visual Studio 2015 and above there is a flag in project settings: "Configuration Properties > Manifest Tool > Input and Output > DPI Awareness"

How to set notification icon background of windows 10 application as transparent?

I built simple c++ Windows Form project with Visual Studio 2015.
My application has toast (Windows 10), and that shows icon like this.
Application icon has transparent background.
How can I remove blue background of icon?
Source Code: https://github.com/chaeyk/SoundDeviceToggle
Apologies, A bit late BUT ... in my effort to try and help๐Ÿ˜
... Did you try both a transparent pixel PNG?png here
... and/or a transparent pixel GIF?gif here
( see 2 attached 1x1px images )
NOTE: I'm not sure what filetype you may need, but the same instance applies. If anyone wants me to supply a transparent image of a certain type eg. png, ico etc let me know.๐Ÿ‘
Else, you can easily generate transparent PNG's ...
https://png-pixel.com/
and
https://onlinegiftools.com/create-1x1-pixel-gif

Color Picker / Choser for an OpenGL Application

I am building an OpenGL application. I read through the GLUI tutorial on Code Project to create windows form controls on an OpenGL Application. But my requirement is to develop a color choser/picker, like an RGB chart or RGB cube to select a color. The tutorial on Code project shows the list of colors as a drop down box. However that wont really help me, as I require it to be present as a windows color picker. I know that color picker as a dialog box is a part of the windows application. Can anyone suggest me a way to use it with my OpenGL Application?
You can try fox-toolkit. It is a C++ based Toolkit for developing Graphical User Interfaces. It provides Color Picker and OpenGL widgets for 3D graphical manipulations.
On windows, you can call directly ChooseColor() from the windows API. It will open the native color color chooser.If you need a cross-platform solution, tiny file dialogs on sourceforge also has a color picker and no main loop.
You could render a Quad/Triangle/Cirle with different color on each vertex and activate smooth shading for interpolation between these points. Then just read back the color value from OpenGL at the mouse position.
edit: or like that where you calculate the color on the mouse position by yourself (reading values slows down OpenGL a lot!): http://sharathpatali.wordpress.com/2009/07/07/a-color-picker-for-pymt/
I did this with simple gradient image which i kept in memory. Then i just tracked my mouse position on the image, and simply read the data from the image (that was kept in RAM) and get the 32bit RGBA color value for it. This is easier than reading the pixels from screen (also faster and more reliable).
This also allows a lot more flexible way of presenting the palette, only your imagination is the limit on the looks of your palette. Note: you must use 32bit colors on the image, because if you want smooth edges, you simply just fade the alpha but keep the colors the same, so the colors wont get distorted at edges. Don't forget to enable blending when rendering the image.

win32 c++ owner draw button with transparent image

i've implemented a owner draw button into my win32 app (no MFC). The button is a normal 20x20 bitmap (round icon with transparency). The problem is that the button is positioned on a solid background and i can see the buttons gray background (since the bitmap is round). I've tried responding to WM_CTLCOLORBTN with NULL_BRUSH but no luck.. I've tried displaying the button using a bitmap and a ico file but wont budge.. Does anyone know how to solve this problem?
This is my problem, the settings icon should be transparent at the edges (not white/gray)
It sounds like you're trying to make a non-rectangular control.
You could call SetWindowRgn to tell Windows that your control is non-rectangular.
In addition to what #joel's answer, if you want to make some area transperant put a unique color in the area where you want to have transperancy using some image editors (RGB(0xFF,0x00,0xFF)) is mostly used Then use TransperantBlt
You say it's a solid background but your image shows some kind of orange-yellow gradient as a background. If it really was a standard windows button solid color you can load the bitmap with LoadImage using the LR_LOADMAP3DCOLORS or LR_LOADTRANSPARENT. Since you have a gradient you'll have to use a more complicated technique to mask out the bitmap.
http://www.winprog.org/tutorial/transparency.html