Best practices for updating our UI to AutoCAD 2015 new dark theme

[mcicognani]

I'm facing the problem to update some plug-ins to 2015 version and of course, I'd like to make the UI as similar as I can to the new dark theme. Right now I think I will hand-pick the colors from the light and dark theme in AutoCAD, fill some structure inside my plugins and attach a reactor to the COLORTHEME variable. Upon startup, or upon variable change, I'd traverse all of the standard components that populate my UI and change the colors as much as I can do to make them look and feel like Autodesk's. Before going too far, will Autodek publish some official guidelines? It wouldn't hurt having official color codes and some how to applyu such colors to standard UI components. Also, will the Guidelines for Icons already published in ADN get updated? Thanks,

[Rob.O]

I don't have the answer, but this might help with a couple of your questions:

http://through-the-interface.typepad.com/through_the_interface/2014/04/supporting-autocad-2015s-dark...

[mcicognani]

Yep! I've seen Kean's post appearing just a few hours after mine... what a timing! I've seen that Kean also suggested to use an event handler to intercept the system variable change, so I guess this is a best practice and probably the only way that Autodesk will make available to make our plug-ins theme-aware. So far so good. For the theme handling itself kean suggest to use a third-part theme control (I use Windows Forms, not WPF), or to go manual and make your own procedure to change colors on your form controls. I'm giving a look to ComponentOne c1Theme since I'm comfortable with that suite, and the supplied theme editor is good enough to allow you to specify color palettes for general behaviour, but also for each specific windows form control. I built a Dark theme almost identical to Autodesk's, but still not quite. About colors, I'm picking them using a color picker. It seems they used a wide range of greys. As I said in the first post, an official list of used colors and fonts woudn't hurt 😉 However, I'm going to use the dark theme only for custom palettes and CUIx. Other windows, especially if modal, will remain as before using standard Windows colors, as Autodesk did after all.

[andrewpuller3811]

Yes, it would be extremely helpful to have an official list of the colours used for various elements

[mcicognani]

More on UI adaptation to new dark theme...

To whom who cares, there are a couple of xml files under %program files%\Autodesk\AutoCAD 2015\Themes where you can get some color codes used by the new themes.

BTW, I'm facing a new problem: how to manage partial CUIx for both themes

First of all: I noticed that if you manually work on a partial CUIx, let's say custom.cuix, AutoCAD also modify a custom.mnr file (expected) and a new custom_light.mnr file, of equal size.

This maybe suggests that you can personalize a partial CUIx to use both themes, maybe choose different icons for different themes, but I couldn't do it. When I change icon for a custom command, the last icon is used for both themes. I tried to make the personalization under the two different themes, but while the standard icons change accordingly, my custom icons do not.

Is it possible to load two different icons for a custom command? How?

If not, which is the best practice to face this problem? Changing the UI by code?

[Rob.O]

I have found no way within the CUIx to declare two separate icons for a single command element.  The only way I know to achieve this is to create two separate icon resource files named the same as your CUIx file.  One will have the _light appended to the end.  Ex.: CUIMenu.dll and CUIMenu_Light.dll.  The CUIMenu_light resource file is used in the light theme and the other used in the dark theme.

It's a pain to manage two resource files.  It was MUCH easier to throw the icons into the CUIx and have it manage them.  If an icon needed to be updated, simply open the CUIx as a .ZIP document and swap out the icon file!

I haven't done any more research since I got both of my resource files created and everything working.  Hopefully someone will come up with a better solution.

[mcicognani]

More on CUIx images:

In the documentation there is a reference in using two different resources .dll, one with the name of the custom CUIx, let's say custom.dll, and one with the suffix _light to be used for the light theme, i.e. custom_light.dll.

It also make a reference to use 'Image manager' through IUPERS, to import/export images. I tried to use this application but immediately found a few problem: 

- even if the file filter says (*.bmp, *.png), only .bmp are loaded; but pay attention, if you export a standard image from AutoCAD, a .bmp file will be saved, but that file is actually a PNG file. Just give a look at the header or just try to rename those bmp to png.

Said that: if you use PNG for your new images, just rename them to BMP if you need to load them through the Image Manager of IUPERS.

- the imported images are mixed with the standards one when it's time to choose them for a command (images grid on the right). You'll find some new images with other names or standard images with the name of new imported images... a mess... I'll build a new CUIx from scratch to see if things go better;

- the image manager seems to work with the CUIx file, but I cannot work with the two separated resource dlls mentioned in the help; is there a way to use IUPERS' Image manager to work with two distinct sets of images?

Next step will be to try to build a couple of resource DLLs and see if AutoCAD is smart enough to use them. I'll keep you posted!

[mcicognani]

Posted my message a few second later...

So the double resource DLLs seems to be the only way... too bad indeed.
Thank you anyway!

BTW, how to you setup the project in VS? A class library with only resources or you need a startup class?

[mcicognani]

Built the DLLs, but something isn't working, so far I did:

• created a C++ WIN32 project
• set linker option /NOENTRY
• added resources of type BITMAP, but actually loading PNG. The resources however are correctly shown inside VS
• set the ID identifiers to something usable, i.e. VS assign something like IDB_PNG1, I changed the resource ID to IDB_INFO

I compiled the dll and copied in the same folder as the partial CUIx, with the same name. I also made a copy and named with the _light suffix.
So we have custom.cuix, custom.dll and custom_light.dll.

I loaded the partial CUIx and launched IUPERS.

Now, how can I use the resources? I thought using the ID, like IDB_INFO in place of the image name, but didn't worked.

What am I missing? Can I use the PNG files? Should I use IDs with a special sintax, like RCDATA16_something?

[Balaji_Ram]

Hello,

Here are steps to create a resource-only dll. Please note the way the bitmap is named.

<<<

Here are the instructions for creating a resource only dll file:
1. From the File menu, select New -> Select Project.
2. In the Project dialog, choose a name and the directory for the project.
3. Set Project Type to "MFC DLL" and press OK.
4. Press Finish.
5. From the menu bar at the top select Project->Add Resource->Bitmap->New  to add a new Bitmap resource to add your new bitmaps, or Project->Add Resource->Bitmap->Import to add existing bitmaps.

6. Select Project->Properties->Linker->Command Line, then select Configuration->All Configurations. In the “Additional Options” edit box manually add /NOENTRY
7. Add all your bitmap files to the *.RC file.

NOTE: The bitmap names are very important. If you add/import a resource in Visual C++, the default name will be: IDB_BITMAP1. The name itself is not important, but in order for AutoCAD to find the bitmap, the name must be preceded and followed by quotation marks as in "WBTESTLINE_BMP". 

>>>

Here is a related blog post :

http://adndevblog.typepad.com/autocad/2012/12/using-unmanaged-dlls-for-resource-only-dlls-used-by-au...

I am not sure if png can work, but please try renaming with quotes. I have attached a sample project.

Regards,

Balaji

[mcicognani]

Hi Balaji,

thank you for your reply.

I indeed confirm that the DLL from your test project works.

The double quotes really strikes at me! In the .rc file the quotes are actually stripped off and do not compare, but indeed resources without the double quotes don't work!

I'll try to achieve the same result with VS2013 if possible.

Thank you again,

Massimo

[mcicognani]

So it works also with VS2013. I discovered that the double quote surrounding the UID allow VS to omit a numeric declaration of that symbol in resource.h, where usually those UIDs are mapped to an integer.
If you have a number of UID and don't want to surroud every UID, you can simply comment out all of the declaration in resource.h and you'll get the same result.

Unfortunately, PNG doesn't seem to work, only BITMAP resources are allowed.
I tried to just rename the PNG in BMP, as Autodesk seems to do, but the rc compiler doesn't buy it and stops with error.
Too bad, so we're going to loose the alpha channel, while Autodesk can use PNGs apparently without a problem... not fair!!

[mcicognani]

Another problem trying to adapt to new themes:

So, I built the two dll as resource only and loaded with bitmaps, one named as the CUIx (ie: custom.dll) and the other named with _light suffix (ie: custom_light.dll).

During the CUIx personalization I can use the resource ID to load the appropriate bitmap that will be loaded from the appropriate dll based on the current active theme.

So far so good, but when I switch theme on the fly using the COLORTHEME variable, I expect that the bitmaps would be reloaded from the correct DLL, but it's not, the previuos set are kept in place. Still, if you dummy change the CUIx, the bitmaps are force reloaded from the correct DLL.

What did I miss? Why the bitmaps are not reloaded automatically?

For your information, right now I'm experimenting with commands and standard toolbar, but it shouldn't make any difference, or not?

[Balaji_Ram]

Hello,

I haven't tried using a PNG with alpha channel from a resource dll but would like to give it a try.

Is it possible for you to share such a sample PNG ? Please do not send any information that you consider confidential. 

I had contacted our engineering about the colors used by AutoCAD for its Light and dark themes. It seems the color values were not easily retrievable and were part of the WPF brushes created in xaml files. Now I have received a dump of the color values from my colleague in engineering as two text files which I have attached.

It is hard to use this information especially since you will need to guess the brush that is used by a particular item by its name.

To make it a little easier, I created a WPF application that displays all the colors from the text dump in a rectangle which might help. You will still need to know the color you are looking for but you will get its exact value.

 

I have attached the WPF application. 

Regards,

Balaji

[Balaji_Ram]

Hello,

"Another problem trying to adapt to new themes:"

Yes, I have seen such behavior when switching color theme.

This behavior has already been logged in our internal database for our engineering team to analyze.

Regards,

Balaji

[mcicognani]

Hi Balaji,

thank you for your reply.

I attached a couple of PNG with transparency. Internally AutoCAD can use PNGs, for sure, since the files exported from _cui are PNGs even if the files are named .bmp.

Your engineers should just clean the path, allowing PNGs and BMPs as resources and importing and/or exporting PNGs with the right extensions. Before AutoCAD 2016 if possible...

Now, what should I do? Your collegues at Exchange Store team keep asking me when will I release our plugins for 2015, but today I don't have a valid method to adapt CUIx bitmaps to the different themes.

What should I do? Wait for Autodesk to fix this? Use neutral bitmaps that will work on both themes? Publish the plugins just for the light theme and warn users that on dark theme the bitmaps may be difficult to read?

Regards,

Massimo

[Balaji_Ram]

Hi Massimo,

I will try using the PNG images in a resource dll and get back to you at the earliest. If I cant get it to work, I will need to contact our engineering team to find a way to work with such PNG. I would suggest using a BMP without transparency for now if that isnt too much work for you and get it going with the exchange store. Meanwhile, we will try and resolve this.

Regards,

Balaji 

[mcicognani]

Hi Balaji,

I've already converted all the PNGs in BMPs, no problem, but still, more often than not, I need a different BMP for each different theme.

I'm not really concerned about using PNG or not, but the lack of a mechanism to switch BMPs according to the theme selected by users.

I'd suggest to aim your efforts to the last problem, the first is just an aesthetic matter.

Since I don't see a rapid solution here, I'll try to build bitmaps readable on both themes and go ahead. I'll update the graphics when possible.

Best regards,

Massimo

[Balaji_Ram]

Spoiler

"I'd suggest to aim your efforts to the last problem, the first is just an aesthetic matter."

Did you mean this behavior that you mentioned ? 

Spoiler

"...when I switch theme on the fly using the COLORTHEME variable, I expect that the bitmaps would be reloaded from the correct DLL, but it's not, the previuos set are kept in place..."

I have logged this in our internal database already.

Regards,

Balaji

[mcicognani]

I've found a workaround for the BMP automatic switch.

As reported earlier, the personalization through _cui goes well in both themes, but when you switch theme using COLORTHEME, only the last set of bitmaps are retained.

As far as I know, the bitmaps are copied from the external sources (dll or file) and compiled into .mnr files, that exist in two flavour, one for dark and one for light theme, so I thought there was something not working with these files...

The workaround is this:

- select the dark theme;

- personalize your CUIx (in this example we call it custom.cuix), and exit _cui command;

- copy the custom.mnr file in a safe place;

- switch to the light theme;

- enter the personalization again and apply a dummy change, just to force _cui to reload the bitmaps from the correct dll;

- exit _cui, notice that both custom.mnr and custom_light.mnr has been touched, however they are not the same;

- copy back the first custom.mnr you kept away overwriting the last;

Now everything should work, and switching COLORTHEME will update the bitmaps correctly;

Just remember: this works until your next personalization, because both .mnr will be touched and you'll need to repeat the steps to preserve the .mnr relative to the appropriate theme. Just keep the right files away and copy them back when finished.

It's not a definitive workaround, but it may suggest Autodesk where to look! 🙂

Regards,

Massimo